@charset "UTF-8";

html {
  margin: 0;
  padding: 0;
  font-size: 62.5%;
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  color: #1c1c1c;
  font-family:"Sawarabi Mincho",serif;
  text-align: center;
  line-height: 2;
  letter-spacing: 0.09rem;
  font-size: 1.6rem;
  width: 1050px;
}

p {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,

img {
  width: 100%;
  height: auto;
}

ul {
  margin: 0;
  padding: 0;
}

ul li {
  list-style-type: none;
  padding: 0;
}

input {
  cursor: pointer;
}

.inner {
  width: 98%;
  margin: auto;
}

/*_________header*/
#hed{
height: 55px;
  width: 100%; 
  /* headと本文の間調整 */
} 
#page-header1 {
  box-sizing: border-box; 
  height: 100px;
  width: 100%;
position: fixed;   
  z-index: 10;
  display: flex;
  justify-content: flex-end;
  /* 黒 */
  margin: 0; 
  /* color: #fcfcfc; */
  background: rgb(242, 242, 242);
  /*背景色*/
  border-top: solid 1px #dcdcdc;
  box-shadow: 0 3px 0.5px rgba(0, 0, 0, 0.32); 
  /*影*/
}

.A-inner {
  width: 100%;
  height: 90px;
  /* background: #a8ffff;   */
  position: relative;
  text-align: center;
  justify-content: flex-end;
  justify-content: space-around;
  align-items: center;
  font-size: 20px;
  /* スカイブルー */
}

#page-header1 .coment {
  width: 400px;
  height: 75px;
  font-size: 17px;
  position: relative;
  top : -40px;
  left : 25%;  
/* background :#fff;   */
  /* 研究室部分 */
}
#page-header1 .A-inner a{
  color: #111111;
  text-decoration: none;
}
#page-header1 .coment img{
  width: 70px;
  height: 70px;
  position: relative;
  left :-90px; 
  top : 40px; 
  /* 桜マーク */
  /* background: #dcdcdc; */
}

.B-inner {
  width: 450px;
  height: 75px;
  /* background: #f9e0e0;    */
  font-size: 16px;
  position: relative;
  top: -60px;
  left : 26%; 
  /* 古史古伝 */
  }
  



 /* この中に本文コンテンツtext00______________  */
#top00{
  width: 99%;
  height: 2500px;
  /* バナー説明部分＋new＝contentsuTop00 */
  /* background: #ecf6a3;      */
  position: relative;
  top :50px;
  left :0px;
  font-size: 18px;
}

#wrapperTOTAL{
overflow: hidden;
}



/* メニュー */
#menu{
  height: 50px;
  /* background: #f4a73d;  */
  border-radius: 2%;
  width: 40vw;
  font-size: 20px;
  position: relative;
  left : 30%
}
#menu a{
  text-decoration: none;
  color: crimson;
  font-weight: bolder;
  font-size: 25px;
}
#me1{
  height: 50px;
}
/* バナー */
#bana{
  height: 200px;
  width: 100%;
  /* background: #e4c0f2;   */
  background-image: url(./images/yakumi.webp);  
}
#bana h2{
  padding-top: 30px;
  color: #dcdcdc;
}

/* newコンテンツ＿＿＿＿＿＿＿ */
#contetsuTop{
  height: 2200px;
  /* background: #8aeef0; */
}


/* 日本の薬味___________*/
#yakumi{
  position: relative;
  top :0px;
font-size: 18px;
width: 100vw;
height: 2000px;

}
#jp_yakumi{
  width: 100vw;
  height: 400px;
  /* background-image: url(./images/yakumi1.webp); */
/* color: #f5f5f5; */
background-size: cover;
}

#yakumi .lead{
  width: 90vw;
  text-align: center;
  letter-spacing: 0.08em;
  position: relative;
  left :5vw;
  padding-top: 10px;
  /* 文字幅 */
}
#yakumi h3{
  font-size: 18px;
}

