@charset "utf-8";
/* multimedia_conceptart.css */
h1 span {background:url("/lineage/multimedia/title.gif") no-repeat 0 -90px;}

/*	utils
		* gal_ready - 이미지 로딩을 위한 빈 div
		* gal_progress - 이미지 로딩 중 표시 영역		*/
#gal_ready {width:0px;height:0px;overflow:hidden;position:absolute;top:-2000px;left:0;}
#gal_progress {position:absolute;top:30%;left:0;width:100%;color:#fff;text-align:center;z-index:1000;display:none;}

/*	wrap_gallery - 그룹 영역을 제외한 다이나믹 갤러리를 감싸는 영역 position 속성 수정 불가	*/
#wrap_gallery {position:relative;width:700px;overflow:hidden;display:none;}

/*	Image display
		* gal_display - 이미지 표시 영역
			속성 수정 불가 : position, z-index , 필수 속성 : width, height
		* gal_display - position 속성 수정 불가 */
#gal_display {position:relative;z-index:2;width:620px;height:440px;margin:0 auto;border:1px solid #999;background-color:#FFF;}
#gal_display img {position:absolute;cursor:pointer;}

/*	Image thumbnail list 1 (로딩시 현재 이미지와 함께 불러지는 썸네일 리스트 영역)
		* gal_list - 속성 수정 불가 : position, overflow  필수 속성 : width, height
		* gal_list ul - gal_list 요소 내에 동적으로 생성되는 썸네일 리스트
			속성 수정 불가 - position, margin, padding, top, left
		* gal_list ul li - 속성 수정 불가 : float, overflow  필수 속성 : width, height, margin-right
			(이미지의 border 값을 포함한 사이즈를 지정해야 함)
		* gal_list ul li img - 필수 속성 : width, height
		* gal_list ul li.on - 활성화 된 아이템 스타일 지정	*/
#gal_list {position:relative;overflow:hidden;width:564px;height:70px;top:15px;left:32px;}
#gal_list ul {position:absolute;top:0;left:0;margin:0;padding:0;list-style-type:none;}
#gal_list ul li {float:left;overflow:hidden;width:94px;height:70px;margin:0;padding:0;text-align:center;line-height:0;font-size:0;}
#gal_list ul li img {width:85px;height:68px;border:1px solid #999;cursor:pointer;}
#gal_list ul li.on img {border:1px solid #000;}

/*	Image thumbnail list 2 (썸네일 리스트 아이콘 클릭시 나타나는 썸네일 영역)
		* gal_thumblist - 속성 수정 불가 : overflow, display  필수 속성 : width, height
		* gal_thumblist_close - 썸네일 리스트 닫기 버튼 스타일 지정
		* wrap_gal_thumbArea - 썸네일 리스트 배경 이미지 혹은 컬러 지정
			속성 수정 불가 : position, z-index, 필수 속성 : top, left, width, height
		* gal_thumbArea - 속성 수정 불가 : position , 필수 속성 : width
		* .gal_thumbArea - 커스텀 클래스	*/
#gal_thumblist {position:absolute;overflow:hidden;display:none;width:762px;height:627px;top:180px;margin:0 auto;}
#gal_thumblist_close {position:absolute;cursor:pointer;top:12px;left:660px;z-index:11;}
#wrap_gal_thumbArea {position:absolute;z-index:5;top:0;left:0;width:762px;height:627px;background:#fff;}
#gal_thumbArea {position:absolute;width:664px;}
#gal_thumbArea ul {padding:0;margin:0;list-style-type:none;}
#gal_thumbArea ul li {padding:0;float:left;font-size:0;width:158px;height:128px;}
#gal_thumbArea ul li.on img {border:2px solid #666;}
#gal_thumbArea ul li img {width:146px;height:96px;border:2px solid #666;display:block;}
#gal_thumbArea ul li a {width:45px;height:20px;display:block;float:left;color:#fff;}
#gal_thumbArea ul li a.download1 {background:url('/lineage/multimedia/gallery/btn_1024.gif') no-repeat;}
#gal_thumbArea ul li a.download2 {background:url('/lineage/multimedia/gallery/btn_1280.gif') no-repeat;}
#gal_thumbArea ul li a.download3 {background:url('/lineage/multimedia/gallery/btn_1600.gif') no-repeat;}
#gal_thumbArea_stage {position:relative;top:43px;left:32px;width:632px;height:512px;border:2px solid;overflow:hidden;z-index:10;}

/*	Scroll
		* wrap_scroll_handle - 스크롤 트랙 영역
			속성 수정 불가 : z-index , 필수 속성 : width, height
		* scroll_handle - 스크롤 핸들 영역
			필수 속성 : width, height		*/
#wrap_scroll_handle {position:absolute;top:43px;left:723px;z-index:1000;width:15px;height:468px;background:#1f1f1f;}
#scroll_handle {width:15px;height:135px;cursor:pointer;background:url(/library/source/dynamic/gallery/images/dy1v/scroll_btn.gif) no-repeat;}

/*	Navigation
		custom class - 속성 수정 불가 및 필수 속성 없음.		*/
#gal_prev {position:absolute;top:190px;left:0;cursor:pointer;}
#gal_next {position:absolute;top:190px;right:0;cursor:pointer;}

#gal_before {left:0;}
#gal_after {right:70px;}
#gal_play_posi{right:0;}
#gal_thumb {position:absolute;bottom:0;right:0;cursor:pointer;}

/*   이미지 위치 정보 */
#wrap_gallery #gal_pos {position:absolute;z-index:6;top:21px;right:0;width:45px;height:15px;padding:3px 0;text-align:center;font-family:Tahoma;font-size:11px;color:#CCC;background:url('/lineage/multimedia/gallery/bg_imgnumber.gif') no-repeat;}
#wrap_gallery #gal_pos b {color:#EBEBEB;}

#wrap_gallery_navi {position:relative;clear:both;width:700px;height:100px;margin-bottom:32px;border:solid #e1e1e1;border-width:1px 0;background-color:#FFF;}
#wrap_gallery_navi span {position:absolute;top:15px;cursor:pointer;}

/*	Description
	 	custom class - 속성 수정 불가 및 필수 속성 없음.		*/
#wrap_gallery_desc {position:relative;width:700px;height:50px;margin:0 auto;overflow:hidden;}
#wrap_gallery_desc div {clear:both;}
h5#gal_title {float:left;margin:0;padding:27px 0 0 3px;font-size:14px;color:#666;}
h5#gal_title span {font-size:12px;font-weight:normal;}
#gal_writer, #gal_date, #gal_pos {float:right;padding:5px 5px 0 0;font-size:0.9em;color:#999;}
#gal_description {float:left;padding:5px 0;margin:0;font-size:0.9em;color:#999;}
.download {float:right;padding:5px 5px;}

/*	Group - 그룹 영역 스타일 지정
		* gal_group 요소 안에 동적으로 리스트 생성(아래는 실제 생성되는 마크업)
		<div id="gal_group">
			<ul>
				<li>
					<div><img src="" alt="" /></div>
					<h6>그룹 타이틀</h6>
				</li>
			</ul>
		</div>
*/
/* gal_group */
#gal_group_stage {position:relative;clear:both;width:700px;height:670px;z-index:13;background-color:#FFF;}
#gal_group {position:relative;width:700px;height:600px;overflow:hidden;}
#gal_group #gal_group_list {position:absolute;top:0;left:0;width:720px;}
#gal_group ul {padding:0;margin:0;list-style-type:none;}
#gal_group li {width:239px;height:195px;float:left;cursor:pointer;padding:0;}
#gal_group li.on {}
#gal_group li div {width:220px;height:132px;margin:0;font-size:0;border:1px solid #b7b7b7;}
/*#gal_group li div:hover {overflow:visible;}*/
#gal_group li div img {width:220px;height:132px;}
#gal_group h6 {width:194px;font-size:12px;text-align:center;margin:0;padding:10px 0 3px 7px;}
#gal_group h6 span {font-weight:normal;letter-spacing:0;}
#gal_group li.on h6 {color:#000;}
#gal_group li.on p {color:#000;}
#gal_group p {font-size:1.0em;color:#666;line-height:170%;margin:0;padding:0 5px 15px 7px;}

/*	Layer Popup - 원본 이미지 보기 팝업
		* gal_popup - 수정 불가 : position, top, z-index
		* popup_handle - 레이어 팝업의 핸들 영역  수정불가 : position, cursor
		* popImg_next, prev - 이전/다음 영역 지정	*/
#gal_popup {position:absolute;top:-2000px;left:0;z-index:99999999;border:1px solid #666;padding:37px 82px 60px 82px;cursor:move;background-color:#404040;}
#gal_popup img.close {position:absolute;right:17px;top:17px;cursor:pointer;}
#gal_popup #popup {position:relative;text-align:center;}
#gal_popup img.image {display:block;text-align:center;border:2px solid #1f1f1f;cursor:pointer;}

/* Lineage Layer Popup */
#popup_navi #popImg_prev {position:absolute;top:45%;left:25px;z-index:50;cursor:pointer;}
#popup_navi #popImg_next {position:absolute;top:45%;right:25px;z-index:50;cursor:pointer;}
#popup_navi div {position:absolute;bottom:24px;left:82px;z-index:50;cursor:normal;}


/* Lineage Gallery thumbnail list pagination */
#gal_group_stage #group_pager {display:none;position:absolute;bottom:20px;width:670px;padding:10px 0 0 0;text-align:center;border-top:1px solid #89BFC9;z-index:12;}
#gal_group_stage #group_pager span {cursor:pointer;}