$(document).ready(function() {
	
	// text要素の初期状態をCSSで指定してしまうと、
	// jQueryに対応していないブラウザで問題となるので、
	
	// text要素のうち
	$(".menu")
		// acc_1とacc_2内の一番最初のtext要素を除いて
		.not("#acc_1 .menu:first, #acc_2 .menu:first")
		// 非表示に。
		.hide();
	
	// acc_1のアコーディオン処理
	$("#acc_1 .ttl").click(function(){
		// クリックした次の要素をスライド動作
		$(this).next().slideToggle();
	});
	
	// acc_2のアコーディオン処理
	$("#acc_2 .ttl").click(function(){
		// acc_2内のtext要素のうちクリックした次の要素を除いてスライドアップ
		$("#acc_2 .menu").not($(this).next()).slideUp();
		// クリックした次の要素をスライド動作
		$(this).next().slideToggle();
	});
	
	// 上のままだとマウスカーソルが変わらないのでリンクっぽくないので、
	// name要素にマウスオーバーしたら？
	$(".ttl").hover(function(){
		// マウスカーソルの形をリンクのものに偽装。
		$(this).css("cursor","pointer");
	},function(){
		// name要素からマウスが離れたら元に戻す。
		$(this).css("cursor","default");
	});
	
});