
/******************************* layout css  *******************************/

/* layout */
body { font-family:'Nanum Gothic', 'malgun gothic', arial, dotum, sans-serif; -webkit-font-smoothing: antialiased; border-top:3px solid #0e4d99; }
#wrap { position:relative; width:100%; margin:0 auto; }

#header {position:relative; z-index:1; width:100%; margin:0 auto 20px; *zoom:1; }
#header:after { content:""; display:block; clear:both; }
#header .inner {width:1160px; margin:0 auto 15px;  text-align:right;}

#container {position:relative; z-index:0; width:1160px; margin:0 auto; zoom:1;}
#container:after {content:""; display:block; clear:both; }
#container #snb { float:left; width:260px; margin:0; }
#container #contents { position: relative; float:right; padding:6px 27px 0px; width:840px; min-height:600px; background:url("../../img/trend9/contents_bg.png")no-repeat 0 0;}

#footer {overflow:hidden; position:relative; clear:both; width:100%; height:195px; margin:50px auto 0px; background:url("../../img/trend9/footer_bg.png") repeat-x left;  zoom:1; }


/*
#banner { position:absolute; top:174px; left:0; width:80px; min-height:200px; margin-top:20px;}
#quick { position:absolute; top:174px; right:0; width:80px; min-height:200px; margin-top:20px;}
#quick .quick_page_top {margin:5px 0 0; text-align:center;}
*/

/* gnb */
#header .gnb { display:inline-block; padding:5px 0; text-align:center; *display:inline; *zoom:1; }
#header .gnb ul {display:inline-block; margin:0; padding:0; text-align:center;}
#header .gnb ul li {display:inline-block; margin:0; padding:0; *display:inline; background:url("../../img/trend9/gnb_menu_bar.png") 0 2px no-repeat; }
#header .gnb ul li:first-child {background:none !important;}
#header .gnb a {padding:0 4px 0 10px; font-size:11px; font-weight:bold;  font-family:'nanum gothic'; line-height:14px; color:#646464;}
#header .gnb a:hover { color:#8f8f91;}
#header .gnb ul li.last_child a {color:#0e4d99; }


/* logo */
#header h1 {position:relative; display:block; float:left; overflow:hidden;  margin:37px 0 20px 7px; padding:0px 0; *zoom:1;}
#header h1 img {} 


/* nav */
/* remove the list style */

.header_lnb_wrap {float:right; margin: 48px 0 17px 0; }

#nav {float:left; position:relative; z-index:1000; width:936px; height:42px; margin:0px 0 0 0; padding:0 0 0 5px; background:url("../../img/trend9/lnb_bg.png") no-repeat;  font-family:'Nanum Gothic', 'malgun gothic', arial, dotum, sans-serif;}


/* make the LI display inline */
/* it's position relative so that position absolute */
/* can be used in submenu */

#nav ul .bg_top {position:absolute; top:-5px;display:block; width:153px; height:5px; background:url("../../img/trend9/submenu_bg_top.png") repeat-y center top; }
#nav ul .bg_bottom {position:absolute; bottom:-5px; display:block; width:153px; height:5px; background:url("../../img/trend9/submenu_bg_bottom.png") repeat-y center bottom; }
#nav > li {
	float:left; 
	display:block; 
	width:182px;
	_width:100px !important;
	position:relative;
	z-index:500; 
	margin: 0;
	padding:0 0 0 6px;	
	background:url("../../img/trend9/lnb_menu_bar.png") no-repeat left center ;	
	text-align:center;
	*zoom:1;
}
#nav > li.first_child {background: none; padding-left:0;}
#nav li a span {display:; font-size:16px; font-weight:bold; font-family:'nanum gothic'; color:#ffffff; line-height:40px;}
#nav li > a {display:block; width:178px; height:40px;}
#nav li > a:hover, 
#nav li.selected > a, 
#nav li:hover > a {background-color:#; text-decoration:none; }

/* submenu, it's hidden by default */

#nav ul {
	position:absolute; 
	top:-4px;
	left:3px; 
	display:none; 
	width:153px;
	margin:5px 0 0 0px; 
	padding:0px 0px 0; 
	list-style:none;
	background:url("../../img/trend9/submenu_bg.png") repeat-y;

}

#nav ul li {
	width:147px; 
	float:left; 
	padding:0 2px;
}
#nav li.lnb1 ul {left:0; width:178px; background:#fff url("../../img/trend9/submenu_bg_lnb1.png") repeat-y;}
#nav ul .bg_top_lnb1 {position:absolute; top:-5px;display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_top_lnb1.png") repeat-y center top; }
#nav ul .bg_bottom_lnb1 {position:absolute; bottom:-5px; display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_bottom_lnb1.png") repeat-y center bottom; }
#nav li.lnb1 ul li {	width:178px; 	padding:0 0;}
#nav li.lnb1 ul li a { width:178px;}

