@charset "utf-8";

/*/////////////////////////////////////////////////////////////
BAR TOMOAKI

Copyright (C) 株式会社PROGRESSO
All Rights Reserved.
------------------------------------------------------------

[Layout] 
	+0. Base Layout
	+1. Header
	+2. Contents
	+3. Footer

[Contents] 
	+11. Base
	+12. Top Page (index.html) 
	+13. Drink
	+14. Food
  +15. Course
	+16. Access
	+17. Contact
	+18. Staff
	+19. Members Card
	+20. Privacy Policy
	+21. Link
	+22. 忘年会・新年会 ご予約受付のご案内（enkai.html）
  
  +98. Etc
	+99. Clearfix

//////////////////////////////////////////////////////////////*/

/* ------------------------------------------------------------
	+0. Base Layout
------------------------------------------------------------ */

body {
  color: #333;
  background: #fff url(../images/bg.png) repeat-x 0 0;
}

/* ------------------------------------------------------------
	+1. Header
------------------------------------------------------------ */

#header {
  position: relative;
  width: 980px;
  height: 168px;
  z-index: 99;
  margin: auto;
}

/* logo
------------------------------------------------- */
#logo {
  position: absolute;
  top: 0px;
  left: 0px;
}

/* featurNav
------------------------------------------------- */
#featurNav {
  position: absolute;
  top: 0px;
  right: 0px;
}
#featurNav li {
  float: left;
  padding-left: 10px;
}
#headerMap {
  position: absolute;
  top: 34px;
  right: 0px;
}

/* globalNav
------------------------------------------------- */
#globalNav {
  position: absolute;
  top: 84px;
  right: 0px;
  width: 831px;
  z-index: 98;
}
#globalNav li {
  position: relative;
  float: left;
}
#globalNav .globalNanSub {
  position: absolute;
  top: 58px;
  left: 0px;
}

/* topicPath
------------------------------------------------- */
#topicpath {
  position: absolute;
  top: 155px;
  left: 168px;
  line-height: 1;
  z-index: 97;
}
#topicpath {
  font-size: 85%;
}
#topicpath ,#topicpath a {
  color: #999;
}
#topicpath a:hover {
  color: #333;
}

/* headerBnr
------------------------------------------------- */
#headerBnr {
  position: absolute;
  top: 12px;
  left: 170px;
  line-height: 1;
  z-index: 96;
}


/* ------------------------------------------------------------
	+2. Contents
------------------------------------------------------------ */

#contents {
  position: relative;
  margin: -26px auto 0px auto;
  z-index: 1;
}

/* toTop
------------------------------------------------- */
#toTop {
  width: 980px;
  margin: auto;
  text-align: right;
}

/* ------------------------------------------------------------
	+3. Footer
------------------------------------------------------------ */
#footer {
  position: relative;
  background: url(../images/footer-bg.jpg) repeat-x center top;
  min-width: 980px;
  width: auto;
}
#footerInner {
  width: 980px;
  margin: auto;
}

/* copyright
------------------------------------------------- */
#copyright {
  font-size: 85%;
  text-align: right;
  padding: 45px 0px 10px 0px;
}


/* ////////////////////////////////////////////////////////////
	[Contents]
//////////////////////////////////////////////////////////// */

/* ------------------------------------------------------------
	+11. Base
------------------------------------------------------------ */

.contentsBg {
  background: url(../images/contentsbg.jpg) no-repeat center top;
}
#contentsInner {
  width: 980px;
  margin: auto;
	padding: 76px 0px 76px 0px;
}
#contentsInner h1 {
  margin-bottom: 30px;
}
 
/* ------------------------------------------------------------
	+12. Top Page (index.html)
------------------------------------------------------------ */

#topImg {
  width: 980px;
  margin: 0px auto;
}
#fader1 {
  margin: 0px -350px;
}
#topContents {
  width: 980px;
  margin: 0px auto;
}
#topLeft {
  float: left;
  text-align: justify;
  width: 756px;
  padding: 25px 0px;
}
#topRight {
  float: right;
  width: 196px;
  padding: 25px 0px;
}
#snsBtn {
  margin: 10px 0px;
}
#snsBtn div {
  float: left;
  padding-right: 8px;
}
#mixi,#twitter,#facebook_like,#facebook_share {
  padding-top: 2px;
}
#news {
  color: #333;
  background-color: #eee;
  padding: 5px 12px 12px 12px;
}
#news a {
  color: #333;
}

