@charset "UTF-8";

/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}


/*
Project: hitotsugi
File: css/style.css
Last edited: 2010/09/01
*/

/*  Main  */
body,html {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 13px;
color:#3F312B;
height:100%;
}

#pagetop {
width: 100%;
background-image: url(../images/pagetop-bg.png);
background-repeat: repeat;
}

#wrap_1 {
width:920px; /*  Change to desired width :)  */
margin:0 auto;
}

/*  Head  */
#head {
width: 100%;
height:47px;
background-image: url(../images/pagetop-bg.png);
background-repeat: repeat;
}

/*  Left  */
#cont-left_1 {
width:150px;
float: left;
background-color: #F8FBF8;
border-right-width: 1px;
border-left-width: 1px;
border-right-color: #EEEEEE;
border-left-color: #EEEEEE;
border-right-style: solid;
border-left-style: solid;
}

/*  Menu  */
.menu {
}
.menu-btn {
margin-top: 45px;
}
.menu-btn li a {
display:block;
height: 40px;
width: 150px;
margin:0;
padding:0;
overflow:hidden;
text-indent:-9999px;
}

.menu-btn01 {
background-image: url(../images/menu_01.jpg);
background-position: left top;
}
.menu-btn01 a:hover{
background-image: url(../images/menu_01_2.jpg);
background-position: left top;
}

.menu-btn02 {
background-image: url(../images/menu_02.jpg);
background-position: left top;
}
.menu-btn02 a:hover{
background-image: url(../images/menu_02_2.jpg);
background-position: left top;
}

.menu-btn03 {
background-image: url(../images/menu_03.jpg);
background-position: left top;
}
.menu-btn03 a:hover{
background-image: url(../images/menu_03_2.jpg);
background-position: left top;
}

.menu-line {
height: 2px;
width: 150px;
background-image: url(../images/menu_line.jpg);
background-position: left top;
}

.menu-info {
font:13px/1.4em 'ＭＳ Ｐ明朝','ヒラギノ明朝 Pro',serif;
margin-top:10px;
}
.menu-info p {
padding-top: 10px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
}

/*  Mid  */
#bar-mid {
}

.line {
height: 2px;
width: 100%;
background-image: url(../images/menu_line.jpg);
background-position: left top;
background-repeat: repeat-x;
}

/*  Right  */
#wrap_2 {
width:920px; /*  Change to desired width :)  */
margin:0 auto;
}

#cont-left_2 {
width:150px;
background-color: #F8FBF8;
border-right-width: 1px;
border-left-width: 1px;
border-right-color: #EEEEEE;
border-left-color: #EEEEEE;
border-right-style: solid;
border-left-style: solid;
float:left;
}

/*  Page-Right  */
#cont-right {
width:760px;
float:left;
}

/*  Kodawari  */
.kodawari_tbl {
margin-top: 15px;
margin-right: auto;
margin-bottom: 5px;
margin-left: 10px;;
}
.kodawari_tbl td {
vertical-align:top;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 5px;
}
.kodawari_tbl td img {
padding:2px;
}
.kodawari_tbl td h2 {
font-size:1.8em;
margin-top:3px;
}
.kodawari_tbl td p {
font-size:1.2em;
line-height:1.4;
margin-top: 7px;
}

/*  TopNews  */
.news {
margin-top: 20px;
margin-right: auto;
margin-bottom: 15px;
margin-left: 10px;
padding-left:5px;
padding-right:5px;
}
.news h3 {
font-size:1.5em;
}
.news p {
margin-top: 10px;
padding-top: 10px;
padding-bottom: 10px;
font-size: 1em;
}

div#newsarea {
overflow: hidden;
height: auto;
}

div#newsarea div {
font-size: 1.1em;
line-height:1.6;
margin-top: 1.4em;
}

div.newsdate {
width: 18%;
float: left;
padding-bottom: 32767px;
margin-bottom: -32767px;
}

.newstitle {
font-weight: bold;
}

.newscont {
width: 82%;
float: left;
padding-bottom: 32767px;
margin-bottom: -32767px;
}

.news-tbl {
width:100%;
}
.news-tbl td {
font-size: 1.1em;
line-height:1.6;
padding-top: 10px;
padding-bottom: 10px;
}
.news-date {
width:120px;
}
.news-cont {
padding-left: 1em;
}
.news-cont p {

}

/*  Food  */
#food {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: 20px;
}
#food h3 {
font-size:1.2em;
}
#food table {
width:100%;
margin-top:20px;
margin-bottom:15px;
}
#food th {
font-size:1.2em;
font-weight:normal;
text-align:left;
height:25px;
vertical-align:top;
}
#food td {
font-size:1.1em;
height:20px;
vertical-align:top;
}
.food_cate {
width:180px;
}
.food_main {
width:270px;
}
.food_more {
width:110px;
}

.food_text {
margin-top:2em;
margin-bottom:2em;
}
.food_p {
font-size:110%;
width:98%;
line-height:1.7;
margin-right: auto;
margin-left: auto;
margin-top: 10px;
margin-bottom: 10px;
}

/*  SHOP  */
#shop {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: 20px;
}
#shop h3 {
font-size:1.2em;
}
#shop table {
width:100%;
margin-top:20px;
margin-bottom:15px;
}
#shop th {
font-size:1.2em;
font-weight:normal;
text-align:left;
height:25px;
vertical-align:top;
}
#shop td {
font-size:1.1em;
height:20px;
vertical-align:top;
}

.shop-photo {
}
.shop-photo td {
width:25%;
text-align:center;
}

.shop-info {
}
.shop-info td {
text-align:left;
padding-right:10px;
}
.shop-info p {
line-height:1.6;
}

/*  Pagebottom  */
#pagebottom {
width: 100%;
clear:both;
background-image: url(../images/pagetop-bg.png);
background-repeat: repeat;
}
/*  Footer  */
#footer {
font-size:0.9em;
color:#999;
text-align:right;
width:920px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding-top: 10px;
padding-right:30px;
padding-bottom: 10px;
}

/*  lightbox  */
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }