@charset "euc-kr";
@import url("common.css");

#main_container {position:relative;}
#main_container h2 {color:#444; font-size:26px; font-weight:400; font-family:PT sans, Calibri, Tahoma, Verdana, sans-serif;}

/** ¸ÞÀκñÁÖ¾ó **/
#visual {position:relative; width:100%; clear:both; overflow:hidden; max-width:640px; margin:0 auto;}
	.jssorb05 {position: absolute; bottom:20px; left:50%; z-index:999;}
	.jssorb05 div, .jssorb05 div:hover, 
	.jssorb05 .av {position: absolute; width: 16px; height: 16px; border-radius:50px; background-color: #7e7d7d; overflow: hidden; cursor: pointer; margin:0 5px; padding:0; opacity:1; filter: alpha(opacity=100);}
	.jssorb05 div {  }
	.jssorb05 div:hover, .jssorb05 .av:hover {}
	.jssorb05 .av, .jssorb05 .av:hover {background-color: #4664bc; opacity: 1; filter: alpha(opacity=100);}
	.jssorb05 .dn, .jssorb05 .dn:hover {background-color: #7e7d7d; opacity: 1; filter: alpha(opacity=100);} 

	.jssora12l, .jssora12r {
		top:46%;
		display: none;
		position: absolute;
		width: 23px;
		height: 45px;
		cursor: pointer;
		overflow: hidden;
	}
	.jssora12l { background: url('/img/v_arrow_prev.png') no-repeat; left:180px}
	.jssora12r { background: url('/img/v_arrow_next.png') no-repeat; right:180px}
	.jssora12l:hover {}
	.jssora12r:hover { }
	.jssora12l.jssora12ldn {}
	.jssora12r.jssora12rdn {}


/* ¸ÞÀÎ - »óÇ°¸®½ºÆ® */
#main_container .pro_area {width:94%; padding-bottom:0px; margin:30px auto 0 auto; position:relative;}
#main_container .pro_area h3 {font-size:26px; letter-spacing:0; font-family:"PT Sans", Calibri, Verdana, Tahoma, sans-serif;}  
#main_container .pro_area a.pro_more {position:absolute; right:70px; top:2px; width:36px; height:36px; background:url(/m/img/main/more.gif) no-repeat; text-indent:-2222px;}

.list_carousel {width: 100%; }
.list_carousel ul {margin: 0; padding: 0; list-style: none; display: block; overflow:hidden; clear:both;}
.list_carousel li {text-align: center; background-color: #fff; width: 50px; height: 50px; padding: 0; display: block; float: left;}
.list_carousel.responsive {width: auto; margin-left: 0;}
.clearfix {float: none; clear: both;}
.prev {float: right; margin-right: 0px; margin-top:2px;}
.next {float: right; margin-right: 0px; margin-top:2px;}

.pager {float: left; width: 300px; text-align: center;}
.pager a {margin: 0 5px; text-decoration: none;}
.pager a.selected {text-decoration: underline;}
.timer {background-color: #999; height: 6px; width: 0px;}

.pro_area .pro_list {padding:20px 0 0; clear:both;}
.pro_list a:link, .pro_list a:visited {display:block;}
.pro_list dl {width:96%; margin:0 auto; border:1px solid #ddd;}
.pro_list dt {text-align:center;}
.pro_list dt img {max-width:100%;}
.pro_list dd {display:block; text-align:left; padding:12px 10px 15px 10px;}
.pro_list a:link dd div, .pro_list a:visited dd div {font-size:20px; font-weight:600; color:#3b3b3b; overflow:hidden; text-overflow: ellipsis;}
.pro_list a:link dd span, .pro_list a:visited dd span {display:block; font-weight:400; color:777; font-size:16px; padding-top:3px;}

/* °øÁö»çÇ× */
#main_container .notice_area {position:relative; width:94%; padding:40px 3%;}
#main_container .notice_area a.more {position:absolute; right:20px; top:35px; text-indent:-22222px; background:url('/m/img/main/more.gif') no-repeat; width:36px; height:36px; display:inline-block;}
#main_container .notice_list {width:100%; margin:15px auto 0 auto;}
#main_container .notice_list ul {overflow:hidden;}
#main_container .notice_list li {padding:3px 0; position:relative; overflow:hidden;}
#main_container .notice_list li span.date {float:right; display:block; text-align:right; width:15%; font-size:18px; color:#a9a9a9; font-family:PT sans, Calibri, Tahoma, Verdana, sans-serif;}
#main_container .notice_list li a {float:left; width:85%; font-size:18px; height:28px; display:block;}

/* ȸ»ç¼Ò°³_¹è³Ê */
#main_container .company_bn {background:url('/m/img/main/company_bg.jpg') top center no-repeat; height:270px; padding:45px 30px; box-sizing:border-box; }
#main_container .company_bn h2 {color:#fff; font-weight:normal; font-size:28px; padding-bottom:20px;}
#main_container .company_bn p {font-size:15px; color:#babdc3; line-height:140%; padding-bottom:30px; letter-spacing:-1pt;}
#main_container .company_bn a {display:inline-block; padding:10px 20px; border:1px solid #fff; color:#fff;}

/* Äü¸Þ´º */
#main_container .bn_area {width:94%; padding:35px 3%; background:#f6f6f6;} 
#main_container .bn_area h2 {padding-bottom:25px;}
#main_container .bn_area ul {width:100%; overflow:hidden; border-top:1px solid #ddd; border-left:1px solid #ddd;}
#main_container .bn_area ul:first-child {}
#main_container .bn_area li {float:left; width:50%; box-sizing:border-box; background:#fff;}
#main_container .bn_area li:nth-child(2) {box-sizing:border-box;}
#main_container .bn_area li a:link, 
#main_container .bn_area li a:visited {display:block; padding:3% 0px 3% 44%; height:109px; line-height:109px; background-position:12% center; background-repeat:no-repeat; font-size:20px; letter-spacing:-1pt; font-weight:500; color:#666; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}

#main_container .bn_area li a.quick_icon1 {background-image:url('/m/img/main/quick_icon1.gif');}
#main_container .bn_area li a.quick_icon2 {background-image:url('/m/img/main/quick_icon2.gif');}
/*#main_container .bn_area li a.quick_icon3 {background-image:url('/m/img/main/quick_icon3.gif');}
#main_container .bn_area li a.quick_icon4 {background-image:url('/m/img/main/quick_icon4.gif');}*/
.shadow {background:#f1f1f1; height:5px;}


.main_title{background:url('../img/main/title_bg.gif') left top repeat-x;}
.best_title{ background-color:#f9f9f9; padding:10px 0; border-top:3px solid #3c4247; border-bottom:1px solid #ddd}
.best_tit{position:relative; padding-left:10px; color:#333; font-weight:bold;}
.best_tit2{font-size:14px; color:#333}

.set_title{ background:url('../img/set_tit.gif') left top repeat-x; padding:10px 0;}
.set_tit{padding-left:10px; color:#fff; font-weight:bold; font-size:16px;}
.set_tit2{font-size:14px; color:#fffec0}

.main_item{padding:0 0 15px 0; max-width:650px; margin:0 auto}
.main_item div{width:33.3%; float:left}
.main_item div img{width:100%; height:208px;}
.main_item:after{content:" "; display:block; clear:both; height:0; visibility:hidden}
.main_item{_height:1%} /* IE6 */
*:first-child+html .main_item{height:1%} /* IE7 */

.main_bn{background:#e5e6e8; padding:3%;}
.main_bn table{width:100%; max-width:680px;}
.main_bn_left{width:49%; padding-right:1%; text-align:center}
.main_bn_right{width:49%; padding-left:1%; text-align:center}
.main_bn_left img, .main_bn_right img{width:100%; max-width:310px;}

/* main_pro */
.main_pro{float:left; width:33%; height:250px; padding:5% 0 8% 0;}
.main_pro dl{padding:0 5px;}
.main_pro dt{font-size:14px; font-weight:bold;}
.main_pro dd a{color:#888; font-size:12px;}
.main_pro dd .pro_price{font-size:14px !important; color:#333; font-weight:bold; padding-top:3px; display:block;}
.main_pro dd.pro_img{border:1px solid #ddd; margin-bottom:3px;}

.prd_dimg img{width:100% !important; height:auto !important; max-width:800px;}

span.sale_btn{position:absolute; top:-5px; right:10px; width:115px;}
span.sale_btn img{width:100%;}

.sale_img{padding-bottom:15px}
.sale_img img{width:100%;}
.main_pro_img {width:95%; max-width:150px; padding:5px; border:1px solid #ccc; margin-bottom:10px;}
.main_pro_img img{max-width:150px; max-height:150px;}
.main_pro_txt{clear: both !important; *zoom: 1;}



/*******************************************************************************
	@media
*******************************************************************************/

@media all and (max-width:640px) {

}



/*******************************************************************************
	@media 461px~640px
*******************************************************************************/
@media all and (min-width:461px) and (max-width:640px) {


/* ¸ÞÀÎ - »óÇ°¸®½ºÆ® */
.prev {float: right; width:30px; height:30px; margin-top:2px;}
.next {float: right; width:29px; height:30px; margin-top:2px;}
.pro_area .pro_list {padding:15px 0 0;}
.pro_list dd {display:block; text-align:left; padding:10px;}
.pro_list a:link dd div, .pro_list a:visited dd div {font-size:16px;}
.pro_list a:link dd span, .pro_list a:visited dd span {font-size:14px;}

#main_container .pro_area {width:92%;}
#main_container .pro_area h2 {font-size:22px;}  
#main_container .pro_area a.pro_more {right:59px; top:2px; width:30px; height:30px; background-size:30px;}

/* °øÁö»çÇ× */
#main_container .notice_area {padding:35px 3%;}
#main_container .notice_area a.more {background-size:30px; width:30px; height:30px;}
#main_container .notice_list li {padding:1% 0;}
#main_container .notice_list li span.date {font-size:15px;}
#main_container .notice_list li a {font-size:16px; height:22px;}

/* ºü¸¥¸Þ´º */
#main_container .bn_area {width:92%; padding:35px 4%;} 
#main_container .bn_area li a:link, 
#main_container .bn_area li a:visited {display:block; font-size:16px; height:78px; line-height:78px; background-size:63px 58px;}


}


/*******************************************************************************
	@media 320px~ 460px
*******************************************************************************/
@media all and (max-width:460px) {

#main_container h2 {font-size:22px;}


/* ¸ÞÀÎ - »óÇ°¸®½ºÆ® */
#main_container .pro_area {width:92%; padding-bottom:8%;}
#main_container .pro_area h2 {font-size:20px;}  
#main_container .pro_area a.pro_more {right:48px; top:2px; width:25px; height:25px; background-size:25px;}

.prev {float: right; width:25px; height:25px; margin-top:2px;}
.next {float: right; width:24px; height:25px; margin-top:2px;}
.pro_area .pro_list {padding:10px 0 0;}
.pro_list dd {display:block; text-align:left; padding:7px 10px 10px 10px;}
.pro_list a:link dd div, .pro_list a:visited dd div {font-size:13px;}
.pro_list a:link dd span, .pro_list a:visited dd span {font-size:11px;}

/* ȸ»ç¼Ò°³_¹è³Ê */
#main_container .company_bn {background-size:530px 230px; height:230px; padding:35px 25px;}
#main_container .company_bn h2 {font-size:20px;}
#main_container .company_bn p {font-size:13px; padding-bottom:25px;}
#main_container .company_bn a {padding:8px 15px; font-size:13px;}


/* °øÁö»çÇ× */
#main_container .notice_area {width:92%; padding:30px 4%;}
#main_container .notice_area a.more {background-size:25px; width:25px; height:25px; top:25px; right:15px;}
#main_container .notice_list li {padding:1% 0;}
#main_container .notice_list li span.date {font-size:13px;}
#main_container .notice_list li a {font-size:14px; height:20px;}

/* ºü¸¥¸Þ´º */
#main_container .bn_area {width:92%; padding:35px 4%;} 
#main_container .bn_area h2 {padding-bottom:20px;}
#main_container .bn_area li {text-align:center;}
#main_container .bn_area li a:link, 
#main_container .bn_area li a:visited {display:block; padding:55% 0 2% 0; font-size:16px; text-align:center; background-position:center 28%; height:26px !important; line-height:normal; background-size:40%;}


}