#news dt, #news dd {
  line-height: 1.6;
}
#news dt {
  width: 140px;
  margin-top: 12px;
}
#news dd {
  margin-top: -1.5em;
  margin-bottom: 0.6em;
  padding-left: 11.5em;
}
.bnr {
  margin-top: 5px;
}
.bnr_shop {
  margin-top: 20px;
}

.point {
	margin-top:20px;
}

.point a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
  background:#FFF;
}


 
 /* ------------------------------------------------------------
	+13. Drink
------------------------------------------------------------ */

#drink dl {
  font-size: 124%;
}
#drink dt {
  margin: 18px 0 0 0;
  padding: 0 0 0px 0;
}
#drink dd {
  margin: -1.6em 0px 0px 0px;
  padding: 0px 0px 0px 15em;
/*  border-bottom: solid 1px #7f6f6f;*/
}
#drink p {
  margin-top: 3.6em;
}
#drink img {
  margin-top: -380px;
  padding-left: 620px;
}

/* Monthly Cocktail
------------------------------------------------- */
#drinkRec {
  font-size: 124%;
}
#drinkRec h2 {
  font-size: 139%;
  border-bottom: solid 1px #333;
  padding-bottom: 0.3em;
}
#drinkRec p {
  margin: 1.3em 0px;
}

 
 /* ------------------------------------------------------------
	+14. Food
------------------------------------------------------------ */

#foodNav {
  margin-top: -90px;
  padding-bottom: 80px;
  padding-left: 355px;
}
#foodNav li {
  float: left;
  padding-left: 5px;
}
#food dl {
  font-size: 124%;
  line-height: 39px;
}
#food dt {
  margin: 0 0 -35px 0;
  padding: 0 0 0 56px;
}
#food dd {
  margin: -1.6em 0px 0px 0px;
  padding: 0px 0px 0px 28em;
}
#food dt .txS {
  font-size: 85%;
}
p.foodTxt {
  font-size: 108%;
  margin: 0px 0px 0.5em 0px;
  padding-left: 72px;
}
.popular {
  background: url(../images/food-popular.png) no-repeat 0px 0px;
}
.recom {
  background: url(../images/food-recom.png) no-repeat 0px 0px;
}
#food .flImg01 {
  float: right;
  margin-top: 460px;
}
#food .flImg02 {
  float: right;
  margin-top: 15px;
}

 /* ------------------------------------------------------------
  +15. Course
------------------------------------------------------------ */

#course {
  font-size: 124%;
  position: relative;
}
#courseSubtitle {
  margin-top: -78px;
  padding-bottom: 30px;
  padding-left: 510px;
}
#course h2 {

}
#course h3 {
  font-size: 139%;
  border-bottom: solid 1px #333;
  background: url(../images/icon.gif) no-repeat 0px 5px; 
  margin-bottom: 20px;
  padding: 3px 0px 8px 30px;
}
#course ul.courseList { margin-bottom: 20px;}
#course ul.courseList li {
  float: left;
  margin: 0px 35px 45px 5px;
}
#course .img01 {
  float: right;
  margin: 0;
}
#course #courseBox1 {
  width: 670px;
}
#course dl {
  margin: 1em 0;
  padding: 0;
}
#course dt {
  margin: 5px 0 0 0;
  padding: 0;
}
#course dd {
  margin: -1.6em 0px 0px 0px;
  padding: 0px 0px 0px 5em;
}
#course p {
  margin: 1.5em 0px;
}
#course p.kome {
  margin: 0.3em 0px;
}
 
 /* ------------------------------------------------------------
	+16. Access
------------------------------------------------------------ */

#access dl {
  font-size: 124%;
  margin-top: 35px;
}
#access dt {
  margin: 12px 0 0 0;
  padding: 0 0 0px 0;
}
#access dd {
  margin: -1.6em 0px 0px 0px;
  padding: 0px 0px 0px 10em;
}


 
 /* ------------------------------------------------------------
	+17. Contact
------------------------------------------------------------ */

#contact {
  font-size: 124%;
}
#contact h2 {
  font-size: 131%;
  border-bottom: solid 1px #333;
  margin-bottom: 1em;
  padding-bottom: 0.3em;
}
#contactForm {
  border: solid 3px #B58C00;
  padding: 30px;
}

#contactForm label { display:block; color: #333; width:280px; border-left:solid 5px #000; padding: 3px 8px;}
#contactForm .right { color: #333; margin: -1.8em 0 20px 0; padding-left: 320px;}
#contactForm .right.textArea { margin: -3.5em 0 20px 0;}
#contactForm input { padding: 3px;}
#contactForm input,
#contactForm select { color: #333; margin-top: 3px; margin-bottom: 0.3em;}
#contactForm .kome { line-height: 1.4; margin: 0.5em 0px;}
#contactForm label#checkboxLabel { display: inline; width: auto; border:none; padding: auto;}
#contactForm .kakunin { text-align: center; margin-top: 40px;}
#contactForm .error input { background-color:#FCC;}

