@charset "euc-jp";

/*
   Title: Restaurant KURA
   Author: delta
   Date: 2010-12-01

   Content: 
   
   1 - general
   2 - main structure
   3 - index css
   4 - button

 */

/* 1 - general */

html {
	background: #000000;
}

html#sub {
	/*background: #000000 url("../img/common/bg.gif") repeat-y top center;*/
}

html#sub2 {
	background: #000000 url("../img/common/bg2.jpg") repeat-y top center;
}

body {
	font: 14px serif;
	color: #eee;
	line-height: 18px;
}

a:link,
a:visited,
a:active {
	COLOR: #D8D8D8;
	text-decoration: none;
	border: none;
}

a:hover {
	COLOR: #ccc;
	text-decoration: none;
	border: none;
}

span {
	display: none;
}

img:link,
img:visited,
img:active,
img:hover {
	text-decoration: none;
	border: none;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-table;
	min-height: 1%;
}

:focus {
	outline: 0;
}

/* Hides from IE-mac \*/

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* End hide from IE-mac */

/* 2 - main structure */

#container {
	position: relative;
	overflow: hidden;
	margin: 0px auto;
	width: 880px;
	margin-top: 25px;
}

#containerSub {
	position: relative;
	overflow: hidden;
	margin: 0px auto;
	width: 1100px;
}

#content {
	position: relative;
	float: left;
	width: 800px;
	margin-left: 49px;
	background: #000000
}

#side {
	float: left;
	width: 200px;
}

#topFooter {
	position: relative;
	overflow: hidden;
	margin: 0px auto;
	width: 880px;
	margin-top: 30px;
	text-align: center;
	font-size: 11px;
	color: #333;
}

/* 3 - index css */

#topHeader {
	position: relative;
	margin: 0px auto;
	margin-top: 20px;
	text-align: center;
}

#topLogo {
	background: url("../img/common/logo1.gif") no-repeat top center;
	width: 351px;
	height: 300px;
	margin: 0px auto;
	margin-bottom: 15px;
}

#topline {
	position: relative;
	background: url("../img/common/line.jpg") repeat top left;
	width: 700px;
	height: 21px;
	margin: 20px 0px;
	margin-left: 65px;
}

#topLogo h1 {
	display: none;
}

a.enter {
	color: #333;
}

#topHeader table {
	position: relative;
	margin: 0px auto;
	width: 400px;
	height: 
	text-align: justify;
	line-height: 20px;
}

#topHeader tr {
	padding-top: 10px;
}

#topHeader td {
	vertical-align: top;
	table-layout: center;
}

#topHeader .leftSide {
	width: 50px;
}

#topHeader ul {
	position: center;
	margin: 0px auto;
	width: 620px;
	height: 100px;
}

#topHeader li {
	float: left;
}

#topHeader a {
	display: block;
	width: 100px;
	height: 130px;
}

#topHeader .topInfo a {
	background: url("../img/common/info_active.jpg") repeat top left;
	margin-left: 55px;
}

#topHeader .topInfo a:hover {
	background: url("../img/common/info_hover.jpg") repeat top left;
}

#topHeader .topDrink a {
	background: url("../img/common/drink_active.jpg") repeat top left;
	margin-left: 55px;
}

#topHeader .topDrink a:hover {
	background: url("../img/common/drink_hover.jpg") repeat top left;
}

#topHeader .topMenu a {
	background: url("../img/common/menu_active.jpg") repeat top left;
}

#topHeader .topMenu a:hover {
	background: url("../img/common/menu_hover.jpg") repeat top left;
}

#topHeader .topAddress a {
	background: url("../img/common/address_active.jpg") repeat top left;
	margin-left: 55px;
}

#topHeader .topAddress a:hover {
	background: url("../img/common/address_hover.jpg") repeat top left;
}

#topAdress {
	height: 50px;
	margin-top: 80px;
	margin-bottom: 20px;
	color: #666;
	font-size: 16px;
	font-weight: normal;
	color: #FFFFFF;
	text-align:center;
}

#musicIndex {
	margin: 0px auto;
	background: #333;
	width: 150px;
}

#musicIndex ul {
	position: relative;
	float: left;
	height: 20px;
	margin: 0px;
	width: 20px;
}

#musicIndex #jplayer_volume_bar {
	position: relative;
	float: left;
	margin: 0px;
	width: 50px;
	margin-top: 7px;
}

#musicIndex .jp-controls {
	position: absolute;
	left: 335px;
}

#musicIndex ul.indexVol {
	margin-left: 40px;
	
}

/* 4 - sub page css */


#subLogo {
	position: relative;
	margin-left: 17px;
	width: 165px;
	height: 155px;
	margin-top: 40px;
	margin-bottom: 40px;
	background: url("../img/common/page_logo.jpg") repeat top left;
}

#subMenu {
	position: relative;
	margin-left: 47px;
	width: 113px;
}

.subInfo a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/info.jpg") repeat top left;	
}

