﻿@charset "utf-8";

/* ----------------------------------------
 City of Kawasaki CSS v1.0 

 Copyright 2009 City of Kawasaki
---------------------------------------- */



/*
----------------------------------------
GENERIC ELEMENTS
----------------------------------------
*/


	body {
	padding: 0;
	margin: 0;
	font-family:Verdana, Helvetica, sans-serif;
	font-size: 085.0%;
	color:#333333;
	line-height: 1.5em;
	background-color: #EEF8E7;
		}

	p	{
		text-indent: 1em;
		margin: 1.5em;
		padding: 0;
		}

	p.unindent	{
		text-indent: 0;
		}
	
	a	{
		text-decoration: none;
		border-bottom: 1px solid #84C84F;
		color:#84C84F;	
		}
		
	ul	{
		padding:0;
		margin:0;
		}
		
	ul li	{
		list-style:none;
		}

	hr {
		display:none
		}

	img {
		border:none;
		vertical-align:bottom;
		}



/*
----------------------------------------
LAYOUT
----------------------------------------
*/


div#wrapper {
	width:840px;
	margin-left:auto;
	margin-right:auto;
	}

div#contents {
	width:840px;
}	

div#main {
	float:left;
	width:630px;
	}

div#sub {
	width:840px;
	}

div#extra {
	float:right;
	width:192px;
	}
	
div#contents:after {
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
	content:".";
	}

div#header {
	width:840px;
	}

div#footer {
	width:820px;
	height:30px;
	}

/*
----------------------------------------
WRAPPER
----------------------------------------
*/

div#wrapper {
	background-color: #FFFFFF;
	border-right:1px solid #CCE8B5;
	border-left:1px solid #CCE8B5;	
	}

/*
----------------------------------------
HEADER
----------------------------------------
*/

#header p.head {
	text-align:left;
	margin:0;
	padding:0 5px;
	font-size: 085.0%;
	font-weight:bold;
	color:#000000;
	background-color:#84C84F;	
	}

#header p.head img {
	vertical-align:middle;
	margin:3px;
	border:none;
	}
	
#header a, a:link, a:hover, a:active, a:visited, a:active {
		border: none;
		}

/*
----------------------------------------
GNAVI
----------------------------------------*/


#gnavi {
	height: 31px;
/*	width: 840px;*/
	margin-top: 5px;
	margin-left: 0;
	margin-right: 0;
}

#gnavi ul {
	display: inline;
}

#gnavi ul li {
	display: inline;
	text-indent: -9999px;

	height: 31px;
	width: 199px;	
}

#gnavi ul li a {
	background-image: url("../img/globalnavi.gif");
	background-repeat: no-repeat;
	display: block;
	clear: none;
	float: left;
	padding:0px;	
	height: 31px;
	width: 199px;
	background-position: 0px 0px;
	font-size: 1px;
	border:none;	
}

#gnavi ul li a:hover {
	background-position: 0px -31px;
	text-decoration: none;
	height: 31px;	
}

#gnavi ul li.active a {
	width: 199px;
	background-position: 0px -31px;
}

#gnavi li.active a:hover {
	background-position: 0px -31px;
}

#gnavi .nav1 a {
	width: 145px;
	background-position: -199px 0px;
}

#gnavi .nav1 a:hover {
	width: 145px;
	background-position: -199px -31px;
}

#gnavi .active1 a {
	width: 145px;
	background-position: -199px -31px;
}

#gnavi .active1 a:hover {
	background-position: -199px -31px;
}

#gnavi .nav2 a {
	width: 172px;
	background-position: -344px 0px;
}

#gnavi .nav2 a:hover {
	background-position: -344px -31px;
}

#gnavi .active2 a {
	width: 172px;
	background-position: -344px -31px;
}

#gnavi .active2 a:hover {
	background-position: -344px -31px;
}

#gnavi .nav3 a {
	width: 201px;
	background-position: -516px 0px;
}

#gnavi .nav3 a:hover {
	background-position: -516px -31px;
}

#gnavi .active3 a {
	width: 201px;
	background-position: -516px -31px;
}

#gnavi .active3 a:hover {
	background-position: -516px -31px;
}

#gnavi .nav4 a {
	width: 123px;
	background-position: -717px 0px;
}


#gnavi .nav4 a:hover {
	background-position: -717px -31px;
}

#gnavi .active4 a {
	width: 123px;
	background-position: -717px -31px;
}

#gnavi .active4 a:hover {
	background-position: -717px -31px;
}


html>/**/body #gnavi .nav4 a,
html>/**/body #gnavi .active4 a
 { margin-top /*\**/: -21px\9 }


/*
----------------------------------------
MAIN
----------------------------------------
*/

#main {
	margin-top:10px;
	border-right:1px solid #CCE8B5;
}

 h1 {
	font-size:116.0%;
	color:#2d444f;
	background-color:#B8DF97;
	border:solid 1px #AEDB8A;
	margin:0 12px 20px;
	padding:20px 10px;
	text-align:center;
	}
	
 h1 em {
	color:#458D8F;
	font-size:085.0%;
	font-style:normal;
	}	

 h2 {
	font-size:108.0%;
	margin:20px;
	color:#000000;
	border-bottom: 2px solid #AEDB8A;
	padding-bottom:5px;
	}
	
 h2 em {
	color:#6B98AB;
	font-size:085.0%;
	font-style:normal;
	padding-left:1em;
	}


 h3 {
	text-align:left;
	font-size:093.0%;
	margin:10px 20px;
	padding:8px;
	line-height:1.2em;
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: #CBE8B3;
	}

 h3 em {
	color:#95B5C2;
	font-style:normal;
	font-size:085.0%;
	}
		
 .h1box, .h2box, .h3box {
	margin:10px 20px 20px;
	}
		
 .more {
	margin:0 20px;
	}
	

