@import url("https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c");

#MENUAREA {
	vertical-align: top;
	padding-left: 10px;
	width: 240px;
	background-color: #FFF;
}

/*--- sidenav ----*/
#sidenav{
	background: #fff;
	margin-top:5px;
	padding-top:5px;
	width:230px;
	border-right: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	margin-bottom: 1em;
	vertical-align:top;
	box-shadow: 4px 3px 3px #DDDDDD;
}

#sidenav a{
	font-family: メイリオ,Meiryo,ヒラギノ角ゴ ProN W3,Arial,sans-serif;
	font-weight:400;
	font-size: 13px;
	color:#4c4c4c;display:block;
	text-decoration: none;
}

#sidenav a:hover{color:#4c4c4c;display:block;width:156px;background-color: #ebedee;}


#sidenav h2{
	display: contents;
	font-family:"M PLUS Rounded 1c", メイリオ,Meiryo,ヒラギノ角ゴ ProN W3,Arial,sans-serif;
	font-weight: bold;
	font-size: 14px;
	color: #333;
	margin: 5px 2px 2px 5px;
	line-height: 22px;
}

#sidenav h2 a {
	font-family:"M PLUS Rounded 1c", メイリオ,Meiryo,ヒラギノ角ゴ ProN W3,Arial,sans-serif;
	font-weight: bold;
	font-size: 14px;
	text-decoration: none;
	color: #333;
	display: block;
	background-image: url(img/menu_off.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 22px;
}
#sidenav h2 a:hover {
	background-image: url(img/menu_on.gif);
}
#sidenav h2:last-of-type{margin-bottom: 15px;}
.line{margin: 1em 0}
#sidenav ul.menu{
	padding: 0;
	margin: 5px 0 15px 5px;
}
#sidenav ul.menu li{
	font-size: 12px;
	list-style: none;
	margin-bottom: 2px;
}
#sidenav ul.menu li a{
	font-weight: bold;
	display: block;
	padding-left: 22px;
	background-image: url(img/menu_sub_off.gif);
	background-repeat: no-repeat;
	background-position: left center;
}
#sidenav ul.menu li a:hover {background-image: url(img/menu_sub_on.gif);}

/*--- メニュー項目 リンクなし ----*/
#sidenav ul.menu li > span{
	display: block;
	width: 200px;
	color: #999;
	padding-left: 22px;
	background-image: url(img/menu_sub_off.gif);
	background-repeat: no-repeat;
	background-position: left center;
}
/*--- メニュー項目 枠線 ----*/
/* グレー */
#sidenav ul.bnr li.bd1 a {
	border: 2px solid #ccc;
}
#sidenav ul.bnr li.bd1 a:hover {
	border: 2px solid #999;
}
/* 緑 */
#sidenav ul.bnr li.bd a {
	border: 2px solid #cce1b3;
}
#sidenav ul.bnr li.bd a:hover {
	border: 2px solid #9abd0d;
}

/*--- メニュー項目 on アクティブ表示 ----*/


body.lw00 #sidenav h2.side_lw00 a,
body.pf00 #sidenav h2.side_pf00 a,
body.kg00 #sidenav h2.side_kg00 a,
body.rl00 #sidenav h2.side_rl00 a,
body.lc00 #sidenav h2.side_lc00 a{
	background-image: url(img/menu_on.gif);
	background-color: #ebedee;
}

body.lw01 #sidenav li.side_lw01 a,
body.lw02 #sidenav li.side_lw02 a,
body.lw03 #sidenav li.side_lw03 a,
body.lw04 #sidenav li.side_lw04 a,
body.lw05 #sidenav li.side_lw05 a,
body.lw06 #sidenav li.side_lw06 a,
body.lw07 #sidenav li.side_lw07 a,
body.lw08 #sidenav li.side_lw08 a,
body.lw09 #sidenav li.side_lw09 a,
body.lw10 #sidenav li.side_lw10 a,
body.pf01 #sidenav li.side_pf01 a,
body.pf02 #sidenav li.side_pf02 a,
body.pf03 #sidenav li.side_pf03 a,
body.pf04 #sidenav li.side_pf04 a,
body.kg01 #sidenav li.side_kg01 a,
body.kg02 #sidenav li.side_kg02 a,
body.kg03 #sidenav li.side_kg03 a,
body.kg04 #sidenav li.side_kg04 a,
body.kg05 #sidenav li.side_kg05 a,
body.kg06 #sidenav li.side_kg06 a,
body.kg07 #sidenav li.side_kg07 a,
body.kg08 #sidenav li.side_kg08 a,
body.rl01 #sidenav li.side_rl01 a,
body.rl02 #sidenav li.side_rl02 a,
body.rl03 #sidenav li.side_rl03 a,
body.rl04 #sidenav li.side_rl04 a {
	background-image: url(img/menu_sub_on.gif);
	background-color: #ebedee;
}