.subInfoActive a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/info_active.jpg") repeat top left;
}

.subInfoActive a:hover, 
.subInfo a:hover {
	background: url("../img/common/info_hover.jpg") repeat top left;
}

.subDrink a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/drink.jpg") repeat top left;	
}

.subDrinkActive a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/drink_active.jpg") repeat top left;
}

.subDrinkActive a:hover, 
.subDrink a:hover {
	background: url("../img/common/drink_hover.jpg") repeat top left;
}

.subMenu a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/menu.jpg") repeat top left;	
}

.subMenuActive a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/menu_active.jpg") repeat top left;
}

.subMenuActive a:hover, 
.subMenu a:hover {
	background: url("../img/common/menu_hover.jpg") repeat top left;
}

.subAddress a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/address.jpg") repeat top left;	
}

.subAddressActive a {
	display: block;
	width: 100px;
	height: 130px;
	background: url("../img/common/address_active.jpg") repeat top left;
}

.subAddressActive a:hover, 
.subAddress a:hover {
	background: url("../img/common/address_hover.jpg") repeat top left;
}

#music {
	margin-top: 80px;
	margin-left: 42px;
}

#music ul {
	position: relative;
	float: left;
}

div.jp-volume-bar {
	overflow:hidden;
	background: url("../img/player/jplayer.blue.monday.jpg") 0 -250px repeat-x;
	width:46px;
	height:5px;
	cursor: pointer;
	float: left;
	margin-top: 7px;
	margin-right: 3px;
}
div.jp-volume-bar-value {
	background: url("../img/player/jplayer.blue.monday.jpg") 0 -256px repeat-x;
	width:0px;
	height:5px;
}



#footer {
	margin-left: 25px;
	float: left;
	font-size: x-small;
}



/* 5 - content */

#contentHeader {
	width: 800px;
}

#infoInfo,
#reserve,
#infoCloseOpen,
#infoAdress {
	margin: 50px 0px;
}

#infoInfo h2,
#reserve h2,
#infoCloseOpen h2,
#infoAdress h2,
div.drinkHeader {
	border-bottom: 1px #999 solid;
	height: 48px;
}

#infoCloseOpen h2 {
	margin-top: 10px;
}

div.drinkHeader {
	margin-bottom: 25px;
	height: 23px;
	line-height: 25px;
}

.drinkHeader b {
	font-size: 20px;	
}

#infoInfo li {
	line-height: 25px;
	padding: 10px 5px;
	background: url("../img/common/dot.gif") repeat-x bottom left;
}

#infoCloseOpen table,
#infoAdress table {
	margin: 0 5px;
	width: 669px;
	margin-top: 15px;
	line-height: 22px;
}

#infoCloseOpen td {
	vertical-align: top;
}

#infoAdress td {
	width: 334px;
	vertical-align: top;
}

.imgMap {
	text-align: center;
}

.listHead {
	width: 150px;
	border-right: 1px #333 solid;
}

.listHoliday {
	width: 240px;
}

.listName {
	width: 240px;
	padding-left: 10px;
}

.listTime {
	width: 80px;
}



#form
ol { list-style:none;}
ol li { display:block; clear:both;}
ol li label { display:block; margin:0; padding:16px 0 0 0;}
ol li input.text { width:480px; border:1px solid #c0c0c0; margin:2px 0; padding:5px 2px; height:16px; background:#fff;}
ol li textarea { width:480px; border:1px solid #c0c0c0; margin:2px 0; padding:2px; background:#fff;}
ol li .send { margin:16px 0 0 0;}

#infoInfo h2 {
	background: url("../img/common/info_info.gif") no-repeat top left;
}


#reserve h2 {
	background: url("../img/common/reserve.gif") no-repeat top left;
}

#infoInfo h2.addressHeader {
	background: url("../img/common/address_title.jpg") no-repeat top left;
}

#infoCloseOpen h2 {
	background: url("../img/common/open_close.gif") no-repeat top left;
}

#infoAdress h2 {
	background: url("../img/common/adress.gif") no-repeat top left;
}

.drinkTop {
	height: 355px;
	background: #111 url("../img/menu/drink.jpg") repeat top left;
	margin-top: 50px;
}

.menuTop {
	background: #111 url("../img/menu/menu_1.jpg") repeat top left;
	height: 420px;
}

#contentMain {
	margin-top: 30px;
	margin-bottom: 30px;
}

#drinkLeft,
#drinkRight,
#drinkCenter {
	position: relative;
	float: left;
	width: 380px;
}

#drinkRight {
	margin-left: 40px;
}

#drinkCenter {
	width: 800px;
	margin-top: 20px;
}

.drinkMenuTop {
	line-height: 30px;
	border-bottom: 1px #999 solid;
	margin-bottom: 5px;
	height: 20px;
	padding-bottom: 5px;
}

.MenuMenuTop {
	line-height: 25px;
	border-bottom: 1px #999 solid;
	margin-bottom: 5px;
	height: 23px;
	padding-bottom: 5px;
}

