﻿	/* ==================================== */
		/* ▼Media Queriesを含めたCSSを記述する */
		/* ==================================== */

		/* styles for desktop */
		.tinynav { display: none }
                                body { margin-top: -25px;}
		/* styles for mobile */
		@media screen and (max-width: 950px) {
			.tinynav { display: block }
			#nav { display: none }
		}

		/* ================================== */
		/* ▼リストをメニューバーに見せる装飾 */
		/* ================================== */

		/* -------------------- */
		/* ▽メニューバーの装飾 */
		/* -------------------- */
		ul#nav {
			background-color: #cc0000;	/* バーの背景色 */
			margin: 0px;				/* バー外側の余白 */
			padding: 0px;				/* バー内側の余白 */
			height: 40px;				/* バーの高さ */
			border: 1px solid #cc0000;	/* バーの枠線 */
		}
		/* -------------------- */
		/* ▽メニュー項目の装飾 */
		/* -------------------- */
		ul#nav li {
		    width: 150px;					/* 項目の横幅 */
		    height: 40px;					/* 項目の高さ（「バーの高さ」と一致させる） */
		    border-right: 1px solid white;	/* 項目の区切り線 */
		    float: left;
		    list-style-type: none;
		}
		/* -------------------- */
		/* ▽メニュー項目の装飾 */
		/* -------------------- */
		ul#nav li a {
			background-color: #cc0000;	/* 項目の背景色 */
		    color: white;				/* 項目の文字色 */
		    line-height: 40px;			/* 項目のリンクの高さ（「メニュー項目の高さ」と一致させる） */
		    text-align: center;			/* 文字列の配置（中央寄せ） */
		    text-decoration: none;		/* 項目の装飾（下線を消す） */
		    display: block;
			width: 100%;
		    height: 100%;
		}
		/* -------------------- */
		/* ▽現在位置項目の装飾 */
		/* -------------------- */
		ul#nav li.selected a {
			font-weight: bold;
			background-color: #990000;
                                          height: 38px;
                                          padding-top: 0px;
                   	}
		/* ---------------------------------------- */
		/* ▽メニュー項目にマウスが載ったときの装飾 */
		/* ---------------------------------------- */
		ul#nav li a:hover {
			background-color: #ffdddd;
			color: #cc0000;
                                          height: 38px;
		}

		/* ========================== */
		/* ▼プルダウンメニューの装飾 */
		/* ========================== */

		select.tinynav {
			font-size: 1.5em;			/* 文字の大きさ */
			width: 100%;				/* 横幅 */
			background-color: #ffe4e1;	/* 背景色 */
			border: 1px solid #ffe4e1;	/* 枠線 */
		}
		select.tinynav option[selected] {
			background-color: #cc0000;	/* 選択中項目の背景色 */
			color: white;				/* 選択中項目の文字色 */
                             }