* {
	margin:0;
	padding:0;
}

a, a:visited {
	color: #c8151d;
	text-decoration: none;
}

a:hover {
	color: #000;
	text-decoration: underline;
}

ul, ol, li {
	list-style: none;
}

img {
	border: none;
}

hr {
	display: none;
}

h1, h2, h3, h4 {font-size: 12px;}

/*-- big structure --*/

body {
	text-align: center;
	font-family: "Microsoft JhengHei";
	font-size: 12px;
	background: #fff url(../images/top-line-bg.gif) repeat-x;
}

#hero {
	width: 960px;
	margin: 0 auto;
	text-align: left;
}

#header {
	position: relative;
	height: 548px;
}

#container {
	margin-top: 16px;
	position: relative;
}

/*-- end of big structure --*/

/*-- header section --*/

	/*---- top line area ----*/

	#top-line {
		color: #fff;
	}

	#top-line ul li{
		float: left;
		padding:0 3em 0 0;
		line-height: 26px;
	}

	#top-line ul li a, #top-line ul li a:visited{
		color: #fff;
		text-decoration: none;
	}

	#top-line ul li a:hover{
		text-decoration: underline;
	}
	
	#top-line ul li.login{
		display: block;
		float: right;
		background: url(../images/rate-bg.gif);
		margin-right: 8px;
		padding: 0 8px;
		text-align: center;
	}
	
	#top-line ul li.join{
		display: block;
		float: right;
		background: url(../images/rate-bg.gif);
		margin-right: 8px;
		padding: 0 8px;
		text-align: center;
	}
	
	#top-line ul li.member-center{
		display: block;
		float: right;
		padding: 0 8px;
		margin-right: 8px;
		text-align: center;
		background: url(../images/rate-bg.gif);
	}
	
	#top-line ul li.logout{
		display: block;
		float: right;
		padding: 0 8px;
		margin-right: 8px;
		text-align: center;
		background: url(../images/rate-bg.gif);
	}

	#top-line ul li.rate{
		display: block;
		width: 220px;
		float: right;
		padding:0;
		background: url(../images/rate-bg.gif);
	}

	#top-line ul li span{
		display: block;
		padding-left: 20px;
		background: url(../images/dollar-sign.gif) no-repeat 4px 0;
	}

	/*---- end of top line area ----*/

	/*---- brand area ----*/

	#brand {
		clear: both;
		position: relative;
		height: 90px;
	}
	
	#brand h1{
		display: block;
		position: absolute;
		width: 319px;
		height: 48px;
		top: 24px;
		left: 0;
		background: url(../images/tabitabi-japan-logo.gif) no-repeat;
		text-indent: -9999px;
	}
	
	#brand p{
		display: block;
		position: absolute;
		width: 220px;
		top: 0;
		right: 0;
		font-size: 11px;
	}
	
	#brand span{
		color: #c8151d;
		font-family: Georgia, serif;
		font-size: 14px;
	}
	
	#brand strong{
		font-size: 16px;
		color: #c8151d;
	}

	/*---- end of brand area ----*/
	
	/*---- main menu ----*/
	
	#main-menu {
		position: absolute;
		top: 116px;
		left: 0;
		z-index: 5;
	}
	
	#main-menu ul li {
		float: left;
		position: relative;
	}
	
	a.main-menu-spot {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-spot.gif) no-repeat;
		text-indent: -9999px;
	}
	
	a.main-menu-food {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-food.gif) no-repeat;
		text-indent: -9999px;
	}
	
	a.main-menu-useful {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-useful.gif) no-repeat;
		text-indent: -9999px;
	}
	
	a.main-menu-community {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-community.gif) no-repeat;
		text-indent: -9999px;
	}
	
	a.main-menu-blog {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-blog.gif) no-repeat;
		text-indent: -9999px;
	}
	
	div.main-menu-search {
		display: block;
		width: 220px;
		height: 51px;
		background: url(../images/menu-search.gif) no-repeat;
		line-height: 51px;
	}
	
	div.main-menu-search form{
		display: block;
		width: 220px;
		height: 51px;
		margin-left: 8px;
	}
	
	.submit-button{
		background: #c8151d;
		border: none;
		font-size: 11px;
		color: #fff;
		padding: 2px;
	}
	.sub-menu {
		display: block;
		width: 148px;
		background: #fff;
		position: absolute;
		top: 51px;
		left: 0;
	}
	
	.sub-menu li{
		clear: both;
		width: 148px;		
		padding: 8px 0;
		text-align: center;
		border-bottom: 1px dotted #c8151d;
	}
	
	/*---- end of main menu ----*/
	
	/*---- header image ----*/
	
	#header-image {
		clear: both;
		width: 1000px;
		height: 340px;
		position: absolute;
		top: 157px;
		left: -20px;
		text-indent: -9999px;
		background: #ccc url(../images/header-image.jpg);
	}
	
	/*---- end of header image ----*/
	
	/*---- column menu ----*/
	
	#column-menu {
		position: absolute;
		top: 497px;
		left:0;
		border-top: 4px solid #c8151d;
		margin-top: -4px;
		background: url(../images/menu-shadow.gif) no-repeat bottom;
		width: 960px;
		height: 59px;
	}
	
	#column-menu ul li{
		float: left;
		text-indent: -9999px;
	}
	
	a.column-menu-omiyage {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-omiyage.gif) no-repeat;
	}
	
	a.column-menu-culture {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-culture.gif) no-repeat;
	}
	a.column-menu-magazine {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-magazine.gif) no-repeat;
	}
	a.column-menu-net {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-net.gif) no-repeat;
	}
	a.column-menu-strange {
		display: block;
		width: 148px;
		height: 51px;
		background: url(../images/menu-strange.gif) no-repeat;
	}
	a.column-menu-join {
		display: block;
		width: 220px;
		height: 51px;
		background: url(../images/menu-join.gif) no-repeat;
	}
	
	/*---- end of column menu ----*/
	
