@charset "shift_jis";

/*
--------------------------------------------------

CSS

author: yoozma.jp

--------------------------------------------------*/


/* 共通CSS
--------------------------------------------------*/

a:link {
	text-decoration:none;
	color: #003366;
	/* padding: 0px; */
	/* margin: 0px; */
}

a:visited {
	text-decoration: none;
	/* margin: 0px; */
	/* padding: 0px; */
}

a:hover {
	color: #000000;
	text-decoration: none;
	/* margin: 0px; */
	/* padding: 0px; */
}

img a:hover {
	background-color: transparent;
	line-height: 0px;
}


a img { 
	border: none; 
}


body {
	margin: 0 auto;
	padding: 0px;
	text-align: center;
background: #FFF url(../images/back.jpg) repeat-y center;

}

#body {
text-align: left; 
margin: 0 auto; 
padding: 0;

}


ul{
	list-style-type: none;
}




h2,h3{
	margin: 0px;
	padding: 0px;
	/* line-height: 0px; */
}

ul,li {
	margin: 0px;
	padding: 0px;
}


ul li.text {
	margin: 0px;
	line-height:normal;
	padding: 0px;
}


ul.textBox {
	margin: 10px;
}

ul.textBox02 {
	margin: 10px;
	padding: 0px;

	text-align:center;
}

.Nodisplay{
  display: none;
}

/* 共通フォント
--------------------------------------------------*/

ul,li,p {
	font-size: 87%;
	line-height: 200%;
}


/*  header
--------------------------------------------------*/

#header {
	margin: 0px auto;
	padding: 0px;
	width: 765px;
	text-align: left;

	position: relative;

}


h1#siterogo {
	margin: 10px 0px 0px 18px;
	padding: 0px;
	width: 280px;
	height: 69px;
}

#header #telfax {
	position : absolute;
	top : 0px;
	right : 18px;
}

#topimgs {
	margin: 0px 0px 15px 18px;
}

/* グローバルナビ
--------------------------------------------------*/
/*
#gnavi {
	padding: 0px;
	margin: 0px;
	width: 765px;
	height: 44px;
	clear: both;
}

#gnavi ul {
	padding: 0px;
	margin: 0px;
}

#gnavi ul li {
	padding: 0px;
	margin: 0px;
	float:left;
	list-style-type: none;
}
*/


#gnavi{
 background: url(../images/menu/back.gif) repeat-x;
 border: 1px solid #847A61;
 height: 36px;
 margin: 3px 0 12px;
}
    #gnavi ul{
     list-style: none;
     margin-left: 10px;
    }
        #gnavi ul li{
         float: left;
         border-right: 1px solid #3b2e0c;
        }
            #gnavi ul li a{
             display: block;
             padding: 8px 0;
            }
            #gnavi ul li.Menu01 a{
             padding: 8px 11px 10px;
            }
            #gnavi ul li.Menu02 a{
             padding: 7px 11px 9px;
            }
            #gnavi ul li.Menu03 a{
             padding: 7px 11px 9px;
            }
            #gnavi ul li.Menu04 a{
             padding: 7px 11px 9px;
            }
            #gnavi ul li.Menu05 a{
             padding: 7px 11px 9px;
            }
            #gnavi ul li.Menu06 a{
             padding: 8px 11px 9px;
            }
        #gnavi ul li.Menu07{
         border: none;
        }
            #gnavi ul li.Menu07 a{
             padding: 8px 11px 10px;
            }
            #gnavi ul li a:hover{
             background: url(../images/menu/back_o.gif) repeat-x;
            }
            
            
            

/* メイン部分
--------------------------------------------------*/

#main {
	margin: 0px auto 15px;
	padding: 0px;
	clear: both;
	width: 730px;

}


#column01 {
	float: left;
	width: 180px;
	margin: 0px;
	}
	

#column01 #ichioshi ul{
	padding: 10px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #e4dcaa;
}
#column01 .ProductsListBlock{
  margin: 0px 0px 15px 0px;
}
#column01 .ProductsListBlock .Unit{
  margin: 0px 0px 7px 0px;
}
#column01 .ProductsListBlock .Unit h2{
  margin: 0px 0px 3px 0px;
  padding: 0px;
}
#column01 .ProductsListBlock .Unit ul{
  margin: 0px;
  padding: 0px;
}
#column01 .ProductsListBlock .Unit li{
  background: url(../images/yajirushi.gif) no-repeat 0% 50%;
  margin: 0px;
  padding: 0px 0px 0px 15px;
  list-style-type: none;
  line-height: 137.5%;
  height: 11px;
}
html>body #column01 .ProductsListBlock .Unit li{
  height: auto;
  min-height: 11px;
}

#feed li{
line-height: 175%;
}
	
#column02 {
	float: left;
	width: 336px;
	margin: 0px 15px 0px 15px; 
	}
	


#column02 #oshirase ul {
	padding: 10px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #e4dcaa;
}

#column02 #life div {
	border: 2px solid #e4dcaa;
}


#column02 #life div table{
	margin:8px auto;
}
#life p{
 margin: 0;
 padding: 5px 10px;
 line-height: 1.2;
 font-size: 83%;
}
    #life strong{
     border-left: 3px double #555021;
     padding-left: 5px;
     margin-bottom: 3px;
     display: block;
     color: #444;
    }
        #life span{
         display: block;
         margin-top: 3px;
         text-align: right;
         font-size: 83%;
        }

