body{
     text-align: center;
     color: #000000;
     font-size: 16px;
     background-color: #EDEDDF;
     }

#cont{
      width: 920px;
      margin: 0 auto;
      }

#head{
      width: 920px;
      height: 100px;
      margin-top: -50px;
      margin-left: -2000px;
      margin-right: -2000px;
      padding-top: 50px;
      padding-left: 2010px;
      padding-right: 2010px;
      color: #ffffff;
      background-color: #838F35;
      }

#logo{
      width: 500px ;
      height: 100px;
      text-align: left;
      float: left;
      }

#info{
      width: 420px ;
      height: 100px;
      float: left;
      text-align: right;
      }

#info a { text-decoration: none; }

#side{
      font-size: 12px;
      width: 220px;
      margin-top: 20px;
      float: left;
      text-align: left;
      }

#cate{
      width: 200px;
      margin-top: 30px;
      padding: 10px;
      float: left;
      background-color: #FFFFFF;
      }

#shop{
      width: 200px;
      margin-top: 30px;
      padding: 10px;
      float: left;
      text-align: left;
      background-color: #FFFFFF;
      }

#main{
      width: 660px;
      margin-top: 20px;
      margin-left: 20px;
      text-align: left;
      float: left;
      }

#picture{
      width: 680px;
      height: 220px;
      float: left;
      background: url(/image/home/top.jpg) no-repeat
      }

#letter{
      width: 660px;
      margin-top: 20px;
      padding: 10px;
      float: left;
      background-color: #FFFFFF;
      }

a:hover img{ opacity: 0.5; }

#foot{
      clear: both;
      width: 900px;
      padding: 10px;
      margin: 20px 0;
      font-size: 14px;
      }

#foot a{
	text-decoration: none;
	color: #7A5834;
	}

#foot a:hover{ opacity: 0.5; }

#menu ul{ 
margin: 0; 
padding: 0;
list-style: none;
text-align: left;
}

#menu li{ 
padding: 0; 
margin: 0;
}

#menu li a{
display: block;
width: 220px;
height: 34px;
padding-left: 40px;
margin-bottom: 5px;
font-weight: bold;
line-height: 34px;
text-decoration: none;
color: #7A5834;
background: url(/image/home/menu.jpg) no-repeat 0 0;
}

#menu li a:hover{
text-decoration: none;
color: #838F35;
background-position: 0 bottom;
}


h1{ font-size: 10px; color: #ffffff; }

h2{
  color: #ffffff;
  font-size: 24px;
  background: linear-gradient( #838F35, #C6D27E );
  padding: 10px 20px;
  margin-top: -10px;
  margin-left: -10px;
  margin-right: -10px;
  }

h3 {
    font-size: 20px;
    position: relative;
    padding: 0.5em 0.5em 0.5em 1.5em;
    line-height: 1.4;
    color: #7A5834;
    }

h3:before{
	font-family: "Font Awesome 5 Free";/*忘れずに*/
	content: "\f138";/*アイコンのユニコード*/
	position: absolute;/*絶対位置*/
	font-size: 1em;/*サイズ*/
	left: 0.25em;/*アイコンの位置*/
	top: 0.5em;/*アイコンの位置*/
	color: #838F35; /*アイコン色*/
	 }

h4{
   font-size: 14px;
   padding-left: 20px;
   margin: -20px -10px 0;
   background-color: #BCAC8D;
   color: #FFFFFF;
   }

ul{ margin: 0 0 0 32px; padding: 0; }

hr{
   border-top: 2px dotted #BCAC8D;
   border-right: none;
   border-bottom: none;
   border-left: none;
   }

#cate ol{
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  padding:0.5em;
  
}

#cate ol li{
  border-bottom: dashed 1px #BCAC8D;
  position: relative;
  padding-left: 30px;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 30px;
}

#cate li a{
     text-decoration: none; 
     color: #7A5834;
     }

#cate ol li :before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display:inline-block;
  background: #7A5834;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align:center;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -moz-transform: translateY(-50%);
  	-webkit-transform: translateY(-50%);
  	-o-transform: translateY(-50%);
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
  }

#cate ol li :hover::before{ background-color:#838F35; }

#cate li a:hover{ color: #838F35; }

.yellow{ color: #E5E378; }

.red{ color: #dc143c; }

.pink{ color: #ff69b4; }

.blue{ color: #00bfff; }

.green{ color: #838F35; }

.brown{ color: #7A5834; }

.beige{ color: #BCAC8D; }

.mail{
      line-height: 175%;
      padding: 5px 10px;
      background-color: #7A5834;
      color: #FFFFFF;
      }

.mail:hover{ opacity: 0.5; }

.salmon{ color: #FCA67D; }

.detail{ font-size: 12px; }

.rome{ font-size: 18px; }

.mini{ font-size: 14px; }