/**
 * example1
 */

/* デフォルトで表示のコンテンツ */
#cont1 #c1 {
	display: block;
}

/* デフォルトで非表示のコンテンツ */
#cont1 #c2, #cont1 #c3 {
	display: none;
}

/* 親のクラス名変更によって表示される */
#cont1.show2 #c2, #cont1.show3 #c3 {
	display: block;
}

/* 親のクラス名変更によって非表示される */
#cont1.show2 #c1, #cont1.show3 #c1 {
	display: none;
}



/**
 * example2
 */
 
/* デフォルトで表示のコンテンツ */
#cont2 #c21 {
	display: block;
}

/* デフォルトで非表示のコンテンツ */
#cont2 #c22, #cont2 #c23 {
	display: none;
}

/* 親のクラス名変更によって表示される */
#cont2.show2 #c22, #cont2.show3 #c23 {
	display: block;
}

/* 親のクラス名変更によって非表示される */
#cont2.show2 #c21, #cont2.show3 #c21 {
	display: none;
}



/**
 * example3
 */
 
/* デフォルトで表示のコンテンツ */
#cont3 #c31 {
	display: block;
}

/* デフォルトで非表示のコンテンツ */
#cont3 #c32, #cont3 #c33 {
	display: none;
}

/* 親のクラス名変更によって表示される */
#cont3.show2 #c32, #cont3.show3 #c33 {
	display: block;
}

/* 親のクラス名変更によって非表示される */
#cont3.show2 #c31, #cont3.show3 #c31 {
	display: none;
}

/* メニュー画像を切り換える */
ul.menu2 {
	margin-left: 0;
	padding-left: 0;
	height: 29px;
}

ul.menu2 li {
	background-repeat: no-repeat;
	text-indent: -2000px;
	list-style-type: none;
	float: left;
	width: 184px;
	height: 29px;
}

ul.menu2 li a {
	display: block;
	height: 29px;
	border-bottom: 0 !important; /* for I.E */
}

ul.menu2 li a:hover {
	display: block;
	height: 29px;
	background: transparent;
}

/* デフォルト表示 */
ul.menu2 li.m1 {
	background-image: url(t_menu01_f2.png);
}

#cont3.show2 .m1,
#cont3.show3 .m1 {
	background-image: url(t_menu01.png);
}


ul.menu2 li.m2 {
	background-image: url(t_menu02.png);
}
#cont3.show2 .m2 {
	background-image: url(t_menu02_f2.png);
}

ul.menu2 li.m3 {
	background-image: url(t_menu03.png);
}
#cont3.show3 .m3 {
	background-image: url(t_menu03_f2.png);
}



/* トグルされるブロック */
#cont1 div, #cont2 div, #cont3 div {
	border: 1px solid #dddddd;
	padding: 1em;
	background-color: #f0f0f0;
	margin-bottom: 2em;
	clear: left;
	position: relative; /* for I.E */
}