@charset "utf-8";

/* Base
-------------------------------------------*/
html, body {
	color: #FFF;
	background-color: #000;
	line-height: 170%;
}


/* レイアウト
-------------------------------------------*/
#wrapper {
	z-index: 0;
	padding-bottom: 100px;
}

#header_bg {
	margin-bottom: 45px;
	width: 100%;
	height: 500px;
	background: #000 url(../images/top_image_mark_06.jpg) 0 0 repeat-x;
	opacity: 0.3;
	filter: Alpha(opacity=30);
}

#main_visual {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 900px;
	height: 500px;
}

#top_id {
	position: absolute;
	z-index: 2;
	left: 0;
	top: 0;
	width: 900px;
	height: 500px;
}

#colLeft {
	float: left;
	width: 400px;
}

#colRight {
	float: left;
	width: 500px;
	overflow: hidden;
}

#footer {
	clear: both;
	margin: 30px 0 0 0;
}

/* メニュー
-------------------------------------------*/
#menu a:hover img {
	opacity: 0.6;
	filter: Alpha(opacity=60);
}

#menu a img {
	margin-bottom: 10px;
}

/* マップ
/* 
/* .mark00	事務所
/* .mark01	市立図書館
/* .mark02	市役所
/* .mark03	諏訪神社
/* .mark04	歴史文化博物館
/* .mark05	公会堂
/* .mark06	眼鏡橋
/* .mark07	中央公園
/* .mark08	出島
/* .mark09	県庁
/* .mark10	長崎港
/* .mark11	長崎駅
-------------------------------------------*/
#map {
	position: relative;
	width: 500px;
	height: 230px;
	background: #000 url(../images/map.png) 0 0 repeat-x;
}

#map .mark00 {
	position: absolute;
	top: 65px;
	left: 205px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark00 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark01 {
	position: absolute;
	top: 68px;
	left: 239px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark01 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark02 {
	position: absolute;
	top: 50px;
	left: 340px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark02 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark03 {
	position: absolute;
	top: 10px;
	left: 450px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark03 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark04 {
	position: absolute;
	top: 20px;
	left: 330px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark04 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark05 {
	position: absolute;
	top: 60px;
	left: 403px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark05 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark06 {
	position: absolute;
	top: 87px;
	left: 472px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark06 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark07 {
	position: absolute;
	top: 94px;
	left: 332px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark07 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark08 {
	position: absolute;
	top: 195px;
	left: 90px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark08 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark09 {
	position: absolute;
	top: 164px;
	left: 170px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark09 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark10 {
	position: absolute;
	top: 170px;
	left: 0px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark10 img {
	position: absolute;
	top: 10px;
	left: 0;
}

#map .mark11 {
	position: absolute;
	top: 35px;
	left: 40px;
	display: block;
	height: 35px;
	width:25px;
}
#map .mark11 img {
	position: absolute;
	top: 10px;
	left: 0;
}