html, body {
	width: 600px;
	margin: 0;
	padding: 0;
	height: 100%;
	background: #039;
	color: #fff;
	font-size: 9pt;
	font-family: Arial;
}
a {color:#fff;text-decoration:none}
a:hover {color:#ccc}
#container {
	margin: 0 0 0 22px;
	padding: 0;
	background: #036;
	width: 540px;
	height: 100%;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}
#logo-area {
	width: 540px;
	height: 46px;
	background: #036 url("screens/canon.gif") no-repeat top left;
}
#logo-area p {
	position: relative;
	top: 25px;
	left: 0;
	margin: 0;
	padding: 0;
	width: 532px;
	text-align: right;
}
#title-area {
	width: 540px;
	height: 335px;
	background: #036 url("images/title_back.jpg") no-repeat top left;
}
#title-area div {
	position: relative;
	top: 102px;
	left: 0;
	margin: 0;
	padding: 0;
	width: 502px;
	font-size: 8pt;
	text-align: right;
}
#guide-area {
	width: 540px;
	height: 150px;
}
.arrow {
	position: relative;
	top: -82px; left: 173px;
}
a.link01 {
	display: block;
	float: left;
	margin: 0;
	width: 180px;
	height: 150px;
	background: url("screens/guide_back.gif") no-repeat 0 0;
}
a.link01:hover {
	background: url("screens/guide_back.gif") no-repeat 0 -150px;
	color: #fff;
}
a.link02 {
	display: block;
	float: left;
	margin: 0;
	width: 180px;
	height: 150px;
	background: url("screens/guide_back.gif") no-repeat -180px 0;
}
a.link02:hover {
	background: url("screens/guide_back.gif") no-repeat -180px -150px;
	color: #fff;
}
a.link03 {
	display: block;
	float: left;
	margin: 0;
	width: 180px;
	height: 150px;
	background: url("screens/guide_back.gif") no-repeat -360px 0;
}
a.link03:hover {
	background: url("screens/guide_back.gif") no-repeat -360px -150px;
	color: #fff;
}
p.title {
	margin: 4.5em 0 0 0;
	padding: 0;
	text-align: center;
	font-size: 11pt;
	font-weight: bold;
}
p.para {
	margin: 0.5em 1em 0 1em;
	padding: 0;
	text-align: center;
}