/* detail -----------------------------*/

 h2 .detail {
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:10px;
	background-image: url("../img/arrow.gif");
	background-position: left center;
	}

 h2 .detail a {
	font-size:085.0%;
	}

 h2 .detail a:link {
	color:#7EA5B6;
	border-bottom:dotted 1px #95B5C2;		
	}
	
 h2 .detail a:visited {
	color:#7EA5B6;
	border-bottom:dotted 1px #95B5C2;		
	}

 h2 .detail a:hover, a:active {
 	border-bottom:dotted 1px #95B5C2;	
	color:#74CDBD;
	}	

/* discription -----------------------------*/
 .discription {
	margin:0 20px 35px;
	}

/* en -----------------------------*/
 p.en {
	text-indent:0px;
	padding:10px;
	background-color: #F7FCF3;
	}



/* pdf link -----------------------------*/
 ul.pdf li a {
	text-decoration:none;
	color:#416270;
	border-bottom:solid 1px #AEDB8A;	
	background-image: url("../img/pdf.gif");	
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 21px;
	margin-right: 3px;
	}

/* external link -----------------------------*/

 .external a {
	background:url(../img/external.gif);
	background-repeat:no-repeat;
	background-position:left top;
	margin:0;
	padding-left:23px;
	}

 .external a:hover, a:active {
	color:#74CDBD;
	}

	
	
/* ul -----------------------------*/

 ul {
	margin-left:20px;
	}

 ul li {
	list-style-image:url(../img/diamond.gif);
	}

 ul li a:link {
	color:#42616F;
	}

 ul li a:visited {
	color:#42616F;
	}

 ul li a:hover {
	color:#60B5B0;
	}
	
 ul li a:active {
	color:#60B5B0;
	}



/* pagetop -----------------------------*/

p.pagetop  {
	text-align:right;
	font-size:077%;
		}

p.pagetop a {
		color:#7EA5B6;
		}

p.pagetop a:link {
		color:#7EA5B6;
		}
		
p.pagetop a:visited {
		color:#7EA5B6;
		}

p.pagetop a:hover {
		color:#74CDBD;
		}

p.pagetop a:active {
		color:#74CDBD;
		}
		
		
		
/* topics -----------------------------*/

#main #topics h2 {
	padding-bottom:2px;
	border-bottom:2px solid #F9AE53;
	}

#topics h2 em {
	color:#F9AE53;
	}
	

#main #topics ul li {
	list-style-image:url(../img/diamond_topics.gif);
	}	
	


/*
----------------------------------------
EXTRA
----------------------------------------
*/

#extra {
	margin-top:10px;
	}
	
#extra h3 {
	font-size:085.0%;
	margin:0 5px 20px;
	padding:5px;
	border-left:none;
	border-top:solid 1px #AEDB8A;
	border-bottom:solid 1px #AEDB8A;
	}

#extra ul.extra {
	font-size:085.0%;
	margin:10px 10px;
	padding-left:8px;
	text-align:left;
	list-style-image:url(../img/diamond.gif);
	}

#extra ul.extra li {
	margin-bottom:1em
	}

#extra u.extra li a, a:link, a:hover, a:visited {
	text-decoration:none;
	color:#416270;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #AEDB8A;
	}

#extra ul.extra a:hover, a:active {
	color:#3F9E93;
	}



/*
----------------------------------------
FOOTER
----------------------------------------
*/

#footer {
	clear:both;
	font-size:077.0%;
	color:#999999;
	width:830px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	margin-top:10px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #C9D8E0;
	}
	
#footer address {
	text-align:center;
	font-style:normal;
	}


	
/*
----------------------------------------
ELEMENTS
----------------------------------------
*/


/* toppage -----------------------------*/

#main #summary2 .h2box, #summary3 .h2box, #summary4 .h2box, #summary5 .h2box {
	margin-left:40px;
	}

/* get acrobat reader -----------------------------*/

#main .reader img {
	padding:5px;
	float:right;
}

#main .reader p {
	font-size:085.0%;
	color:#666666;
	margin:15px 30px;
	text-indent:0;	
}


/* photos -----------------------------*/

#main .photobox1 p, .photobox2 p {
	text-indent:0;
	line-height:1.3em;
	font-size:085.0%;
	color:#666666;
	margin:0 0 10px;
	padding:3px 0;
	}
	
		
#main .photobox1 img, .photobox2 img {
	padding:3px;
	margin:3px;
	border:solid 1px #CCCCCC;
	}


#main .photobox1, .photobox2 {
	margin-left:auto;
	margin-right:auto;
	}
	
#main .photobox1  {
	width:300px;
	}
	
#main .photobox2  {
	width:370px;
	}
	

	
/* dl -----------------------------*/

#main dl.list {
	margin-left:1em;
	font-size:093.0%;
	}
	
#main dl.list dt {
	clear:left;
	float:left;
	margin:0;
	width: 4em;
}

#main dl.list dd {
	margin-left: 4em;
	padding-bottom:0.5em;
}


/* principles -----------------------------*/

#principles p {
	font-size:093.0%;
	text-indent: 0;
	margin: 1em;
	}

/* principles2 -----------------------------*/

#main #principles2 {
	margin:20px;
	padding:10px;
	background-color: #F7FCF3;
	}
	
#main #principles2 h3 {
	color:#6B98AB;
	border:none;
	border-bottom:dotted 1px #AEDB8A;
	margin:0;
	padding:10px 10px 0;
	}
	
#main #principles2 p {
	padding:0 10px 10px;
	}

