@charset "UTF-8";

/*
=============================================================================
top.css
=============================================================================
Suggested order by mozilla.org Base Styles (http://www.mozilla.org/css/base/content.css)
 * display
 * list-style
 * position
 * float
 * clear
 * width
 * height
 * margin
 * padding
 * border
 * background
 * color
 * font
 * text-decoration
 * text-align
 * vertical-align
 * white-space
 * other text
 * content
-----------------------------------------------------------------------------
font-size reference
 *  77% = 10px	 	* 122% = 16px		* 167% = 22px	
 *  85% = 11px		* 129% = 17px		* 174% = 23px
 *  92% = 12px		* 136% = 18px		* 182% = 24px
 * 100% = 13px		* 144% = 19px		* 189% = 25px
 * 107% = 14px		* 152% = 20px		* 197% = 26px
 * 114% = 15px		* 159% = 21px	
-----------------------------------------------------------------------------
*/


/* Contents Styling
-----------------------------------------------------------------------------*/
body { background: #000 url(../images/bg-top.jpg) 50% 0 no-repeat; }


/* Logo Styling
-----------------------------------------------------------------------------*/
/* コンテンツページのロゴ */
h1#logo {
	position: absolute;
	top: 35px;
	right: 75px;
	width: 151px;
	height: 318px;
	}



/* Menu Styling
-----------------------------------------------------------------------------*/
/* 特設メニュー */
#specialmenu .nav {
	display: block;
	position: relative;
	left: 4px;
	width: 640px;
	height: 428px;
	background: url(../images/bg-menu1-top.jpg) 0 0 no-repeat;
	}
#specialmenu .nav li { display: inline; }
#specialmenu .nav li a:link,
#specialmenu .nav li a:visited {
	position: absolute;
	top: 45px;
	width: 80px;
	font-size: 1px;
	text-indent: -9999px;
	overflow: hidden;
	z-index: 10;
	}

#specialmenu .nav-about,
#specialmenu .nav-recommend,
#specialmenu .nav-story {
	position: absolute;
	top: 45px;
	width: 80px;
	}

/* メニュー１：越後上越 天地人博 */
#specialmenu .nav .about a:link,
#specialmenu .nav .about a:visited {
	right: 100px;
	height: 140px;
	background: url(../images/img-menu1_1-top.jpg) 0 0 no-repeat;
	}
#specialmenu .nav .about a:hover,
#specialmenu .nav .about a:active { background-position: 0 -140px; }

#specialmenu .nav-about {
	right: 100px;
	height: 140px;
	background: url(../images/img-menu1_1-top.jpg) 0 -140px no-repeat;
	}

/* メニュー２：越後上越 上杉戦国物語展２００９ */
#specialmenu .nav .story a:link,
#specialmenu .nav .story a:visited {
	right: 280px;
	height: 285px;
	background: url(../images/img-menu1_2-top.jpg) 0 0 no-repeat;
	}
#specialmenu .nav .story a:hover,
#specialmenu .nav .story a:active { background-position: 0 -285px; }

#specialmenu .nav-story {
	right: 280px;
	height: 285px;
	background: url(../images/img-menu1_2-top.jpg) 0 -285px no-repeat;
	}

/* メニュー３：おすすめ観光ルート */
#specialmenu .nav .recommend a:link,
#specialmenu .nav .recommend a:visited {
	right: 460px;
	height: 235px;
	background: url(../images/img-menu1_3-top.jpg) 0 0 no-repeat;
	}
#specialmenu .nav .recommend a:hover,
#specialmenu .nav .recommend a:active { background-position: 0 -235px; }

#specialmenu .nav-recommend {
	right: 460px;
	width: 80px;
	height: 235px;
	background: url(../images/img-menu1_3-top.jpg) 0 -235px no-repeat;
	}


/* メニュー */
#menu .nav {
	display: block;
	position: absolute;
	top: 428px;
	right: 59px;
	width: 216px;
	height: 165px;
	background: url(../images/img-menu2-top2.jpg) 0 0 no-repeat;
	}
#menu .nav li { display: inline; }
#menu .nav li a:link,
#menu .nav li a:visited {
	position: absolute;
	width: 36px;
	background-image: url(../images/img-menu2-top2.jpg);
	background-repeat: no-repeat;
	font-size: 1px;
	text-indent: -9999px;
	overflow: hidden;
	z-index: 10;
	}

#menu .nav-introduces,
#menu .nav-tour,
#menu .nav-agent,
#menu .nav-contact,
#menu .nav-sponsor,
#menu .nav-blog {
	position: absolute;
	width: 36px;
	background-image: url(../images/img-menu2-top2.jpg);
	background-repeat: no-repeat;
	}