/* 本草和名 ＿＿＿＿＿＿＿＿＿＿＿＿*/
#history{
  width: 95vw;
padding-top: 10px;
}
#history .lead{
  font-size: 21px;
}
#history .honzou{
  display: flex;
  justify-content: space-around;
  text-align: center;
  padding-top: 20px;
}
#history .photo1{
  width: 250px;
}
#history .text{
  width: 380px;
}
#history .photo1 img{
  width: 250px;
  height: 200px;
  border-radius: 2%;
}
#history .photo2{
  width: 250px;
}
#history .photo2 img{
width: 250px;
height: 200px;
border-radius: 2%;
}
#history .https{
  font-size: 13px;
  padding: 10px;
}

/* 現代の薬味 ＿＿＿＿＿＿＿＿＿＿＿*/

#kind {
  margin: 0;
  width: 95vw;
  height: 500px;
  max-width: 100%;
padding-top: 10px;
  /* background: linear-gradient(lightgreen 0% , cyan 100%); */
}
#kind  .lead{
  width: 800px;
  height: 70px;
  text-align: center;
  position: relative;
  left :70px;
  top: 20px;
  font-size: 20px;
}

.con{
  width: 100px;
  height: 300px;
 /* border: solid 0.01px #808080;  */
text-align: center;
font-size: 14px;
}
#kouka{
  display: flex;
  justify-content: space-around;
  padding-top: 20px;
  font-size: 13px;
  
}
#kouka img{
  width: 90px;
  height: 90px;
  border-radius: 50%;
}


/* 郷土料理 ＿＿＿＿＿＿＿＿＿＿＿*/
#kiyodo{
  margin: 0;
  width: 95vw;
  height: 650px;
}
#kiyodo  h3{
  font-size: 20px;
}
.conts{
  width: 300px;
  height: 450px;
  /* border: solid 0.01px #808080; */
}
#blk{
  display: flex;
  justify-content: space-around;
  padding-top: 10px;
  text-align: center;
}
#blk img{
  width: 300px;
  height: 250px;
  border-radius: 2%;
}

#eat1 img{
  position: relative;
  top :5px;
}

#up{
  font-size: large;
}




/* ______________footer___________________________ */
footer{
  display: flex;
  width: 120vw;
  height: 300px;
  font-size: 16px;
  /* background: #f7bfbf;   */
  position: relative;
  top: 100px;
  text-align: center;
  border-top: solid 3px #dcdcdc;
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);
}
footer a{
  color: #313131;
  text-decoration: none;
  font-size: 16px;
letter-spacing: 0.2rem;
}
/* 左会社説明 */
#com-footer{
  width: 40%;
  /* background: #fcf0f0;   */
  padding-top: 10px;
  font-size: 16px;
}
.comA{
  height: 50px;
  position: relative;
  top :10px;
  /* background: #e9fdff; */
  /* サイトマップ */
}
.comB{
  height: 50px;
  /* background: #ea7373; */
  position: relative;
  top :0px;
  /* 会社概要 */
}
.comC{
  height: 60px;
  position: relative;
  top :-10px;
  /* プライバシーポリシー */
}
.comD{
  height: 80px;
  position: relative;
  top :-20px;
}
/* 右お問い合わせ */
#bun-footer{
  width: 40%;
  /* background: #dcdcdc;   */
}


#bun-footer .bun-nav a{
  font-size: 15px;
}
#bun-footer .bun-nav{
  position: relative;
  top :20px;
}
.bun-inner {
  width: 100%;
  height: 100px;
  /* background: #ea7373;   */
  position: relative;
  top: 00px;
  /* お問い合わせ */
}

.bun-blk {
  width: 100%;
  height: 150px;
  /* background: #dbfcfc;   */
  position: relative;
  top: 20px; 
  padding: 10px;
  font-size: 15px;
  letter-spacing: 0.09rem;
  padding-top: 10px;
/* all rights reserved */
}