/*-- end of header section --*/

/*-- container section --*/
	#main {
		float: left;
	}
	
	/*-- quick info section --*/
	
	#quick-info {
		width: 740px;
	}
		
		/*-- more japan section --*/
		
		#more-japan {
			width: 140px;
			padding-right: 8px;
			float: left;
		}
		
		#more-japan a {
			display: block;
			width: 122px;
			height: 90px;
			border: 1px solid #bbb;
			background: #eee;
			padding: 8px;
			margin: 4px 0;
		}
		
		#more-japan a span{
			display: block;
			overflow: hidden;
			width: 122px;
			height: 90px;
		}
		
		#more-japan h3{
			width: 140px;
			height: 19px;
			text-indent: -9999px;
			background: url(../images/more-japan.gif) no-repeat;
			margin-bottom: 8px;
		}
		
		#more-japan h4{
			font-size: 16px;
			padding: 4px 0;
		}
		
		#more-japan p{
			font-size: 11px;
			text-align: justify;
			margin-bottom: 1em;
		}
		
		/*-- end of more japan section --*/
		
		/*-- weather report --*/
		
		#weather-report {
			width: 140px;
			padding-right: 8px;
			float: left;
		}
		
		#weather-report h3{
			width: 140px;
			height: 19px;
			text-indent: -9999px;
			background: url(../images/weather-report.gif) no-repeat;
			margin-bottom: 8px;
		}
		
		#weather-report p{
			line-height: 2em;
		}
		
		#weather-report span{
			display: block;
			width: 140px;
			text-align: center;
			font-size: 10px;
		}
		
		/*-- end of weather report --*/
		
		/*-- ranking report --*/
		
		#ranking {
			width: 140px;
			padding-right: 8px;
			float: left;
		}
		
		#ranking ol li{
			clear: both;
			margin-bottom: 8px;
			display: block;
		}
		
		#ranking span{
			display: block;
			height: 36px;
			width: 36px;
			overflow: hidden;
			float: left;
			margin: 0 8px 8px 0;
		}
		
		#ranking a img{
			height: 36px;
		}
		
		#ranking h3{
			width: 140px;
			height: 19px;
			text-indent: -9999px;
			background: url(../images/ranking.gif) no-repeat;
			margin-bottom: 8px;
		}
		
		div.r1, div.r2, div.r3{
			float: left;
		}
		
		div.r1 a, div.r1 a:visited{
			color: #da000a;
			text-decoration: none;
		}
		
		div.r2 a, div.r2 a:visited{
			color: #ff621c;
			text-decoration: none;
		}
		
		div.r3 a, div.r3 a:visited{
			color: #ffa800;
			text-decoration: none;
		}
		
		#ranking a:hover{
			text-decoration: underline;
		}
					
		/*-- end of ranking report --*/
		
		/*-- question report --*/
		
		#question {
			width: 140px;
			padding-right: 8px;
			float: left;
		}
		
		#question h3{
			width: 140px;
			height: 19px;
			text-indent: -9999px;
			background: url(../images/question.gif) no-repeat;
			margin-bottom: 8px;
		}
		
		#question h4{
			font-size: 16px;
			margin-bottom: 8px;
		}
		
		/*-- end of question report --*/
		
		/*-- ADs --*/
		
		#ADs {
			width: 140px;
			padding-right: 8px;
			float: left;
		}
		
		#ADs img{
			margin-bottom: 4px;
		}
		
		#ADs a span{
			display: block;
			background: url(../images/link-arrow-red.gif) no-repeat center right;
			height: 13px;
			font-size: 11px;
			line-height: 13px;
			text-align: right;
			padding-right: 13px;
		}
		
		#ADs a, #ADs a:visited{
			text-decoration: none;
			cursor: hand;
		}
		
		#ADs a:hover{
			text-decoration: underline;
		}
		
		/*-- end of ADs --*/	
	
	/*-- end of quick info section --*/
	
	/*-- article block --*/
	
	.article-block {
		width: 732px;
		border-top: 4px solid #c8151d;
		clear: both;
		margin-top: 16px;
	}
	
	.article-main {
		width: 436px;
		margin: 8px 8px 0 0;
		float: left;
		text-align: justify;
	}
	
	.article-main a, .article-main a:visited{
		cursor: hand;
		text-decoration: none;
	}
	
	.article-main h3:hover{
		text-decoration: underline;
	}
	
	.article-main a.l-bg {
		display:block;
		float: left;
		width: 132px;
		height: 128px;
		padding: 4px;
		background: #c8151d;
		margin: 0 8px 8px 0;
		cursor: hand;
	}
	
	.article-main a.l-bg span{
		display:block;
		width: 132px;
		height: 128px;
		overflow: hidden;
	}
	
	.article-main h3 {
		font-size: 20px;
		color: #c8151d;
		line-height: 22px;
		margin-bottom: 4px;
	}
	
	.article-main span.article-date{
		background: #c8151d;
		color: #fff;
		padding: 2px;
		font-size: 11px;
		font-weight: bold;
		margin: 4px 0;
	}
	
	.article-main p {
		font-size: 12px;
		line-height: 20px;
		margin: 4px 0 16px 0;
	}
	
	.readmore{
		background: url(../images/link-arrow-red.gif) no-repeat right center;
		line-height: 13px;
		padding: 4px 11px;
		display: block;
		border-bottom: 1px dotted #c8151d;
		text-align: right;
	}
	
	.article-relative {
		float: right;
		width: 288px;
		margin: 8px 0 0 0;
	}
	
	.article-relative h4.subtitle {
		float: left;
	}
	
	.article-relative ul li h4 {
		font-weight: normal;
	}
	
	.article-relative ul li h4 span {
		color: #c8151d;
		margin-left: 0.5em;
		background: url(../images/link-arrow-red.gif) no-repeat right center;
		padding-right: 16px;
		font-size: 9px;
	}
	
	.article-relative span.backnumber{
		float: right;
		background: url(../images/link-arrow-red.gif) no-repeat right center;
		height: 1em;
		line-height: 1em;
		padding-right: 16px;
		cursor: hand;
		font-size: 11px;
	}
	
	.article-relative ul{
			clear: both;
	}
	
	.article-relative ul li{
			border-top: 1px dotted #c8151d;
			display: block;
			padding: 9px 0;
	}
	
	.article-relative ul li a h4{
			color: #000;
			text-decoration: none;
	}
	
	.article-relative ul li a h4:hover{
			text-decoration: underline;
			color: #c8151d;
	}
	
	.article-relative a.s-bg{
		display:block;
		width: 56px;
		height: 23px;
		padding: 4px;
		background: #fff;
		border: 1px solid #bbb;
		float: left;
		margin-right: 8px;
	}
	
	span.s-crop {
		display: block;
		overflow: hidden;
		width: 56px;
		height: 23px;
		cursor: hand;
	}
	
	/*-- end of article block --*/
	
	/*-- featured --*/
	#featured {
		clear: both;
		border-top: 4px solid #c8151d;
	}
	
	#featured h3 {
		font-size: 14px;
		padding:4px 0;
	}
	
	#featured ul {
			width: 968px;
	}
	
	#featured ul a, #featured ul a:visited{
		color: #fff;
		text-decoration: none;
	}
	
	#featured ul li {
		float: left;
		margin: 0 8px 8px 0;
	}
	
	#featured ul li a h4{
		padding: 8px 0;
		font-size: 16px;
	}
	
	#featured ul li a{
		display: block;
		width: 314px;
		height: 75px;
		background: url(../images/featured-bg.gif) repeat-x;
	}
	
	#featured ul li a span{
		display: block;
		width: 100px;
		height: 75px;
		overflow: hidden;
		float: left;
		margin-right: 8px;
	}
	
	/*-- end of featured --*/
	
	/*-- side banners --*/
	
	#side-banners {
		float: right;
		width: 220px;
	}
	
	.banners-gap {
		margin-bottom: 4px;
		border: 1px solid #ccc;
	}
	
	ul.friend li{
		margin: 8px 0;
		border-top: 1px dotted #c8151d;
		padding-top: 8px;
	}
	
	ul.friend li a span{
		background: url(../images/link-arrow-red.gif) no-repeat center right;
		height: 13px;
		font-size: 11px;
		line-height: 13px;
		padding-right: 13px;
	}
	
	#side-banners a, #side-banners a:visited{
		color: #c8151d;
		text-decoration: none;
	}
	
	#side-banners a:hover{
		text-decoration: underline;
	}
	
	.friend-ad{
		display: block;
		background: url(../images/link-arrow-red.gif) no-repeat center right;
		height: 13px;
		font-size: 11px;
		line-height: 13px;
		text-align: right;
		padding: 8px 13px 8px 0;
		border-top: 1px solid #c8151d;
	}
	
	#side-banners h3{
		margin-top: 4px;
		border-top: 4px solid #c8151d;
		padding-top: 8px;
	}
	
	/*-- end of side banners --*/
	
	#search-map {
		position: relative;
		clear: both;
		height: 309px;
		margin-top: 16px;
	}
	
	#locations {
		position: absolute;
		top:0;
		left:0;
		width: 292px;
		background: #fff;
	}
	
	#locations h3 {
		display: block;
		background: #c8151d;
		color: #fff;
		height: 25px;
		width: 292px;
		background: url(../images/searchby.gif) no-repeat;
		text-indent: -9999px;
	}
	
	#locations ul {
		display: block;
		width: 146px;
		float: left;
		background: #fff;
	}
	
	#locations ul li{
		display: block;
		width: 139px;
		background: url(../images/locations-bg.gif) repeat-x;
		height: 71px;
		padding:0 0 0 10px;
		font-size: 11px;
		border-left: 1px solid #ddd;
	}
	
	#locations ul li h4{
		padding-top: 4px;
	}
	
	#locations ul li a, #locations ul li a:visited{
		color: #c8151d;
		text-decoration: none;
		padding-right: 1.5em;
	}
	
	#locations ul li a:hover{
		text-decoration: underline;
	}
	
	#flash-map-bg {
		position: absolute;
		top: 0;
		left: 292px;
		background: #c8151d;
		width: 668px;
		height: 309px;
	}
	
	#flash-map {
		padding: 8px;
		position: relative;
	}
	
	#flash-map ul{
		display: block;
		position: absolute;
		top: 8px;
		right: 8px;
	}
	
	.tt {
		position: absolute;
		top: 8px;
		right: 8px;
	}
	
	.tt a{
		display: block;
		margin-bottom: 8px;
		cursor: hand;
	}
	
	.tt a span{
		overflow: hidden;
		width: 180px;
		height: 60px;
		display: block;
	}
	
	.tt a span img{
		margin-top: -25%;
	}
	
	
	
	#flash-map-bg ul li span{
		overflow: hidden;
		width: 180px;
		height: 60px;
		display: block;
		margin-bottom: 8px;
	}
	
	#flash-map-bg ul li span img{
		margin-top: -25%;
	}
	
	#flash-map-bg a, #flash-map-bg a:visited{
		color: #fff;
		text-decoration: none;
	}
	
/*-- end of container section --*/


	#footer {
		border-top: 4px solid #c8151d;
		border-bottom: 1px solid #c8151d;
		padding: 16px 0;
		margin: 16px 0;
		clear: both;
	}
	
	#footer ul li {
		float: left;
		margin-right: 8px;
		padding-right: 8px;
		border-right: 1px solid #000;
	}
	
	#footer ul li a, #footer ul li a:visited{
		color: #000;
		text-decoration: none;
	}
	
	#footer ul li a:hover{
		color: #c8151d;
	}

	#footer p {
		padding-top: 4px;
		clear: both;
		color: #c8151d;
	}