var __topmenu =
'<ul id="mainMenu">' + 
'	<li><a href="<%ROOT%>whatis.html"><img src="<%ROOT%>img/common/menu_whatis<%OVER_whatis%>.gif" alt="世界めいわく劇場って？" width="197" height="37" class="<%SWAP_whatis%>" /></a></li>' + 
'	<li><a href="<%ROOT%>product_shirayuki.html"><img src="<%ROOT%>img/common/menu_products<%OVER_products%>.gif" alt="作品紹介" width="95" height="37" class="<%SWAP_products%>" /></a>' + 
'		<ul>' + 
'			<li><a href="<%ROOT%>product_shirayuki.html">童話「白雪姫」<span class="new">New</span></a></li>' + 
'			<li><a href="<%ROOT%>product_macchi.html">童話「マッチ売りの少女」</a></li>' + 
'			<li><a href="<%ROOT%>product_ningyo.html">童話「人魚姫」</a></li>' + 
'		</ul>' + 
'	</li>' + 
'	<li><a href="<%ROOT%>staff.html"><img src="<%ROOT%>img/common/menu_staff<%OVER_staff%>.gif" alt="スタッフ・キャスト" width="156" height="37" class="<%SWAP_staff%>" /></a></li>' + 
'	<li><a href="<%ROOT%>campaign.html"><img src="<%ROOT%>img/common/menu_campaign<%OVER_campaign%>.gif" alt="キャンペーン" width="113" height="37" class="<%SWAP_campaign%>" /></a></li>' + 
'	<li><a href="<%ROOT%>special.html"><img src="<%ROOT%>img/common/menu_special_new<%OVER_special%>.gif" alt="スペシャル" width="109" height="37" class="<%SWAP_special%>" /></a></li>' + 
'</ul>' + 
'';

// 引数でアクティブを指定
function showTopMenu( active, root ){
	// ルートディレクトリ書換
	root = !root ? "" : root;
	__topmenu = __topmenu.split('<%ROOT%>').join( root );

	// アクティブメニューは overにして class="swap"を解除
	__topmenu = __topmenu.replace('<%OVER_'+active+'%>', '-over');
	__topmenu = __topmenu.replace('<%SWAP_'+active+'%>', '');

	__topmenu = __topmenu.replace(/<%SWAP.+?%>/g, 'swap');
	__topmenu = __topmenu.replace(/<%OVER.+?%>/g, '');
	
	// インデックスのみ表示
	if( active == 'index' ){
		__topmenu = __topmenu.replace(/<%\/?INDEX_ONLY%>/g, '');
	}else{
		__topmenu = __topmenu.replace(/<%INDEX_ONLY%>.+<%\/INDEX_ONLY%>/, '');
	}
	
	
	document.write( __topmenu );
	dropDownInit( '#mainMenu' );
}