hr.dotline{
	border: none;
	border-bottom: 2px dotted #ccc;
}

#sidenav ul.menu li a,
#sidenav ul.menu li a:hover,
#sidenav h2 a,
#sidenav h2 a:hover{width: 200px;}

/*--- バナー ----*/
#sidenav ul.banner{
	padding: 0;
	margin-top: 5px;
	margin-bottom: 15px;
}
#sidenav ul.banner li{
	list-style: none;
	margin-bottom: 2px;
}

/*--- バナー ----*/
#sidenav ul.bnr{
	padding: 0;
	margin-top: 5px;
	margin-bottom: 15px;
}
#sidenav ul.bnr li{
	list-style: none;
	margin-bottom: 2px;
}

#sidenav ul.bnr li.bd a{}

#sidenav ul.bnr li a,
#sidenav ul.bnr li a:hover{
	background-color: #fff;
	width: 156px;
	text-decoration: none;
	display: block;
	margin:10px auto;
}

#sidenav ul.banner li a,
#sidenav ul.banner li a:hover{
	background-color: #fff;
	width: 156px;
	text-decoration: none;
	display: block;
	background-repeat: no-repeat;
	background-position: left top;
	text-indent:-10000px;
	margin:10px auto;
}
#sidenav li img{vertical-align: middle;}


/*--- 飼い主の方やこれからペットを飼う方へ ----*/
#sidenav a.banner1{background-image: url(img/banner1.jpg);height: 58px;}
#sidenav a.banner1:hover{background-image: url(img/banner1on.jpg);}
body.banner1 #sidenav a.banner1{background-image: url(img/banner1on.jpg);cursor: default;}

/*--- 動物取扱業者の方へ ----*/
#sidenav a.banner2{background-image: url(img/banner2.jpg);height: 58px;}
#sidenav a.banner2:hover{background-image: url(img/banner2on.jpg);}
body.banner2 #sidenav a.banner2{background-image: url(img/banner2on.jpg);cursor: default;}



/*--- 収容動物検索情報サイト ----*/
#sidenav a.banner4{background-image: url(img/banner4.jpg);height: 82px;}
#sidenav a.banner4:hover{background-image: url(img/banner4_on.jpg);height: 82px;}

/*--- 人と動物が幸せに暮らす社会の実現プロジェクト ----*/
#sidenav a.banner5{background-image: url(img/banner5.jpg);height: 63px;}
#sidenav a.banner5:hover{background-image: url(img/banner5_on.jpg);height: 63px;}

/*--- ペットを飼う覚悟と責任 動画 ----*/
#sidenav a.banner6{background-image: url(img/banner6.jpg);height: 108px;}
#sidenav a.banner6:hover{background-image: url(img/banner6_on.jpg);height: 108px;}

/*--- バナー7（ほんとうに飼えるかな？ 動画 ----*/
#sidenav a.banner7{background-image: url(img/banner7.jpg);height: 99px;}
#sidenav a.banner7:hover{background-image: url(img/banner7_on.jpg);height: 99px;}

/*--- 災害 あなたとペットは大丈夫？ 動画【発災当日】編 ----*/
#sidenav a.banner8{background-image: url(img/banner8.jpg);height: 108px;}
#sidenav a.banner8:hover{background-image: url(img/banner8_on.jpg);height: 108px;}

/*--- 災害 あなたとペットは大丈夫？ 動画【避難生活】編 ----*/
#sidenav a.banner9{background-image: url(img/banner9.jpg);height: 108px;}
#sidenav a.banner9:hover{background-image: url(img/banner9_on.jpg);height: 108px;}

/*--- ペットフード ----*/
#sidenav a.banner10{background-image: url(img/banner10.jpg);height: 113px;}
#sidenav a.banner10:hover{background-image: url(img/banner10_on.jpg);height: 113px;}

/*--- 動物虐待連絡先一覧 ----*/
#sidenav a.banner11{background-image: url(img/banner11.png);height: 63px;}
#sidenav a.banner11:hover{background-image: url(img/banner11_on.png);}
body.banner11 #sidenav a.banner11{background-image: url(img/banner11_on.png);cursor: default;}
body.reportcruelty #sidenav a.banner11{filter: saturate(200%);}
/*--- 動物愛護管理行政に関するお問合せ窓口 ----*/
#sidenav a.banner12{background-image: url(img/banner12.png);height: 65px;}
#sidenav a.banner12:hover{background-image: url(img/banner12_on.png);height: 65px;}
body.banner12 #sidenav a.banner12{background-image: url(img/banner12_on.png);cursor: default;}
body.inquiry #sidenav a.banner12{filter: hue-rotate(28deg);}