#contactFormInner {
  color: #000;
  font-size: 85%;
  background-color: #ccc;
  margin-top: 30px;
  padding: 25px;
}
#contactFormInner h3 {
  border-left: solid 3px #000;
  margin: 0;
  padding: 3px 0px 3px 8px;
}
#contactFormInner .rightText {
  margin: -1.3em 0 20px 0;
  padding-left: 10em;
}
#contactFormInner .rightText.last {
  margin-bottom: 0px;
}

#contactForm dt { display:block; color: #333; border-left:solid 5px #000; padding: 3px 8px;}
#contactForm dd { color: #333; margin: -1.8em 0 20px 0; padding-left: 12em;}


/* ------------------------------------------------------------
	+18. Staff
------------------------------------------------------------ */

#staff {
  font-size: 124%;
}
.staffBox {
  background-color: #fff;
  margin-bottom: 20px;
}
.staffText {
  float: right;
  width: 530px;
  padding: 0px 20px 0px 0px;
}
.staffText p {
  margin: 1.6em 0px;
}
.staffText p.mixiCom {
  font-size: 85%;
  line-height: 1.5;
  margin: 0.6em 0px;
  padding-left: 3.5em;
}

/* ------------------------------------------------------------
	+19. Members Card
------------------------------------------------------------ */

#memberscard,#memberscardR {
  font-size: 124%;
}
#memberscard h2 {
  font-size: 131%;
  border-bottom: solid 1px #333;
  padding-bottom: 0.6em;
}
#memberscardR h2 {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 154%;
  font-weight: normal;
  border-bottom: solid 1px #333;
  padding-bottom: 0.3em;
}
#memberscard p {
  margin: 1.3em 0px;
}
#memberscard p.kome {
  margin: 0;
}
#memberscardR b {
  color: #000;
}

.cardRankTable {
  margin: 15px 0px;
}
.cardRankTable th, .cardRankTable td {
  border: solid 1px #333;
  padding: 3px 20px;
}
.cardRankTable th.txC {
  background-color: #eee;
}




/* ------------------------------------------------------------
	+20. Privacy Policy
------------------------------------------------------------ */

#privacypolicy {
  font-size: 124%;
}
#privacypolicy h2 {
  border-top: solid 1px #333;
  margin: 2em 0 1em 0;
  padding-top: 2em;
}
#privacypolicy h3 {
  margin: 2em 0 1em 0;
}


 /* ------------------------------------------------------------
	+21. Link
------------------------------------------------------------ */

#link dl {
  font-size: 124%;
  margin-top: 35px;
}
#link dt {
  border-top: solid 1px #333;
  margin: 0 0 0 0;
  padding: 1em 0 0 0;
}
#link dd {
  margin: -1.6em 0px 0px 0px;
  padding: 0px 0px 2em 20em;
}

/* ------------------------------------------------------------
	+22. 忘年会・新年会 ご予約受付のご案内（enkai.html）
------------------------------------------------------------ */
#enkai { font-size: 124%;}
#enkai #planImg { margin-top: 15px;}


/* ------------------------------------------------------------
	+98. Etc
------------------------------------------------------------ */

.clear { clear: both; }
.clearL { clear: left; }
.clearR { clear: right; }
.pageTop { text-align: right; padding-top: 25px;}
.txC { text-align: center; }
.txR { text-align: right; }
.txS { font-size: 93%; }
.kome { padding-left: 1em; text-indent: -1em;}
.listIcon li { background: url(../images/icon.gif) no-repeat 0px 5px; padding: 3px 0px 3px 30px;}

.flL {float: left;}

.mrg1 { margin: 1em 0px;}
.mrgT1 { margin-top: 1em;}
.mrgT2 { margin-top: 2em;}
.mrgB1 { margin-bottom: 1em;}
.mrgL15 { margin-left: 15px;}
.mrgT30 { margin-top: 30px;}
.mrgT50 { margin-top: 50px;}
.mrgT80 { margin-top: 80px;}

.colorLight { color: #000;}
.colorRed { color: #900; }


/* ------------------------------------------------------------
	+99. Clearfix
------------------------------------------------------------ */

.cleafix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  font-size: 0.1em;
  line-height: 0;
  visibility: hidden;
}
.cleafix { display: inline-block; }
/* Hides from IE-mac \*/
* html .cleafix { height: 1%; }
.cleafix { display: block; }
/* End hide from IE-mac */