#nav li.lnb2 ul {left:6px; width:178px; background:#fff url("../../img/trend9/submenu_bg_lnb1.png") repeat-y;}
#nav ul .bg_top_lnb1 {position:absolute; top:-5px;display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_top_lnb1.png") repeat-y center top; }
#nav ul .bg_bottom_lnb1 {position:absolute; bottom:-5px; display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_bottom_lnb1.png") repeat-y center bottom; }
#nav li.lnb2 ul li {	width:178px; 	padding:0 0;}
#nav li.lnb2 ul li a { width:178px;}

#nav li.lnb3 ul {left:6px; width:178px; background:#fff url("../../img/trend9/submenu_bg_lnb1.png") repeat-y;}
#nav ul .bg_top_lnb1 {position:absolute; top:-5px;display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_top_lnb1.png") repeat-y center top; }
#nav ul .bg_bottom_lnb1 {position:absolute; bottom:-5px; display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_bottom_lnb1.png") repeat-y center bottom; }
#nav li.lnb3 ul li {	width:178px; 	padding:0 0;}
#nav li.lnb3 ul li a { width:178px;}

#nav li.lnb4 ul {left:6px; width:178px; background:#fff url("../../img/trend9/submenu_bg_lnb1.png") repeat-y;}
#nav ul .bg_top_lnb1 {position:absolute; top:-5px;display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_top_lnb1.png") repeat-y center top; }
#nav ul .bg_bottom_lnb1 {position:absolute; bottom:-5px; display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_bottom_lnb1.png") repeat-y center bottom; }
#nav li.lnb4 ul li {	width:178px; 	padding:0 0;}
#nav li.lnb4 ul li a { width:178px;}


#nav li.lnb5 ul {left:6px; width:178px; background:url("../../img/trend9/submenu_bg_lnb1.png") repeat-y;}
#nav ul .bg_top_lnb1 {position:absolute; top:-5px;display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_top_lnb1.png") repeat-y center top; }
#nav ul .bg_bottom_lnb1 {position:absolute; bottom:-5px; display:block; width:178px; height:5px; background:url("../../img/trend9/submenu_bg_bottom_lnb1.png") repeat-y center bottom; }
#nav li.lnb5 ul li {	width:178px; 	padding:0 0;}
#nav li.lnb5 ul li a { width:178px;}


#nav li ul h2 { margin:0 2px; border-bottom:1px solid #b4b4b4; }
#nav ul h2 span.hover_tit {display:; font-size:16px; font-weight:bold; font-family:'nanum gothic'; color:#0e4c98; line-height:40px; }

/* this is the parent menu */
#nav li ul li a {
	display:block; 
	width:149px;
	height:15px;
	padding: 8px 15px; 
	font-weight:normal;
	text-decoration:none; 
	color:#414040;
	font-size:12px;
	text-align:left;
}



#nav ul a:hover {
	background-color:#;
	color:#0e4c98;
}

/* fix ie6 small issue */
/* we should always avoid using hack like this */
/* should put it into separate file : ) */
*html #nav ul {
	margin:0 0 0 -2px;
}


