﻿ul.tabMenu li, #event ul.thumb_list li, #press_read .article ul li, .product_link div.img_area ul li,
.product_link div.txt_area h2 span.name, .share_btns, .product_link div.txt_area h2, 	.product_link div.txt_area, #event .search ul li input
{box-sizing:border-box; /*W3C*/ 
	   -o-box-sizing:border-box; /*Opera*/
	   -ms-box-sizing:border-box; /*Internet Explorer*/
	   -moz-box-sizing:border-box; /*Firefox*/ 
	   -webkit-box-sizing:border-box; /*Safari & Chrome*/ }

input[type="text"], input[type="password"] { border:1px solid #c0c0c0; vertical-align:middle; padding:3px; font-family:'Malgun Gothic', sans-serif; }
label { vertical-align:middle; }

ul.tabMenu { overflow:hidden; width:100%; margin:0 0 10px;  }
ul.tabMenu li { display:inline-block; background:#F1EFDD; color:#96926D; text-align:center; height:37px; font-size:13px; }
ul.tabMenu li a { width:100%; height:37px; vertical-align:middle; display:table; color:#96926D;}
ul.tabMenu li.on a { background:#FFE400 url('/img/product/bg_tabMenu_on.gif') no-repeat 0 0; color:#7d6700; font-weight:bold; }
ul.tabMenu li a span { display:table-cell; vertical-align:middle; }
ul.tabMenu { margin-bottom:20px; }
ul.tabMenu li { width:22%; margin-right:0.3%; }

#event .intro { line-height:140%; font-size:13px; padding-bottom:20px; color:#666; } 
#event .no_contents{ font-size:18px;font-weight:bold;border:0;text-align:center;margin:30px 0;text-align:center;color:#848484; }


#event ul.thumb_list { margin-left:-2%; margin-top:2%; overflow:hidden; }
#event ul.thumb_list li { float:left; width:31.33%; margin-left:2%; margin-bottom:2%; border:1px solid #ccc;}
#event ul.thumb_list li span.txt { display:block; position:relative; padding:20px; background:#fff;  border-top:0; height:75px; }
#event ul.thumb_list li:hover  {  border:1px solid #333;  }
#event ul.thumb_list li:hover span.terms { background-image:url('../img/event/bg_terms_over.png'); }
#event ul.thumb_list li:hover span.date { color:#333; }
#event ul.thumb_list li span.txt h3 { font-size:14px; letter-spacing:-0.5px; color:#222; padding-bottom:15px; line-height:120%; }
#event ul.thumb_list li span.txt h3 img { width:auto; vertical-align:middle; }
#event ul.thumb_list li { position:relative; }
#event ul.thumb_list li a { display:block; position:relative; }
#event ul.thumb_list li a div { position:relative; height:57%; overflow:hidden; }
#event ul.thumb_list li a img  { width:100%;  }
#event ul.thumb_list li a img.real { position:absolute; z-index:3; min-height:100%; max-height:100%; }
#event ul.thumb_list li span.txt p { color:#666; line-height:130%; position:absolute; bottom:15px; left:20px; }
#event ul.thumb_list li p span.terms { display:inline-block; background:url('../img/event/bg_terms.png') no-repeat 0 0; width:34px; margin-right:3px; 
													padding:2px 8px 4px; color:#fff; } 
#event ul.thumb_list li p span.date { vertical-align:middle; }
#event ul.thumb_list li span.txt span.label { position:absolute; top:15px; right:20px; color:#999; }
#event ul.thumb_list li span.type { position:absolute; display:block;  padding:4px 8px 2px;  vertical-align:middle; top:0; left:0; z-index:4; 
												background:url('../img/common/bg_black.png'); color:#fff; font-family:'Gulim', '굴림', sans-serif; font-size:12px; }


#event .search { padding:20px 0; text-align:center; background:#F3F3F3; border-top:1px solid #dedede; border-bottom:1px solid #dedede; 
						overflow:hidden; }
#event .search ul li { width:300px; display:inline-block; }
#event .search ul li.first { width:260px; }
#event .search ul li.second { width:310px; }
#event .search ul li label { padding-right:5px; }
#event .search ul li.first span.wave { display:inline-block; padding:0 5px; }
#event .search a.searching { display:inline-block; font-size:14px; width:50px; text-align:center; height:26px; color:#fff; background:#767676; }
#event .search a.searching span { display:table; width:100%; height:24px;  }
#event .search a.searching span b { display:table-cell; vertical-align:middle; height:100%; font-weight:normal; }
#event .search label { color:#666; }
#event .search input.terms_w { width:80px; }




.pager { clear: both; position: relative; margin-top: 20px; margin-bottom:10px; text-align: center; }
.pager2 { clear: both; margin-top: 20px; text-align: center;  }
.pager span, .pager2 span { display: inline-block; text-align: center; }
.pager span a { display: block; width: 26px; color: #444; line-height: 26px; }
.pager2 .page_list > span { display:inline-block; width:26px; color:#444; line-height:26px; }
.pager span.selected a { background-color: #fff490; font-weight: bold; }
.pager span.disabled a, .pager2 .disabled a { color: #c8c8c8; }

.pager .page_move { float:right; margin-top: 8px; text-align: right; height:30px; line-height:20px; width:180px; vertical-align:bottom; }
.pager .page_move * { vertical-align:bottom !important; }
.pager .page_move span { margin: 0 4px; }
.pager .page_move span a { width: 28px; line-height: 28px; border: 1px solid #c8c8c8; }
.pager .input { width:4em; height: 30px; padding: 4px; border: 1px solid #c8c8c8; text-align: center; }
.pager .submit { display:inline-block; width:64px; margin-left: 4px; padding:4px 0; text-align:center; line-height: 22px; background-color:#333;
						color :#fff;  }
.pager2 .submit { display:inline-block; width:60px; margin-left: 4px; padding:5px 0 6px; text-align:center; background-color:#555; color :#fff; }
.pager input[type="text"], input[type="number"], input[type="submit"], input[type="reset"] { border-radius: 0; -webkit-appearance: none; }
.pager .input { max-width: 100%; padding: 5px 10px; border: 1px solid #c8c8c8; box-sizing:border-box; /*W3C*/ 
	   -o-box-sizing:border-box; /*Opera*/
	   -ms-box-sizing:border-box; /*Internet Explorer*/
	   -moz-box-sizing:border-box; /*Firefox*/ 
	   -webkit-box-sizing:border-box; /*Safari & Chrome*/ }

.article { overflow:hidden; }
.article table.event { width:100%; }
.article table.event th { background:#FAF9E6; color:#7D6700; text-align:left; }
.article table.event th.first, .article table.event td.first { border-top:2px solid #FFDA00; }
.article table.event td, .article table.event th { vertical-align:middle; border-bottom:1px solid #D0CBAA; }
.article table.event th { font-size:13px;  }
.article table.event td, .article table.event th { padding:12px 15px; } 
.article table.event td.body { text-align:center; }
.article table.event td.body img { width:100%;  }
#press_read .article ul.paging { overflow:hidden; margin-bottom:15px; }
#press_read .article ul.paging li { float:left; width:50%; padding:10px; border-bottom:1px solid #D0CBAA; }
#press_read .article ul.paging li > span.marker { display:inline-block; width:55px; color:#7d6700; }
#press_read .article ul.paging li.pre > span.marker { float:left;  } 
#press_read .article ul.paging li.next > span.marker  { float:right; }
#press_read .article ul.paging li.next { text-align:right; }
#press_read .article ul.paging li img { width:5px; vertical-align:middle; }
#press_read .article ul.paging li.next a, #press_read .article ul.paging li.next span.no_link 
{ margin-right:10px; background:url('../img/company/bar_th.gif') no-repeat right center; padding-right:12px; }
#press_read .article ul.paging li.pre a, #press_read .article ul.paging li.pre span.no_link  { margin-left:10px; background:url('../img/company/bar_th.gif') no-repeat left center; padding-left:12px; }
#press_read .article ul.paging li a, #press_read .article span.no_link { font-family:'Gulim', '굴림', 'Helvetica', sans-serif; font-size:11px; line-height:1.7; 
color:#97937c; display:inline-block; }
a.link_list { display:block; float:right; width:90px; height:16px; text-align:center; background:#97937C; padding:6px 0; color:#fff; font-size:13px; } 


/*2016-04-25 지난 이벤트 목록 */
.endevent table { width:100%; margin:20px 0 25px; }
.endevent table th {padding: 10px 15px; border-top:2px solid #FFDA00; text-align:center;  color:#7d6700;  border-bottom:1px solid #d1c891; background:#FAF8EA url('../img/company/bar_th.gif') no-repeat right center; }
.endevent table th.bg0 { background-image:none; }
.endevent table tr td {border-bottom:1px solid #e1deca; padding: 10px 15px;} 
.endevent table tr td.algin_m { text-align:center; }
.endevent table tr td p{display:inline-block; background:url(../img/event/icon_winner.jpg) no-repeat left top #bab690; padding:3px 10px 5px 35px; color:#FFF; margin-left:10px;}
.endevent table tr th, #press_list table tr td { padding:10px; vertical-align:middle; }
.endevent table .bdr0 { border-right:0; }
.endevent table a:hover { text-decoration:underline; color:#333; }
/*2016-04-25 지난 이벤트 목록 end*/



/*2016-03-15 추가 */
.event_read_box{overflow:hidden; width:100%; vertical-align:middle; padding:12px 15px; text-align:center; border-bottom:1px solid #D0CBAA; box-sizing:border-box;}
.event_read_box .old_event_wrap{width:95%; overflow-x:auto; overflow-y:hidden;}
.event_read_box .old_event_wrap .old_event{width:730px; margin:0 auto;}

/*이벤트 상세보기 > 관련 제품*/
.product_link { overflow:hidden; margin-bottom:2%; border:1px solid #bbb;position:relative; width:49%; display:inline-block; height:235px;}
.product_link >  div { float:left; }
.product_link div.img_area { width:45%; text-align:center; vertical-align:inherit; }
.product_link div.img_area > img { width:250px; }
.product_link div.img_area {  }
.product_link div.img_area ul { overflow:hidden; width:100%; position:absolute; left:0; bottom:0; }
.product_link div.img_area ul li { width:49.7%; float:left; margin-right:0.5%; }
.product_link div.img_area ul.link1 li { width:100% !important; }
.product_link div.img_area ul li.last { margin-right:0; }
.product_link div.img_area ul li a { display:block;  padding-top:6px; height:24px; color:#fff;  }
.product_link div.img_area ul li a.go { background:#F0BA00; }
.product_link div.img_area ul li a.buy { background:#BBB287; }
.product_link div.img_area ul li a img { padding-left:3px; vertical-align:middle; }

.product_link div.txt_area { width:55%; position:relative; }
.product_link div.txt_area h2 {  font-size:22px; line-height:100%; color:#000; height:81px;	width:100%;  font-weight:bold; display:table; }
.product_link div.txt_area h2 span { display:table-cell; vertical-align:middle; width:100%; padding-right:10px; overflow:hidden; }
.product_link div.txt_area .details { height:100px; width:90%; background:#f5f5f5; padding:6px; overflow-y:auto; overflow-x:hidden;}
.product_link div.txt_area .details > div { display:block;  height:100%; padding-left:0; vertical-align:middle; line-height:150%; font-size:13px; letter-spacing:-0.05em;}
.product_link div.txt_area .details > div p, .product_link div.txt_area .details > div span{line-height:150%; font-size:13px; letter-spacing:-0.05em;}
.product_link div.txt_area div.btn_4 { height:68px; }
.product_link div.txt_area div.btn_4 a span { vertical-align:middle; }

table.event td h3 { background:url('../img/event/bg_hatched.png'); text-align:center; margin-bottom:20px; }
table.event td h3 span { display:inline-block; background:white; padding:5px 10px; font-size:16px; color:#333; } 

@media screen and (min-width:1001px) {

	.pager .page_move { position: absolute; top: -10px; right: 0; }
	.pager .page_move span { display: none; }
}

@media screen and (min-width:961px) {

#press_read .article ul.paging li a, #press_read .article span.no_link { max-width:80%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
}

@media screen and (max-width:910px) {
	
#press_read .article ul.paging li { float:none; width:100%; padding:10px;  }

}

@media screen and (min-width:769px) and (max-width:1000px) {
	
	.pager .page_move { position: absolute; top: -10px; right: 0; }
	.pager .page_move span { display: none; }

}

@media screen and (min-width:769px) and (max-width:850px) {

	ul.tabMenu li { width:49.8%; margin-right:0.3%; }
	#event ul.thumb_list li h3 b { font-size:13px; line-height:100%; }
	#event ul.thumb_list li span.txt { height:80px; }
	span.date { letter-spacing:-0.5px; }

}

@media screen and (min-width:641px) and (max-width:768px ) {
	
	ul.tabMenu li { width:49.8%; margin-right:0.3%; }
	#event ul.thumb_list li { width:48%; }

	.pager { overflow:hidden; margin-bottom:0; }
	.pager span a { display: block; width: 40px; line-height: 40px; }
	.pager .page_move span { display: none; }

	.article .event_read_box{padding:12px 0;}
	.article .event_read_box .old_event_wrap{width:100%;}

}

@media screen and (max-width:640px) {
	
	#event .intro { display:none; } 
	#event .no_contents{ margin:80px 0;}


	ul.tabMenu { margin-bottom:5px; }
	ul.tabMenu li { width:50%; margin-right:0%; height:auto; }
	#event ul.thumb_list { margin-left:0; }
	#event ul.thumb_list li { width:100%; float:none; margin-left:0; }
	#event ul.thumb_list li img.type { width:25px; top:5px; left:5px; }
	#event ul.thumb_list li span.txt { padding:15px; height:auto; }
	#event .movie_with_micro ul li span.txt { height:80px; }
	#event .friends ul li span.txt { height:85px; }
	#event ul.thumb_list li span.txt h3 { padding-bottom:10px; }
	#event ul.thumb_list li span.txt span.label { top:15px; right:10px; }
	#event ul.thumb_list li span.txt p { color:#666; line-height:130%; position:inherit; left:inherit; bottom:inherit;}

	
	#event .search { padding:20px; }
/*	#event .search input#event_tit { width:140px; }*/
	#event .search > span { display:block; padding-left:0; padding-top:10px; }
	#event .search ul li a.searching { display:block; width:95%; margin:10px auto 0; }
	#event .search ul li * { vertical-align:middle; }
	#event .search ul li span { display:inline-block; width:70%; } 
	#event .search ul li.first { padding-bottom:10px; }
	#event .search ul li.first, #event .search ul li.second { width:100%; }
	#event .search ul li.first input { width:45%; }
	#event .search ul li.second input { width:100%; }
	#event .search ul li.first span.wave { display:inline-block; width:10%; padding:0; va}
	#event .search ul li label { display:inline-block; width:60px; text-align:left; }


	#event ul.thumb_list li p span.terms { display:none; } 

	.pager { margin-top:0; }
	.pager .page_list { display: none; }
	.pager .page_move { width:100%; float:none; height:30px; line-height:20px; vertical-align:bottom; }
	.pager2 span.arrow { border:1px solid #ccc; }
	.pager2 span.order, .pager2 a.submit { font-size:14px; }
	.pager2 input { height:20px; }
	.pager2 .submit { height:20px; padding:4px 0; line-height:20px; }
	.pager2 { clear: both; margin:10px 0 15px; }


	#press_read .article .body p { line-height:160%; }
	#press_read .article ul.paging li > span.marker { width:30px;  }
	#press_read .article span span { display:none; }
	#press_read .article span b { vertical-align:bottom;   }
	#press_read .article .body { padding:10px; font-size:14px; }
	#press_read .article ul.paging li a, #press_read .article span.no_link { font-size:12px; line-height:1.2; }
	#press_read .article ul.paging li.pre a, #press_read .article ul.paging li.next a,
	#press_read .article ul.paging li.pre span.no_link, #press_read .article ul.paging li.next span.no_link { margin-left:0; margin-right:0; padding-left:0; padding-right:0; background:none; }
	#press_read .article ul.paging li img { width:10px; vertical-align:middle; }
	#press_read .article ul.paging li a, #press_read .article span.no_link { max-width:85%; }
	a.link_list { float:none; width:100%; height:16px; padding:10px 0 8px; font-size:15px; }

	table.event td h3 { margin-bottom:10px; }
	.product_link { width:100%; position:relative; height:110px; }
	.product_link div.img_area { width:100px; }
	.product_link div.img_area ul { position:absolute; bottom:0; left:0; width:100%; }
	.product_link div.img_area ul li { width:49.75%; }
	.product_link div.img_area ul li.last { margin-right:0; }
	.product_link div.img_area > img { width:100%; }
	.product_link div.txt_area h2 {  font-size:22px; line-height:100%; color:#000; height:77px; width:100%;  font-weight:bold; display:table; }
	.product_link div.txt_area h2 span { display:table-cell; vertical-align:middle; width:100%; overflow:hidden; }
	.product_link div.txt_area { float:none; width:inherit; padding-left:100px; position:inherit; }
	.product_link div.txt_area .details { display:none; }
	.product_link div.txt_area h2 { font-size:15px; }
	
    .article .event_read_box{padding:12px 0;}
	.article .event_read_box .old_event_wrap{width:100%;}


}