@charset "utf-8";

/* Yokohama HAWAI'I FESTIVAL CSS
 * @author     Katsuhiro Tozaki
 * @copyright  2008 Melia Corporation
 * @version    Release: 0.8 2008-05-21
 * @link       http://www.melia.co.jp
 */


/*

	1. initialization
	2. basic element
	3. helper classes
	4. common ID
	5. h1,h2,h3 repalace
	6. rollover

*/


/* 1.initialization */

* {
	margin : 0;
	padding : 0;
}

/*	2. basic element */

html {
	overflow-y: scroll;
}

body {
	line-height: 1.8em;
	*line-height: 1.5em;/* IE */
	letter-spacing: 0.5px;
	font-family: meiryo, 'Hiragino Kaku Gothic Pro', Osaka, verdana, 'MS Pgothic', sans-serif;
	font-size : 12px;
	*font-size : small; /* IE */
	text-align: center; /* IE */
	background: url(images/common/background.gif) repeat;
	color:#000000;
}

a:link {
	color: #8c0f05;
	text-decoration:underline;
}
a:visited {
	color: #999;
	text-decoration:underline;
}
a:hover {
	color:#ff9900;
	text-decoration:underline;
	}
a:active {
	color: #999; 
	text-decoration:underline;
}

img {
	border: 0;
}


/* 3. helper classes */

.commonTable {
	width : 90%;
	border-collapse: collapse;
	margin : 0 auto;
	text-align: center;
}

.commonTable td {
	padding: 5px;
	border-collapse: collapse;
	border: 1px solid #666;
}

.commonTable th {
	padding: 5px;
	border-collapse: collapse;
	border: 1px solid #666;
}


.text {
	padding : 0 10px 10px 10px;
}

.list {
	margin : 0 20px;
}

.movie-area {
	width : 320px;
	float : left;
}

.movie-description {
	width : 260px;
	float : left;
	padding : 0 10px;
}

.cb {
	clear : both;
}

.fl {
	float : left;
}

.fr {
	float : right;
}

.l {
	text-align : left;
}

.r {
	text-align : right;
}

.c {
	text-align : center;
}

.s {
	font-size : 85%;
}

.b {
	font-size : 130%;
}

.pd {
	padding : 0 10px 10px 10px;
}

.title {
	font-weight : bold;
	font-size : 130%;
	color : #8c0f05;
	padding : 5px;
}

.tt {
	padding : 10px; line-height : 200%;
}

.darkred {
	color : #8c0f05;
}

.box-top {
	background : url('images/market/box_top.gif') no-repeat top;
	width : 570px;
	padding-top : 30px;
}
.box-bottom {
	background : url('images/market/box_bottom.gif') no-repeat bottom;
	width : 570px;
	padding-bottom : 30px;
}

.box-body {
	background : url('images/market/box_body.gif') repeat-y;
	width : 570px;
}

.box-text {
	text-align : left;
	padding : 0 20px;
}

#market-contents {
	marign : 0 auto;
	text-align : center;
}

.market-image {
	float : right;
	width : 150px;
}

.market-text {
	float : left;
	width : 380px;
}

.market-name {
	color : #3366CC;
}

.recommend-hr {
	color : #66CCCC;
}

.staff-image {
	float : left;
	width : 120px;
}

.staff-text {
	float : right;
	width : 400px;
}


/* 4. common ID */

#container {
	width : 900px;
	margin : 0 auto;
	background : #ffffff;
}

#container-inner {
	padding : 10px 42px;
}

#header {
	width : 816px;
	height : 100px;
}

#header-inner {
	padding : 0;
}

#main {
	width : 808px;
	margin : 0 auto;
	text-align : center;
}

#main-inner {
	padding : 0;
	text-align : left;
}

#contents {
	width : 600px;
	float : right;
	text-align : left;
}

#contents-inner {
	padding : 0;
}

#sub-contents {
	width : 170px;
	float : left;
	text-align : left;
}

#sub-contents-inner {
	padding : 0;
}

#pr-space {
	width : 170px;
	text-align : center;
}

#pr-space-inner {
	width : 160px;
	margin : 0 auto;
	text-align : left;
	padding : 10px 0;
}

#pr-space-inner ul {
	list-style-type : none;
}

#footer {
	clear : both;
	width : 816px;
}

#footer-inner {
	padding : 20px 10px;
	text-align : center;
}