/* メニュー４：「天地人」紹介 */
#menu .nav .introduces a:link,
#menu .nav .introduces a:visited {
	right: 0;
	height: 165px;
	background-position: -180px 0;
	}
#menu .nav .introduces a:hover,
#menu .nav .introduces a:active { background-position: -180px -165px; }

#menu .nav-introduces {
	right: 0;
	height: 165px;
	background-position: -180px -165px;
	}

/* メニュー５：ツアー情報 */
#menu .nav .tour a:link,
#menu .nav .tour a:visited {
	right: 36px;
	height: 123px;
	background-position: -144px 0;
	}
#menu .nav .tour a:hover,
#menu .nav .tour a:active { background-position: -144px -165px; }

#menu .nav-tour {
	right: 36px;
	height: 123px;
	background-position: -144px -165px;
	}

/* メニュー６：エージェントの方々へ */
#menu .nav .agent a:link,
#menu .nav .agent a:visited {
	right: 72px;
	height: 160px;
	background-position: -108px 0;
	}
#menu .nav .agent a:hover,
#menu .nav .agent a:active { background-position: -108px -165px; }

#menu .nav-agent {
	right: 72px;
	height: 160px;
	background-position: -108px -165px;
	}

/* メニュー７：お問い合わせ */
#menu .nav .contact a:link,
#menu .nav .contact a:visited {
	right: 108px;
	height: 110px;
	background-position: -72px 0;
	}
#menu .nav .contact a:hover,
#menu .nav .contact a:active { background-position: -72px -165px; }

#menu .nav-contact {
	right: 108px;
	height: 110px;
	background-position: -72px -165px;
	}

/* メニュー８：協賛企業 */
#menu .nav .sponsor a:link,
#menu .nav .sponsor a:visited {
	right: 144px;
	height: 85px;
	background-position: -36px 0;
	}
#menu .nav .sponsor a:hover,
#menu .nav .sponsor a:active { background-position: -36px -165px; }

#menu .nav-sponsor {
	right: 144px;
	height: 85px;
	background-position: -36px -165px;
	}

/* メニュー９：公式ブログ */
#menu .nav .blog a:link,
#menu .nav .blog a:visited {
	right: 180px;
	height: 100px;
	background-position: 0 0;
	}
#menu .nav .blog a:hover,
#menu .nav .blog a:active { background-position: 0 -165px; }

#menu .nav-blog {
	right: 180px;
	height: 100px;
	background-position: 0 -165px;
	}


/* "新" マーク */
#menu .nav .agent img.new {
	position: absolute;
/*	top: 100px;*/
	top: -32px;
	right: 76px;
	}

#menu .nav .blog img.new {
	position: absolute;
/*	top: 100px;*/
	top: -32px;
	right: 184px;
	}




/* Information Styling
-----------------------------------------------------------------------------*/
/* お知らせ */
.information {
	width: 570px;
	height: 300px;
	margin: 0 0 80px 36px;
	
	background: url(../images/bg-information.png) 0 0 no-repeat;
	}

.information ul {
	margin: 0 0 0 85px;
	height:300px;
	overflow:auto;
	scrollbar-base-color: #000;
}

.information li { margin-bottom: 0.6em; }

.information span {
	float: left;
	width: 85px;
	margin-right: 10px;
	font-size: 85%;
	line-height: 1.4em;
	color:#CCC;
	}

.information h3 {
	float: left;
	width: 380px;
	font-size: 92%;
	line-height: 1.4em;
	}

.information li.sticky h3 {
	font-size: 100%;
	padding-bottom: 0.5em;
	}

.information li.sticky h3 a { color: #9C3638; }

/* 一覧を見る */
.information li.information-list { position: relative; }
.information li.information-list a {
	display: block;
	position: absolute;
	right: 0;
	width: 99px;
	height: 10px;
	padding: 0.4em 0;
	}



/* Banner Styling
-----------------------------------------------------------------------------*/
/* スポンサーバナー */
#banner {
	width: 960px;
	margin: 0 auto 40px;
	}

#banner li {
	float: left;
	width: 160px;
	}

#banner li a {
	display: block;
	line-height: 2.0em;
	font-size: 77%;
	text-align: center;
	}

#banner .banner-wrap {
	margin-top: 10px;
	text-align: center;
	}
#banner .banner-wrap a img {
	margin: 0 4px 2px;
	vertical-align: top;
	}