/* widget_sub_navi */
.widget_sub_navi {overflow:hidden; font-family:'Nanum Gothic', 'malgun gothic', arial, dotum, sans-serif; margin:0 0 33px;}
.widget_sub_navi .wrap {}
.widget_sub_navi .wrap h3 {display:block; height:74px; margin:0; padding:10px 0 0 18px;  background:url("../../img/trend9/subnavi_title_bg.png") no-repeat 0 0;  font-size:24px; line-height:30px; color:#fff; font-weight:600; text-align:left;  font-family:'Nanum Gothic', 'malgun gothic', dotum, sans-serif;}
.widget_sub_navi .wrap h3 span.first_child { font-size:14px; font-weight:400;}
.widget_sub_navi ul { width:258px;margin:0; padding:0; border:1px solid #dcdcdc;}
.widget_sub_navi ul li { list-style:none; border-top:1px solid #dcdcdc; background:#fff;}
.widget_sub_navi ul li:first-child { border:0;}
.widget_sub_navi ul li:after {display:block; clear:both; content:""; *zoom:1;}
.widget_sub_navi ul li a {display:block; padding:13px 0 14px 10px; font-size:13px; letter-spacing:-1px; color:#484848;}
.widget_sub_navi ul li:hover,
.widget_sub_navi li.selected { background:url("../../img/trend9/subnavi_list_bg.png") #165fa6 no-repeat 225px center;}

.widget_sub_navi ul li a:hover, 
.widget_sub_navi li.selected a {color:#fff; text-decoration:none; background:url("../../img/trend9/sub_navi_list_icon_hover.png") no-repeat right 10px center;}



/* widget_top_location */
.widget_top_location {overflow:hidden; padding:20px 0 5px; margin-bottom:20px; border-bottom:2px solid #3e3e3e;}
.widget_top_location h3 {float:left; width:100%; margin:0; padding:0;  }
.widget_top_location h3 span {display:block; padding-left: 12px; padding-bottom:3px; font-size:26px; font-weight:500; color:#373737; background:url("../../img/trend9/location_icon.png") no-repeat left 5px; font-family:'Nanum Gothic', 'malgun gothic', arial, sans-serif; }
.widget_top_location p.position {position:absolute; top:0px; right:0px; padding:10px 5px 0 0; color:#888; overflow:hidden;}
*:first-child+html .widget_top_location p.position {padding-top:15px;}
span.position_active {color:#848484; font-weight:bold;}
.widget_top_location p.position a {color:#848484;}
.widget_top_location p.position img {vertical-align:middle;}



/* banner_area */
.header_banner_area { position:relative; overflow:hidden; width:100%; height:400px; text-align:center; background:url("../../img/trend9/visual_banner1.png") no-repeat center 0; }
.header_banner_area img {max-width:100%;}


.header_banner_area #visual_text1 {
  position: absolute;
  top: 110px;
  left:380px;
  margin-top: -50px;
  margin-left: 0;
  opacity: 0;
}

.header_banner_area #visual_text2 {
  position: absolute;
  top: 230px;
  left:380px;
  margin-top: 0;
  margin-left: 50px;
  opacity: 0;
}


.snb_sns {overflow:hidden; padding:0px; margin:15px 0 0; }
.snb_sns li {float:left; list-style:none; margin:0 0px 10px 0; }
.snb_sns li.last_child {margin:0px; }


/* top search */
#header .top_search { position:absolute; right:0; bottom:16px; border: 1px solid #ddd; background:#f5f5f5;  }
#header .top_search form { margin:0; padding:0; }
#header .top_search fieldset { float:right; margin: 0; padding:1px 0 0; line-height:0; }
#header .top_search .keyword { width:187px; height:19px; margin: 0; padding:3px 0 0 4px; border:0; background:#f5f5f5; vertical-align:middle; font-size:12px; }
#header .top_search img { cursor:pointer; }




/* 카테고리 */
#category { margin:0 0 20px; }
#category h2 { margin: 0; padding: 0; height:30px; font-size:14px; color:#424242; font-family:"georgia", "times newromans", serif; }
#category h2 span { padding:0 7px 0 0;}
#category .postion { z-index:1; }
#category ul { margin: 0; padding: 0; list-style:none; }
#category li { position:relative; z-index:10; margin: 0; padding: 0;}
#category li a { display:block; padding:7px 0 7px 5px; font-size:12px; color:#333; }
#category li a:hover, 
#category li.on > a { color:#f9425c; font-weight:bold; word-spacing:0; text-decoration:none; }

#category .sub-category {
	display:none;
	position:absolute; 
	top:0; 
	left:160px;
	z-index:90;
	margin:0;
	padding:0;
	width:180px; 
	background-color:rgba(0,0,0,0.7); 
	*background:transparent;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000,endColorstr=#90000000); 
	list-style:none; 
}
#category li.on .sub-category { display:block; }


/* ie7 hack */
*:first-child+html #category .sub-category {background-color:#000;}

/* ie8 hack */
@media \0screen {  
	#category .sub-category {background-color:#000;}
}  

#category .sub-category ul { }
#category .sub-category li { position:static; margin:0; padding:0; }
#category .sub-category a { font-size:12px; color:#f6f6f6;}
#category .sub-category a:hover { color:#f9425c; }


/* widget_latest_normal_post */
.widget_latest_normal_post { position:relative; margin:28px 0; padding:0 0;}




/* footer */

#footer .footer_cs_bar .top { position:absolute; right:-42px; top:58px; margin:0; padding:0; }

/* slide_banner */
.widget_silde_banner {overflow:hidden; width:1160px; margin:0 auto;}
.widget_silde_banner h2 {overflow:hidden; float:left; margin:21px 23px 0 16px;}
#slide_banner {position:relative; overflow: hidden; margin: 0; width:1039px; height: 58px; }
#slide_banner .slide_banner_area {position:relative;overflow:hidden; margin:14px 40px; height: 58px; }
#slide_banner .slide_banner_area h2 {overflow:hidden; float:left;}
#slide_banner ul.slide {position: absolute; width:1000px; margin: 0; padding: 0; white-space: nowrap; font-size: 0; list-style:none;}
#slide_banner ul.slide li.item { display: inline; margin: 0; padding: 0; }
#slide_banner ul.slide li.item a { padding:10px; cursor:default; }
#slide_banner ul.slide li.item a img{vertical-align:middle;}
#slide_banner .button { display: ; }
#slide_banner .prev {position:absolute; top:20px; left:0; }
#slide_banner .next {position:absolute; top:20px; right: 0; ; }



.footer_contents { position:relative; width:1160px; margin:0 auto; padding-top:1px; }

#footer h1 { float:left; margin:16px 55px 0 54px; }
#footer h1 img { max-width:180px; }

#footer .footer_info { float:left; width:900px; padding:18px 0 0px 0; }
#footer .footer_info .menu { overflow:hidden; margin:0; padding:0; list-style:none; zoom:1; height:20px;  }
#footer .footer_info .menu li { float:left; margin:0; padding:0 13px 0 14px; font-size:11px !important; background:url("../../img/trend9/footer_menu_bar.png") 0 1px no-repeat; }
#footer .footer_info .menu li:first-child { padding-left:0; background:none; }
#footer .footer_info .menu li a { color:#6e6e6e; font-size:12px; font-family:dotum;  line-height:18px;  }
#footer .footer_info .address { padding:13px 0 0; color:#6e6e6e; font-family:dotum; font-size:12px; line-height:18px;}
#footer .footer_info .address span {letter-spacing:-0.5px; }
#footer .footer_info .address span.copy_text_bar {padding:0 4px; color:#6e6e6e;}
#footer .footer_info .address span a,
#footer .footer_info .address span a:hover { color:#6e6e6e; }
#footer .footer_info .address .copyright { color:#6e6e6e; }
#footer .footer_info .address .copyright a { color:#6e6e6e; }




/***************************** 퀵메뉴 *********************************/

#quick .quick_add_favorite {overflow:hidden;}
#quick .quick_page_top {margin-top:10px; text-align:center;}


/* orderbasketcount */
.orderbasketcount {display:block; overflow:hidden; zoom:1; font-size:11px; font-family:tahoma; border:1px solid #dfdfdf; margin:3px 0 5px; padding:5px 0; text-align:center;}
.orderbasketcount a,
.orderbasketcount a:hover { color:#7f7f7f; font-weight:normal; text-decoration:none; padding:0 2px 0 0; }
.orderbasketcount strong {color:#f9425c;}


/* productrecent */
.productrecent { border-top:0; margin:0 0 10px; text-align:center; }
.productrecent h2 {display:block; overflow:hidden; zoom:1; font-size:11px; font-weight:normal; font-family:tahoma; border:1px solid #dfdfdf; margin:0 0 5px; padding:5px 0 5px 0; text-align:center; color:#7f7f7f;}
.productrecent ul { width:80px; margin:0 auto; padding: 0; list-style:none; }
.productrecent li {margin:2px 0; padding: 0; }
.productrecent li a { color:#c1c1c0; font-size:11px; }
.productrecent li img { max-width:80px; }
.productrecent li span { display: block; padding:3px 0 9px; line-height:16px; }
.productrecent .player { overflow:hidden; width:80px; margin:0 auto; padding:2px 0; }
.productrecent .player img { float:left; padding:0; }









/* pc_change */
.pc_change_wrap { 
	position:relative; 
	width:1205px; 
	margin:0 auto; 
}
a.pc_change {
	position:relative; 
	display:block; 
	width: 1100px;
	margin-bottom:20px; 
	padding:20px 0; 
	font-size:36px; 
	color:#777; 
	text-align:center; 
	border:1px solid #bbb;
	background-color:#f5f5f5; 
	background:#f5f5f5 -webkit-gradient(linear,0% 0%,0% 100%,from(#fbfbfb),to(#f5f5f5),color-stop(0.5,#f5f5f5),color-stop(0.5,#f5f5f5));
	background:#f5f5f5 -moz-linear-gradient(top,#fbfbfb,#f5f5f5);
}
a.pc_change:hover {text-decoration:none;}
a.pc_change img {vertical-align:middle; padding-left:20px;}