/* 5. h1,h2,h3 replace classes */

.image-header {
	background : url(images/common/header.jpg) no-repeat;
	text-indent : -15000px;
	height : 76px;
}

.image-index-top {
	background : url(images/home/page_image_home.jpg) no-repeat;
	text-indent : -15000px;
	height : 265px;
}

.image-common-top {
	background : url(images/common/page_image_common.jpg) no-repeat;
	text-indent : -15000px;
	height : 190px;
}

.image-market-top {
	background : url(images/market/page_image_market.jpg) no-repeat;
	text-indent : -15000px;
	height : 190px;
}

.image-yhf {
	background : url(images/home/null_header_yhf.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-news {
	background : url(images/home/null_header_news.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-movie {
	background : url(images/home/null_header_movie.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-history {
	background : url(images/history/null_header_history.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-topics {
	background : url(images/news/null_header_topics.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-event {
	background : url(images/event/null_header_event.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-map {
	background : url(images/map/null_header_map.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-artist {
	background : url(images/artist/null_header_artist.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}

.image-booth {
	background : url(images/booth/null_header_booth.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-market {
	background : url(images/market/null_header_market.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-sponsor {
	background : url(images/sponsor/null_header_sponsor.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-link {
	background : url(images/link/null_header_link.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-contact {
	background : url(images/contact/null_header_contact.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-sitemap {
	background : url(images/sitemap/null_header_sitemap.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}
.image-privacy {
	background : url(images/privacy/null_header_privacy.gif) no-repeat;
	text-indent : -15000px;
	height : 50px;
}


/* 5. rollover */

#menu {
	width : 170px;
	height : 310px;
	margin : 0;
	padding : 0;
	background : url(images/common/menu.gif) no-repeat;
}

#menu ul {
	margin : 0;
	padding : 0;
}

#menu li {
	display : inline;
	list-style-type : none;
	padding : 0;
	margin : 0;
}

#menu li a {
	height : 20px;
	display : block;
	float : left;
	text-indent : -15000px;
	text-decoration : none;
	overflow : hidden;
}
#menu .menu-header {
	margin : 0;
	padding : 0;
	width : 170px;
	height : 43px;
	text-indent : -15000px;
	background : url(images/common/menu.gif) no-repeat;
}


	/* menu off */
#menu li.menu-01 a { background : url(images/common/menu.gif) no-repeat 0px -43px; width : 170px; height : 20px; }
#menu li.menu-02 a { background : url(images/common/menu.gif) no-repeat 0px -63px; width : 170px; height : 20px; }
#menu li.menu-03 a { background : url(images/common/menu.gif) no-repeat 0px -83px; width : 170px; height : 20px; }
#menu li.menu-04 a { background : url(images/common/menu.gif) no-repeat 0px -103px; width : 170px; height : 20px; }
#menu li.menu-05 a { background : url(images/common/menu.gif) no-repeat 0px -123px; width : 170px; height : 20px; }
#menu li.menu-06 a { background : url(images/common/menu.gif) no-repeat 0px -143px; width : 170px; height : 20px; }
#menu li.menu-07 a { background : url(images/common/menu.gif) no-repeat 0px -163px; width : 170px; height : 20px; }
#menu li.menu-08 a { background : url(images/common/menu.gif) no-repeat 0px -183px; width : 170px; height : 20px; }
#menu li.menu-09 a { background : url(images/common/menu.gif) no-repeat 0px -203px; width : 170px; height : 20px; }
#menu li.menu-10 a { background : url(images/common/menu.gif) no-repeat 0px -223px; width : 170px; height : 20px; }
#menu li.menu-11 a { background : url(images/common/menu.gif) no-repeat 0px -243px; width : 170px; height : 20px; }
#menu li.menu-12 a { background : url(images/common/menu.gif) no-repeat 0px -263px; width : 170px; height : 20px; }

	/* menu hover */
#menu li.menu-01 a:hover { background : url(images/common/menu.gif) no-repeat -340px -43px; width : 170px; height : 20px; }
#menu li.menu-02 a:hover { background : url(images/common/menu.gif) no-repeat -340px -63px; width : 170px; height : 20px; }
#menu li.menu-03 a:hover { background : url(images/common/menu.gif) no-repeat -340px -83px; width : 170px; height : 20px; }
#menu li.menu-04 a:hover { background : url(images/common/menu.gif) no-repeat -340px -103px; width : 170px; height : 20px; }
#menu li.menu-05 a:hover { background : url(images/common/menu.gif) no-repeat -340px -123px; width : 170px; height : 20px; }
#menu li.menu-06 a:hover { background : url(images/common/menu.gif) no-repeat -340px -143px; width : 170px; height : 20px; }
#menu li.menu-07 a:hover { background : url(images/common/menu.gif) no-repeat -340px -163px; width : 170px; height : 20px; }
#menu li.menu-08 a:hover { background : url(images/common/menu.gif) no-repeat -340px -183px; width : 170px; height : 20px; }
#menu li.menu-09 a:hover { background : url(images/common/menu.gif) no-repeat -340px -203px; width : 170px; height : 20px; }
#menu li.menu-10 a:hover { background : url(images/common/menu.gif) no-repeat -340px -223px; width : 170px; height : 20px; }
#menu li.menu-11 a:hover { background : url(images/common/menu.gif) no-repeat -340px -243px; width : 170px; height : 20px; }
#menu li.menu-12 a:hover { background : url(images/common/menu.gif) no-repeat -340px -263px; width : 170px; height : 20px; }

	/* menu on */
#menu li.menu-01-on a { background : url(images/common/menu.gif) no-repeat -170px -43px; width : 170px; height : 20px; }
#menu li.menu-02-on a { background : url(images/common/menu.gif) no-repeat -170px -63px; width : 170px; height : 20px; }
#menu li.menu-03-on a { background : url(images/common/menu.gif) no-repeat -170px -83px; width : 170px; height : 20px; }
#menu li.menu-04-on a { background : url(images/common/menu.gif) no-repeat -170px -103px; width : 170px; height : 20px; }
#menu li.menu-05-on a { background : url(images/common/menu.gif) no-repeat -170px -123px; width : 170px; height : 20px; }
#menu li.menu-06-on a { background : url(images/common/menu.gif) no-repeat -170px -143px; width : 170px; height : 20px; }
#menu li.menu-07-on a { background : url(images/common/menu.gif) no-repeat -170px -163px; width : 170px; height : 20px; }
#menu li.menu-08-on a { background : url(images/common/menu.gif) no-repeat -170px -183px; width : 170px; height : 20px; }
#menu li.menu-09-on a { background : url(images/common/menu.gif) no-repeat -170px -203px; width : 170px; height : 20px; }
#menu li.menu-10-on a { background : url(images/common/menu.gif) no-repeat -170px -223px; width : 170px; height : 20px; }
#menu li.menu-11-on a { background : url(images/common/menu.gif) no-repeat -170px -243px; width : 170px; height : 20px; }
#menu li.menu-12-on a { background : url(images/common/menu.gif) no-repeat -170px -263px; width : 170px; height : 20px; }


#artist-list {
	padding: 0 10px;
}
#artist-list ul.artist-list-select {
	margin: 0 0 10px 0;
}
#artist-list ul.artist-list-select li {
	float: left;
	margin: 0 0 0 10px;
}

#artist-list H5.artist-list-title {
	clear: both;
	font-size: 80%;
	padding: 0 5px;
}
#artist-list .artist-list-line {
	border: 1px solid #B3DEC2;
	margin-bottom: 10px;
}
#artist-list TABLE.artist-list-table {
	width: 100%;
	margin: 0;
	padding: 0;
}
#artist-list TABLE.artist-list-table td {
	vertical-align: top;
}

#artist-list TABLE.artist-list-table .artist-list-contents {
	margin: 10px;
}
#artist-list TABLE.artist-list-table H6.artist-list-name {
	font-size: 90%;
	border-bottom: 1px solid #000000;
}
#artist-list TABLE.artist-list-table .artist-list-description {
	font-size: 80%;
}

#artist-list .large td {
	width: 50%;
}
#artist-list .large .artist-list-image {
	width: 225px;
	height: 150px;
}

#artist-list .middle td {
	width: 33%;
}
#artist-list .middle .artist-list-image {
	width: 150px;
	height: 120px;
}

#artist-list .normal td {
	width: 25%;
}
#artist-list .normal .artist-list-image {
	width: 120px;
	height: 100px;
}

#booth-contents {
	marign : 0 auto;
	text-align : center;
}

.booth-image {
	margin: 0 0 15px 0;
}

.booth-text {
	margin: 15px 0;
}

.booth-name {
	color : #3366CC;
}