.MenuMenuTop b {
	font-size: 20px;	
}

.menuMenuListLeft {
	float: left;
}

.menuMenuListRight {
	float: right;
}

.drinkSake {
	background: url("../img/common/drink_sake.jpg") no-repeat top left;
	text-align: right;
	font-size: smaller;
}

.drinkWine {
	background: url("../img/common/drink_wine.jpg") no-repeat top left;
}

.drinkMenuLeft {
	float: left;
	height: 50px;
}

.drinkMenuLeft b {
	font-weight: normal;
}

.drinkMenuLeft i {
	font-weight: normal;
}

.drinkMenuRight {
	float: right;
	height: 50px;
}

.drinkMenuList {
	line-height: 20px;
	display: block;
	background: url("../img/common/dot.gif") repeat-x bottom left;
	margin-bottom: 5px;
	padding-left: 5px;
	font-weight: normal;
}

.drinkLineHeight {
	line-height: 24px;
	height: 90px;
	margin-top: 15px;
}

.drinkMenuList i{
	font-weight: normal;
	font-style: normal;
}

#drinkInfo {
	margin-bottom: 20px;
	padding: 0px 5px;
	font-size: small;
}

.important_txt {
	color: #cccccc;
	font-weight: normal;
}

.important_txt_big {
	color: #cccccc;
	font-weight: normal;
	font-size: 15px;
}

/* @group slide */

#contentMenu {
	margin-top: 50px;
	margin-bottom: 30px;
}

#slide {
	margin-bottom: 20px;
}

div.slideshow-container {
    position: relative;
    background: #000;
    clear: both;
    height: 493px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.slideshow span.image-wrapper {
    display: block;
    position: absolute;
    top: -19px;
    left: 0;
}

div.slideshow a.advance-link {
    display: block;
    width: 800px;
    height: 493px; /* This should be set to be at least the height of the largest image in the slideshow */
    text-align: center;
}

div.slideshow .advance-link img{
	z-index: 30;
}

div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
    text-decoration: none;
}

ul.thumbs {
	position: absolute;
	width: 200px;
    top: 0px;
    left: 0;
    display: none;
}
ul.thumbs li {
    float: none;
    padding: 0;
    margin: 0;
    line-height: 22px;
    list-style: none;
}
a.thumb {
    padding: 0;
    color: #222;
    display: block;
    border: none;
    padding-left: 5px;
    border-bottom: 1px #999 dotted;
}

a:hover.thumb {
	color: #fff;
	background: url("../img/common/trans_bg_hover.png") repeat top left;
}

ul.thumbs li.selected a.thumb {
    color: #fff;
    font-weight: bold;
	background: url("../img/common/trans_bg_hover.png") repeat top left;
}
div.controls {
    display: none;
}

div#caption {
	position: absolute;
    height: 65px;
    top: 479px;
    width: 800px;
    filter: alpha(opacity=80);
    -moz-opacity:0.8;
    opacity:0.8;
    background: #000000;
}

.image-title {
	margin-left: 5px;
	margin-top: 5px;
}

.image-title b {
	font-size: 20px;
}

/* @end */


#menuInfo {
	margin-left: 5px;
	margin-top: 10px;
	height: 20px;
}

.otherMenu {
	margin: 0px 25px;
}

.otherMenu table {
	margin-bottom: 25px;
}

.otherMenu h2 {
	border-bottom: 1px #999 solid;
	margin-bottom: 20px;
	font-size: 14px;
}

.otherMenu h2 strong {
	font-size: 20px;
}

td.otherMenuList {
	vertical-align: top;
	padding-left: 20px;
}

/* 6 - form */

textarea,
div.inputMes {
	color: #fff;
	font-size: 14px;
	line-height: 18px;
	width: 545px;
	border: none;
	background: #000000;
	border: none;
	background: url("../img/common/input_bg.gif") repeat top left;
}

input.input,
span.input {
	display: block;
	border: none;
	background: url("../img/common/input_bg.gif") repeat-x top left;
	color: #fff;
	line-height: 18px;
	font-size: 14px;
	width: 495px;
	float: left;
}

input.submit {
	background: #f00;
	border: none;
	font-size: 18px;
	font-weight: bold;
	padding: 2px 5px;
	float: right;
	margin-left: 20px;
}

label.label,
span.label {
	display: block;
	line-height: 18px;
	display: block;
	width: 50px;
	float: left;
}

div.formLine {
	margin-bottom: 5px;
}

/* form */
ol { list-style:none;}
ol li { display:block; clear:both;}
ol li label { display:block; margin:0; padding:16px 0 0 0;}
ol li input.text { width:480px; border:1px solid #c0c0c0; margin:2px 0; padding:5px 2px; height:16px; background:#fff;}
ol li textarea { width:480px; border:1px solid #c0c0c0; margin:2px 0; padding:2px; background:#fff; color:#000000;}
ol li .send { margin:16px 0 0 0;}