.bun-nav img {
  width: 30px;
  height: 30px;
  /* background: #7fffff; */
  padding-top: 20px;

}
.bun-nav p{
  color: #656565;
  font-family: serif;
}



/* スマホ____________________ */
@media only screen and (max-width: 414px) {
  img {
    max-width: 99%;
  }

  img {
    max-width: 99%;
    width
    /***/
    : auto;
    /*IE8用ハック*/
    height:auto;
    margin-left:auto;
    margin-right:auto;
  }

  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }

  
body{
  width: 414px;
  box-sizing: border-box;
  font-size: 1.2rem;
font-family: "Sawarabi Mincho";
}
  /* ヘッダースマホ___________ */
  #page-header1 {
    width: 400px;
  } 
  #page-header1 .coment {
    position: relative;
    left : 0px;
    top:-10px;
    font-size: small;
    /* 研究室のところ */
  }
  #page-header1 .coment img{
    width: 50px;
    height: 50px;
    position: relative;
    left :-10px;
    top :7px;
    /* 心マーク大きさ位置 */
  }

  .B-inner {
    position: relative;
    font-size: 1.2rem;
    left: -35px;
    top :-40px;
    /* 古史古伝 */
  } 




#wrapperTOTAL{
  overflow: hidden;
}




/* ＿＿＿＿＿＿＿＿この中に本文コンテンツ________ */
#top00{
  width: 98%;
  height: 5000px;
 /* background: #f3fcc0;   */

}

/* バナー */
#bana{
  height: 200px;
font-size: 1.3rem;
}
#bana h2{
  width: 80vw;
  position: relative;
  left :5%;
}

/* newコンテンツ______ */
#contetsuTop{
  height: 4600px;
  width: 95%;
  /* background: #f4f4f4; */
}


/* 日本薬味_スマホ__________*/
#yakumi{
  position: relative;
  top :20px;
width: 100vw;
height: 5000px;
}
#jp_yakumi{
  width: 100vw;
  height: 700px;
  /* background-image: url(./images/yakumi2.webp); */
background-size: cover;
}

.lead h2{
  width: 230px;
  font-size: 21px;
  padding-left: 30px;
}
.lead h3{
  text-align: left;
}

/* 本草和名 ＿スマホ＿＿＿＿＿＿＿＿＿＿＿*/

#history .honzou{
  display: block;
  position: relative;
  height: 700px;
  
}
#history  .lead{
  width: 330px;
  position: relative;
  left :10px;
}
#history img{
  position: relative;
  left :50px;
}
#history .text{
  width: 340px;
  
}
.https{
  position: relative;
  top :-100px;
}

/* 現代の薬味 ＿＿＿＿スマホ＿＿＿＿＿＿＿*/
#kind {
height: 900px;
/* background: #cdf3be; */
} 
#kind  .lead{
  width: 350px;
  position: relative;
  left :0px;
}
#kouka{
  display: block;
  display: flex;
  flex-wrap: wrap;
}

/* 郷土料理 ＿＿スマホ＿＿＿＿＿＿＿＿＿*/
#kiyodo{
  height: 1700px;
  padding-top: 20px;
}
#kiyodo h3{
  position: relative;
  left :30px;
}
#blk{
  display: block;
  position: relative;
  top :30px;
  left : 5%;
  height: 1300px;
  /* background: #dcdcdc; */
}
.conts{
  height: 550px;
}
#eat2{
  position: relative;
top: 50px;
}
#eat3{
  position: relative;
  top :40px;
}

/* UP一言＿＿＿＿スマホ＿＿＿＿＿ */
#up{
width: 300px;
padding-top: 100px;
position: relative;
left :5%;
}








/* Footerスマホ___________ */
footer{
display: block;
width: 100%;
text-align: center;
height: 600px;
}
#com-footer{
  width: 85%;
}

#bun-footer{
  width: 90%;
}
.bun-inner{
position: relative;
left :-20px;
top : 100px;
}








}