#column03 {
	float: right;
	width: 180px;
	margin: 0;
}
*html #column03 {
	float: left;
}

#column03 ul.card li {
	margin: 0px 0px 10px 0px;
}


#column03 #kessai {
	background-color:#fbf8e8;
	margin-bottom:10px;
}


#column03 #otoiawase {
	background-color:#fbf8e8;
	width: 180px;
	margin-bottom:10px;
}
#otoiawase dl{
 padding: 0 10px 10px;
 margin: 10px 0;
}
#otoiawase dt,
#otoiawase dd{
 font-size: 83%;
 margin: 0; padding: 0;
}
#otoiawase dd{
 padding: 3px 0 10px;
}
    #otoiawase dd span{
     font-size: 80%;
    }
#otoiawase dt{
 border-bottom: 1px dotted #3f320f;
 color: #544109;
}




/* footer
--------------------------------------------------*/
#footer {
	margin: 30px auto 0px;
	padding: 0px;
	width:765px;
/*
	position:relative;
*/
}

#footer #footer-nav{
	text-align:center;
	margin: 0px;
	padding: 0 0;
	background-color:#696;
}

#footer-nav ul.footerNav{
	padding: 5px 0px;
}


#footer-nav ul.footerNav li {
	display:inline;
	list-style-type: none;
	border-right: 1px solid #333;
	padding: 0 5px;
}

#footer-nav ul.footerNav li.lasttext{
	border: none;
}
/*      LinkText      */
#footer a:link     {text-decoration: none; color: #fff;}
#footer a:visited  {text-decoration: none; color: #fff;}
#footer a:active   {text-decoration: none; color: #fff;}
#footer a:hover    {text-decoration: underline; color: #ffdc9f;}

p.totop {
	position : relative;
	text-align: right;
	padding-right: 10px;
}


p.copyright {
	text-align:center;
	margin: 0px 0px 10px 0px;
}

.att {
	color: #FF0000;
	text-align: center;
	font-size: 125%;
	margin: 20px;
}

#shopguide h2 {
	margin-top: 24px;
	padding: 10px;
	color: #5D4C1A;
	border-bottom: solid #5D4C1A 2px;
}

#shopguide h3 {
	color:#5D4C1A;
	margin-top: 2em;
	margin-bottom: 10px;
}

#shopguide p {
	margin: 0px 0px 0px 2em;
}

#shopguide h4 {
	margin: 12px 0px 0px 1em;
}

#shopguide table {
	margin: 0px 0px 0px 2em;
	font-size: 87%;
}


/*====================
 +clearfix
====================*/
#main {
	overflow: hidden;
	}


/*CSSハック
--------------------------------------------------*/
.clearfix:after {/* IE以外のモダンWebブラウザ向け */
 content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}

.clearfix {/* WinIE7、MacIE5対策 */
 display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {/* WinIE4〜6、MacIE4〜5対策 */
 height: 1%;
}
.clearfix {
 display: block;
}
#main #column01 #mobile {
 margin-top: 20px;
 text-align: center;
 padding-bottom: 10px;
}
#mobile p{
 margin: 0;
}
    #mobile span{
     display: block;
     padding: 0 10px;
     font-size: 70%;
     color: #444;
     text-align: left;
    }





/* タブメニュー
--------------------------------------------------*/

/* Hide useless elements in print layouts... */
@media print {
    #TabMenu {
        display: none;
    }
}
#TabMenu{}
/* Skin */
#TabMenu, .ui-tabs-panel {
    /* font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif; */
    font-size: 100%;
}
#TabMenu {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
#TabMenu:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
#TabMenu li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
#TabMenu a, #TabMenu a span {
    display: block;
    padding: 0 10px;
    background: url(tab.png) no-repeat;
}
#TabMenu a {
    margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    color: #3a4b1b;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
    outline: 0; /* prevent dotted border in Firefox */
}
#TabMenu .NowTab a {
    position: relative;
    top: 1px;
    z-index: 2;
    margin-top: 0;
    color: #000;
}
#TabMenu a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>#TabMenu a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
#TabMenu .NowTab a span {
    padding-bottom: 1px;
}
#TabMenu .NowTab a, #TabMenu a:hover, #TabMenu a:focus, #TabMenu a:active {
    background-position: 100% -150px;
}
#TabMenu a, #TabMenu .ui-tabs-disabled a:hover, #TabMenu .ui-tabs-disabled a:focus, #TabMenu .ui-tabs-disabled a:active {
    background-position: 100% -100px;
}
#TabMenu .NowTab a span, #TabMenu a:hover span, #TabMenu a:focus span, #TabMenu a:active span {
    background-position: 0 -50px;
}
#TabMenu a span, #TabMenu .ui-tabs-disabled a:hover span, #TabMenu .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span {
    background-position: 0 0;
}
#TabMenu .NowTab a:link, #TabMenu .NowTab a:visited, #TabMenu .ui-tabs-disabled a:link, #TabMenu .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
#TabMenu a:hover, #TabMenu a:focus, #TabMenu a:active,
#TabMenu .ui-tabs-deselectable a:hover, #TabMenu .ui-tabs-deselectable a:focus, #TabMenu .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}


/* Additional IE specific bug fixes... */
* html #TabMenu { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html #TabMenu  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}



