style24
/
style24.front


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
							<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GnbWeb.html
 * @desc    : GNB
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.01.28   gagamel     최초 작성
 *******************************************************************************
 -->
<header id="header" th:fragment="gnb">

	<!-- head start -->
	<div class="common_header">
		<div class="hd_top_banner" style="background-color:#fd4801;">
			<a href="" class="t_bnr">
				<span style="margin:0 auto;height:60px;line-height:60px;font-size: 20px;font-weight: 600;letter-spacing: -.025em; color:#fff;">APP 수신동의 하면 1만 포인트 증정!</span>
				<!--<img src="ABC.jpg" alt="프로모션">-->
			</a>
		</div>
	
<!-- 		<div class="quick_menu_group"> -->
<!-- 			<div class="area"> -->
<!-- 				<div> -->
<!-- 					<span><a href="" title="바로가기">위치테스트1</a></span> -->
<!-- 					<span><a href="" title="바로가기">위치테스트2</a></span> -->
<!-- 				</div> -->
<!-- 				<div class="inr"> -->
<!-- 					<span><a href="" title="바로가기">로그인</a></span> -->
<!-- 					<span><a href="" title="바로가기">회원가입</a></span> -->
<!-- 					<span><a href="" title="바로가기">마이페이지</a></span> -->
<!-- 					<span><a href="" title="바로가기">고객센터</a></span> -->
<!-- 					<span><a href="" onclick="AppDownloadPopup();" title="바로가기">앱다운로드</a></span> -->
<!-- 				</div> -->
<!-- 			</div> -->
<!-- 		</div> -->

		<div class="area">
			<div class="logo">
				<a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">
					<h1>
						<i class="ico ico_logo"></i>
						<em class="blind">STYLE24</em>
					</h1>
				</a>
			</div>
			<div class="util_group">
				<span th:if="${sessionInfo == null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_LOGIN);" title="로그인 바로가기">로그인</a></span>
				<span th:if="${sessionInfo != null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_LOGOUT);" title="로그아웃">로그아웃</a></span>
				<span th:if="${sessionInfo == null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN_TYPE);" title="회원가입 바로가기">회원가입</a></span>
				<span><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MYPAGE);" title="마이페이지 바로가기">마이페이지</a></span>
			</div>
		</div>
		
		<div class="gnb">
			<!-- nav -->
			<div class="nav" id="header_area_01">
				<ul class="bundle" id="nav1" >
					<!-- [D] 전체메뉴 열림 닫힘 구분 클래스 on -->
					<li class="all_menu">
						<a href="#">브랜드</a>
						<div class="depth_menu">
							<div style="background:#333; max-width: 1780px;   margin: 0 auto;">
								<p>브랜드</p>
								<div class="step1">
									<ul>
										<li><a href="#" title="바로가기">1차_1</a></li>
										<li><a href="#" title="바로가기">1차_2</a></li>
									</ul>
								</div>
								<div class="step2">
									<ul>
										<li><a href="#" title="바로가기">2차_1</a></li>
									</ul>
									<ul>
										<li><a href="" title="바로가기">3차_1</a></li>
										<li><a href="" title="바로가기">3차_2</a></li>
									</ul>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul class="bundle" id="nav2" >
					<li><a href="#">여성</a></li>
					<li><a href="#">남성</a></li>
					<li><a href="#">유아동</a></li>
					<li><a href="#">골프</a></li>
					<li><a href="#">라이프</a></li>
				</ul>
				<ul class="bundle" id="nav3">
					<li class="active" ><a href="#">베스트</a></li>
					<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_SOCIAL_MAIN);" title="핫딜 바로가기">핫딜</a></li>
					<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);" title="기획전 바로가기">기획전</a></li>
					<li><a href="#">총알배송</a></li>
					<li><a href="#">아울렛</a></li>
					<li><a href="#">룩북</a></li>
					<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);" title="기획전 바로가기">이벤트/혜택</a></li>
				</ul>
			</div>
			<!-- // nav -->

			<!-- search -->
			<div class="search">
				<div class="area">
					<form id="searchMainForm" name="searchMainForm">
						<fieldset>  
							<legend>통합검색</legend>
							<input type="text" id="search" name="search" value="" placeholder="모이몰론, 남들보다 빠르게! 신상 check" class="search_input" title="검색어 입력" maxlength="100">								
							<div class="search_group" id="ark" style="display: none;">
								<div id="ark_down" style="position: absolute; display: block; cursor: pointer; top: 3px; left: 366px;"></div>
								<div id="ark_up" style="position: absolute; display: none; cursor: pointer; top: 3px; left: 366px;"></div>
								<div class="area">
									<p class="blind">연관검색</p>
									<div class="search_list">
										<div id="ark_content_list" style="width: 410px;"></div>
										<div id="ark_category_list" class="category"></div>
										<div id="ark_event_list" class="exhibition"></div>
										<div id="ark_powerdeal_list"></div>
									</div>
									<div class="close">
										<a href="#" class="search_close">닫기<i class="ico ico_search_close_gray"><em>닫기</em></i></a>
									</div>
								</div>
							</div>
							<!-- 검색어 입력전 -->
							<div id="mykeyword" class="my_search_group sch_auto" style="display: none;">
								<p class="blind">인기 검색어 &amp; 최근 검색어</p>
								<div class="area">
									<div class="hot_search_list" id="popkeyword">
										<p>인기 검색어</p>
										<ul>
											<li>
												<a href="#"><span>1</span>나이키</a>
											</li>
											<li>
												<a href="#"><span>2</span>tamiya</a>
											</li>
											<li>
												<a href="#"><span>3</span>니콘 z6</a>
											</li>
											<li>
												<a href="#"><span>4</span>갤럭시 자켓</a>
											</li>
											<li>
												<a href="#"><span>5</span>아동운동화</a>
											</li>
											<li>
												<a href="#"><span>6</span>타미야</a>
											</li>
											<li>
												<a href="#"><span>7</span>널디</a>
											</li>
											<li>
												<a href="#"><span>8</span>호박목걸이</a>
											</li>
											<li>
												<a href="#"><span>9</span>제시뉴욕</a>
											</li>
											<li>
												<a href="#"><span>10</span>뉴에라</a>
											</li>
										</ul>
									</div>
									<div class="my_search_list" id="searchkeyword">
										<p>최근 검색어</p>
										<button type="button" onclick="removeMyKeyword();">최근 검색어 전체삭제<i class="ico ico_mysearch_delete"></i></button>
									</div>
								</div>
								<div class="close">
									<a href="#" class="search_close">닫기<i class="ico ico_search_close_gray"><em>닫기</em></i></a>
								</div>
							</div>
							<!-- // 검색어 입력전 -->
							<button type="button" class="close"><i class="ico ico_search_close"><em>닫기</em></i></button>
							<button type="button" class="sch_btn" onclick="goSearch();"><i class="ico ico_search"><em>검색</em></i></button>
						</fieldset>
					</form>
				</div>

				<a href="#" class="btn_ico btn_cart" title="장바구니 바로가기"><i class="ico ico_bag"></i><span class="circle_count">99+</span></a>
				
			</div>
			<!-- // search -->
		</div>
	</div>
	<!-- head end -->

<script th:inline="javascript">
/*<![CDATA[*/
	/* header minify */
	$(function(){
		$(window).scroll(function(){
			var scroll = $(this).scrollTop();
			var headerH =  $("#header").height();
			if ($(window).scrollTop() > headerH){
				$("#header").addClass("minify");
				return false;
			}
			else {
				$("#header").removeClass("minify");
				return false;
			}
		});
	});
	/* //header minify */
/*]]>*/
</script>

</header>

</html>