/* 一括で全ての要素の余白をゼロ、スクロールバーの色指定 */
* {
margin: 0;
padding: 0;
line-height: 180%;
SCROLLBAR-TRACK-COLOR: #FFFFFF;
SCROLLBAR-FACE-COLOR: #ffffff;
SCROLLBAR-ARROW-COLOR: #ff8400;
SCROLLBAR-3DLIGHT-COLOR: #ff8400;
SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF;
SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF;
SCROLLBAR-SHADOW-COLOR: #ff8400;
}

/* 文字サイズ、フォントなど指定 */
body {
font-size: 80%;
text-align: center;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
padding: 0;
margin: 0;
background: #FFB400 url(../image/wall1.jpg);
}

/* リンクの文字色に関する指定 */
a{/*リンクされた文字*/
    color:0000ff;
    font-style:normal;
    text-decoration:none;
}
a:link {/*未訪問のリンク*/
    color:0000ff;
    font-style:normal;
    text-decoration:none;
}
a:visited {/*訪問後のリンク*/
    color:#934C7B;
    text-decoration:none;
}
a:hover {/*マウスをのせたとき*/
    color:#ff0000;
    font-style:normal;
    text-decoration:none;
}
a:active {/*クリック中*/
    text-decoration:none;
}

/*-------文字を強調する設定---*/
strong {
border-bottom: double red 3px;
}

/*-------外枠のサイズなど設定*/
#container {
text-align: left;
width: 860px;
margin: 1em auto 0 auto;
background-image: url(../image/container_bg2.gif);
}

/*-------ヘッダー枠の設定　*/
#header {
width: 850px;
height: 100px;
margin: 0 auto 0 auto;
background-color: #fffff;
}

/*--------メインコンテンツ（box1）枠の設定 */
#box1 {
width: 850px;
margin: 0 auto 0 auto;
background-color: #fffff;
}

/*-------フッター枠の設定 */
#footer {
width: 855px;
height: 20px;
text-align: center;
margin: 0 auto 0 auto;
background-color: #fffff;
clear: both;
}

/*-------ナビゲーションメニュー枠の設定 */
#hm {
width: 850px;
height:29px;
margin: 0 auto 0 auto;
background:#ddd;
}

/*------ナビゲーションメニューに関する設定 */
div#menu ul {
margin:0;
padding:0;
}

div#menu li {
list-style-type:none;
float:left;
text-align:center;
margin:0;
padding:0;
}

div#menu li a{
display:block;
width:170px;
background:#ddd;
background-image: url("../image/menubtn03-009.jpg");
background-repeat: repeat-x;
line-height:28px;
}

div#menu li a:hover{
background:#9F1D20;
background-image: url("../image/menubtn03-004.jpg");
background-repeat: repeat-x;
}

/*------左サイド枠の設定 */
#lefts {
width: 190px;
margin: 0 auto 0 auto;
float: left;
background-color: #fffff;
}

/*------クリックすると展開するメニューに関する設定 */
.flipMenu {
width: 100%;
margin: 0;
font-size: 17px;
font-weight: bold;
vertical-align:middle;
list-style-position:inside;
}

/*-------左サイドメニュー（展開したままの場合））の設定 */
div#sideM ul{
width: 100%;
margin: 10px 0 0 15px;
}

div#sideM li{
font-size: 17px;
font-weight: bold;
list-style-type:none;
}

/*------左サイドバーboxに関する設定（スクロールバー付き） */
#main-box1 {
width: 100%;
height: 100px;
overflow: auto;
margin: 10px;
}

/*-------左サイドバーに入るboxの設定*/
#left-box {
width:95%;
margin:0;
padding: 0 5px;
}

/*-------左サイドバーメニューが入るboxの設定*/
#left-box2 {
width:97%;
margin:0 0px;
padding: 0 0 0 6px;
}

/*------メインメニュー、内容の入る枠（box2）の設定 */
#box2 {
width: 653px;
margin: 0 auto 0 auto;
float: right;
background-color: #fffff;
}

/*--------タイトル画像を入れる枠の設定 */
#tphoto {
width: 651px;
height: 281px;
margin: 0 0 0 auto;
text-align: right;
}

/*-------メイン枠の設定 */
#main {
width: 653px;
margin: 0 auto 0 auto;
background-color: #fffff;
}

/*-------メイン内容の題名に関する設定 */
h4 {
background: url("../image/bar35.gif") no-repeat bottom left;
font-size: 16px; /* 文字の大きさ */
width : 300px; /* 幅 */
padding:0px 0px 0px 30px; /* ボックスの内側[上 右 下 左]の余白 */
margin : 5px 0px 5px 30px; /* ボックスの外側[上 右 下 左]の余白 */
}


/*------画像の位置に関する設定*/
#image{
margin:10px 50px;
}

/*------メインに文章を書く場合のbox設定*/
#main-box2 {
width:80%;
height:auto;
margin:0 auto 0 4em;
}

/*------メインにフードとサプリに関する文章を書く場合のbox設定*/
#main-box6 {
width:90%;
height:auto;
margin:0 auto 0 3em;
}

/*------TOPページお知らせを書く場合のbox設定*/
#main-box4 {
width:300px;
height:auto;
margin:0 0 0 1em;
float: left;
}

/*------TOPページ「店主のひとりごと」書く場合のbox設定*/
#main-box5 {
width:41%;
height:auto;
margin:0 1em 0 0;
float: right;
}

/*-------メインにお勧め商品を載せる枠に関する設定 */
#main-box3 {
width: 40%;
height: auto;
margin:0 auto 0 1em;
clear: both;
}

#s-box1 {
width: 84px;
height: 84px;
margin: 0 auto 0 8px;
position: relative;
top: 10px;
z-index: 2;
}

#s-box2 {
width: 90%;
height: auto;
margin: 0 auto 0 8px;
padding:0 5px 0 0;
border: 3px double #e5b713;
position: relative;
top: -45px;
left: 20px;
z-index: 1;
}

/*------メインのテーブルに関する設定*/
#main-table {
width:80%;
height:auto;
margin:0 auto 0 4em;
}


/*------メイン部分の画像に関する設定*/
/*======画像に文字を回り込み（右）*/
img.left {
float:left;
text-align:center;
}

p.clear_l{
clear:left;
}

/*======画像に文字を回り込み(左）*/
img.right {
float:right;
text-align:center;
}
p.clear_r{
clear:right;
}


