@charset "UTF-8";
/* CSS Document */
.header {
  height: 100px;
    width: 100%;
    background-color:rgba(233,230,213,0.9);
    margin: 0;
    position: fixed;
}
.header h1 {
  color: #FFFFFF;
  text-align: left;
  padding: 12px 24px;
  font-size: 1.6rem;
}
.header h1 a {
  color: #FFFFFF;
  text-decoration: none;
}
.logo_header {
  position: absolute;
  left: 24px;
  top: 30px;
  width: 140px;
}
.btn_header {
position: absolute;
    width: 70px;
    top: 15px;
    right: 24px;
  opacity: 1.0;
}
    
.header_inner {
  display: none;
}

@media(min-width:1024px) {
  .header {
    height: 100px;
    width: 100%;
    background-color:rgba(233,230,213,0.9);
    margin: 0;
    position: fixed;
    
  }
  .header_wrapper {
    max-width: 1160px;
    margin: 0 auto;
  }
  .header h1 {
    color: #FFFFFF;
    text-align: left;
    padding: 12px 24px;
    font-size: 1.6rem;
  }
  .logo_header {
    left: 24px;
    top: 25px;
    width: 180px;
  }
  .header__navigation {
    width: 80%;
    display: block;
    text-align: right;
    position: absolute;
    top: 30px;
    right: 200px;
  }
  .header__navigation ul li {
    display: inline-block;
    margin-left: 20px;
    font-size: 20px;
  }
  .header__navigation ul li a {
    text-decoration: none;
    font-size: 2rem;
    font-weight: 600;
    color: #333333
  }
  .header_inner {
    max-width: 1160px;
    margin: auto;
    padding: 35px 10px;
    display: flex; 
justify-content: space-between;
  
  } 
  .title_logo {
    margin-right: auto;
  }
  .nav_list {
     display: flex;
    font-weight: 600;
    
  }
  a {
    margin: 0 40px;
    font-size: 26px;
    color: #9D2411;
    text-decoration: none;
  }
}



.section-top {
  background-color: #1D634B;
}
.header__sheer {
  opacity: 0.75;
}
.section-top__image {
  height: 100vh;
  background-image: url("../img/top_img_pc.png");
  padding: 133px 0px;
  background-position: center;
  background-size: auto 100%;
  background-repeat: repeat;
}
.section-top__image h1 {
  position: relative;
  top: 20%;
    color: #FFFFFF;
    margin: 0 auto;
    line-height: 90px;
    font-size: 40px;
    font-family: 'ヒラギノ明朝 ProN W6', YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
.section-top h2 {
  font-size: 24px;
}
.section-top p {
  padding: 0 24px;
}
.section-top__lead {
  color: #FFFFFF;
  margin-bottom: 100px;
}
.section-top ul {
  padding: 0px 24px;
  list-style: none;
}
.section-top ul li {
  color: #FFFFFF;
  text-align: center;
  padding-bottom: 60px;
  margin: 0 auto;
}
.top_illust {
  margin: 0 auto;
}
.section-top h4 {
  padding: 20px;
  border-bottom: none;
}
.icon_image {
  width: 300px;
  margin: 0 auto;
  display: block;
}
.shopping_btn {
 display: block;
    padding: 40px 0 60px;
    margin: 0 auto;
    width: 100%;
    max-width: 400px;
}
.section-makers ul li p{
  width: 300px;
}
/*------ーtop・Rーーーーーー-----*/
@media (min-width:1024px) {
  .top-wrapper {
    max-width: 1160px;
    margin: 0 auto;
  }
  .section-top {
    background-color: #1D634B;
  }
  .section-top__image {
    height: 450px;;
    background-image: url("../img/top_img_pc.png");
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
  }
  .section-top__image h1 {
   position: relative;
    top: 220px;
    width: 100%;
    margin: 0 auto;
    color: #FFFFFF;
    font-size: 60px;
    font-family: 'ヒラギノ明朝 ProN W6', YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  }
  .section-top h1 br {
    display: none;
  }
  .section-top__lead {
    color: #FFFFFF;
    margin-bottom:  60px;
  }
  .section-top ul {
    display: flex;
    padding: 0px 24px;
    list-style: none;
    justify-content: space-between;
  }
  .section-top ul li {
    width: 300px;
    padding: 0 40px 40px;
    /*    padding-bottom: 40px;*/
    margin: 0 auto;
  }
  .top_illust {
    display: inline-block;
    margin: 0 auto;
  }
  .section-top h4 {
    padding: 20px;
    border-bottom: none;
  }
  .icon_image {
    width: 100%;
    margin: 0 auto;
  }
  .shopping_btn {
    width: 600px;
    margin: 0 auto;
    padding-bottom: 60px;
  }
}
/*-----------３つの理由--------------------*/
.section-reasons {
  padding: 0 24px;
  background-color: #F9E6DC;
  color: #333333;
}
.section-reasons h2 {
  padding: 60px 0;
  background-color: #F9E6DC;
}
.section-reasons_contents__picture {
  height: 300px;
  width: 300px;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 1200px;
  border: solid 2px rgba(0, 0, 0, 0.50);
  display: block;
  margin: 0 auto 20px;
}
.section-reasons h3 {
  text-align: center;
}
.section-reasons p {
  padding: 30px 16px 40px;
  text-align: left;
  line-height: 2.0rem;
}
.section-reasons ul {
}
.section-reasons ul li {
  
}
.organic_veg__visual {
  display: block;
}
.direct_farm__discription {
  text-align: left;
  margin: 0 auto;
}
/*ーーーーーーー　３つの理由・R　　ーーーーーーーーーーーー*/
@media (min-width:960px) {
  .section-reasons {
    /*    padding: 0 200px;*/
    background-color: #F9E6DC;
    display: block;
    color: #333333;
    text-align: left;
    line-height: 2.0rem;
  }
  .section-reasons h2 {
    text-align: center;
    margin: 0 auto;
    padding: 80px 0 60px;
  }
  .section-reasons_contents__picture {
    height: 550px;
    width: 550px;
    border-radius: 1200px;
    margin-bottom: 20px;
    border: solid 2px rgba(0, 0, 0, 0.50)
  }
  .direct_farm, .organic_veg, .variety_veg {
    display: flex;
    padding-bottom: 60px;
    color: #333333;
  }
  .section-reasons h3 {
    text-align: left;
    font-size: 32px;
    padding: 60px 0;
    line-height: 2.0rem;
  }
  .organic_veg {
    flex-flow: row-reverse;
  }
  .section-reasons ul {
    padding: 0 24px;
    list-style: none;
  }
  .section-reasons ul li {
    padding-bottom: 60px;
  }
  .section-reasons ul li p {
    padding-top: 30px;
    text-align: left;
  }
  .section-reasons ul li h3 {}
}
.direct_farm__discription, .variety_veg__discription {
}
.variety_veg {
  padding-bottom: 20px;
}
/*-------------サンプル--------------------*/
.section-sample {
  background-color: #FFFFFF;
  color: #333;
  padding: 0 24px;
}
.section-sample h2 {
  padding-bottom: 60px;
}
.section-sample h3 {
  line-height: 2.0rem;
}
.section-sample ul {
  list-style: none;
  padding: 0 24px;
}
.section-sample ul li {
  text-align: left;
  margin: 0 auto;
}
.section-sample ul li {
  padding-bottom: 60px;
}
.section-sample_contents__picture {
  width: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 20px;
  border: solid 1px #777777;
}
.section-sample ul li span {
  font-size: 32px;
  font-weight: 600;
}
.section-sample p {
  line-height: 2.0rem;
}
/*^-----------------------------------*/
/*-------------------------------------*/
@media (min-width:960px) {
  .section-sample {
    background-color: #FFFFFF;
    color: #333333;
    
  }
 
  .section-sample h2 {
    padding: 60px 0;
  }
  .section-sample_contents__picture {
    width: 100%;
    height: 300px;
    border-radius: 20px;
    border: solid 1px #777;
  }
  .section-sample ul {
    list-style: none;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
  }
  .section-sample ul li {
    /*    padding-bottom: 60px;*/
    max-width: 500px;
    text-align: left;
  }
  .section-sample ul li span {
    font-size: 32px;
  }
}
/*-----------maker----------------------*/
.section-makers {
  background-color: #F9E6DC;
  color: #333333;
  padding: 0 24px;
}
.section-makers h3 {
  text-align: left;
  padding: 0 24px 16px;
  margin: 0 auto;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.section-makers ul {
/*  padding: 0 24px;*/
  list-style: none;
}
.section-makers ul li {
  /*  width: 350px;*/
  padding-bottom: 60px;
  margin: 0 auto;
  display: block;
}
.maker_serif {
  width: 300px;
  display: block;
  margin:0 auto 20px;
  
}
.makers_icon__yamada {
  height: 300px;
  width: 300px;
  object-fit: cover;
  object-position: 95% 50%;
  border-radius: 1200px;
  display: block;
  margin:0 auto 20px;
  border: solid 2px rgba(0, 0, 0, 0.50)
}
.makers_icon__ohta {
  height: 300px;
  width: 300px;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 1200px;
   display: block;
  margin:0 auto 20px;
  border: solid 2px rgba(0, 0, 0, 0.50)
}
.maker_ohta, .maker_yamada {
  padding-bottom: 16px;
  font-weight: 600;
  text-align: left;
}
.maker_soryoku__nouen, .maker_hidamari {
  text-align: left;
  width: 330px;
  margin: 0 auto;
}
/*-----　　生産者・R　　-------*/
@media (min-width:1160px) {
  .section-makers {
    background-color: #F9E6DC;
    color: #333333;
    /*    padding: 0 200px;*/
  }
  .section-makers h2 {
    padding-bottom: 60px;
  }
  .section-makers h2 br {
    display: none;
  }
  .section-makers h3 {
    text-align: left;
    padding: 0 24px 16px;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .sub_title {
    padding: 60px 0 30px;
    border-bottom: solid 1px #333333;
  }
  .section-makers ul {
    /*    width: 1160px;*/
    margin: 0 40px;
    list-style: none;
/*    padding: 0 24px;*/
    display: flex;
    justify-content: space-between;
  }
  .section-makers ul li {
    width: 500px;
    padding-bottom: 80px;
  }
  .maker_serif {
    width: 300px;
  }
  .makers_icon__yamada {
    height: 300px;
    width: 300px;
    object-fit: cover;
    object-position: 95% 50%;
    border-radius: 1200px;
    margin-bottom: 20px;
    border: solid 2px rgba(0, 0, 0, 0.50)
  }
  .makers_icon__ohta {
    height: 300px;
    width: 300px;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 1200px;
    margin-bottom: 20px;
    border: solid 2px rgba(0, 0, 0, 0.50)
  }
  .maker_ohta, .maker_yamada {
    padding: 0;
    width: 450px;
    font-weight: 600;
    text-align: left;
  }
  .maker_soryoku__nouen, .maker_hidamari {
    width: 450px;
    text-align: left;
  }
}
/*-------------　栽培　--------------------------*/
.section-plant {
  background-color: #FFFFFF;
  color: #333333;
  padding: 0 24px;
}
.section-plant h4 {
  padding: 60px 0 30px;
  border-bottom: solid 1px #333333;
  /*  margin: 0 24px;*/
}
.section-plant__discription {
  text-align: left;
  padding-bottom: 70px;
  border-bottom: dashed 1px #333;
}

.section-plant h3 {
  padding-bottom: 30px;
  text-align: center;
  font-weight: 600;
}
.section-plant ul {
  list-style: none;
  display: block; 
}
.section-plant ul li {
  list-style: none;
  padding-bottom: 40px;
}
/*
.plant_img__text {
  padding-top: 16px;
}
*/
.how_to_plant_01 {
  width: 250px;
  max-width: 237px;
  margin: 0 auto 60px;
  display: block;
}
.how_to_plant_02 {
   width: 250px;
  max-width: 237px;
  display: block;
  margin: 0 auto;
}
.section-plant__img {
  width: 250px;
  margin-bottom: 16px;
}

/*ーーーーーー　栽培・R　ーーーーーーーーーー*/
@media (min-width:960px) {
  .section-plant {
    background-color: #FFFFFF;
    color: #333333;
  }
  .section-plant h4 {
    padding: 60px 0 30px;
    border-bottom: solid 1px #333333;
  }
  .section-plant h2 {
    /*  font-family: */
    margin: 0 auto;
  }
  .section-plant h2 br {
    display: none;
  }
  .section-plant__discription {
    text-align: left;
    padding-bottom: 70px;
  }
  .section-plant h3 {
    padding-bottom: 60px;
  }
  .section-plant__discription {
    margin: 0 200px;
  }
  .section-plant ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
  }
  .section-plant ul li {
    width: 400px;
    padding-bottom: 20px;
    margin: 0 auto;
    text-align: left;
  }
  .section-plant__img {
    width: 400px;
    margin: 0;
    margin-bottom: 30px;
  }
  .how_to_plant_01 {
    width: 400px;
    max-width: 400px;
    margin-bottom: 40px;
    display: block;
  }
  .how_to_plant_02 {
   width: 400px;
    max-width: 400px;
    margin: 0 auto;
   
  }
}
/*-----------　レビュー　----------------*/
/*------------ レビュー --------------------*/
.section-review {
  background-color: #F9E6DC;
  padding: 0 24px;
}
.sub_title {
  padding: 60px 0 30px;
  border-bottom: solid 1px #333333;
}
.section-review__A, .section-review__O, .section_review__M {
  padding: 0 24px 60px;
  margin: 0 auto;
  display: block;
}

.section-review__picture {
    width: 100%;
    max-width: 400px;
    height: 270px;
    margin: 0 auto;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 20px;
    border: solid 1px #555;
}
.section-review h3 {
  font-size: 24px;
}
.section-review span {
  font-weight: 600;
}
.section-review__visual {
  width: 50vw;
  margin: 0 auto;
  float: left;
}
.section-review_content {
  display: block;
}
.review__text {
  
    text-align: left;
    max-width: 400px;
  margin: 0 auto;
}
/* -------　　レビュー・レスポンシブ　　---- */
@media (min-width:960px) {
  .section-review {}
  .section-review__A, .section-review__O, .section_review__M {
    background-color: #F9E6DC;
    margin: 0 auto;
    padding-left: 24px;
    padding-bottom: 60px;
    display: flex;
    text-align: left;
  }
  .section-review_content {
    padding: 0 30px;
  }
  .section-review span {
    font-weight: 600;
  }
  .section-review__visual {
    width: 50vw;
    margin: 0;
  }
  .section-review__picture {
    width: 400px;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 20px;
    border: solid 1px #555;
  }
  .section-review__text {
    padding: 65px 0 0px;
    text-align: left;
  }
  .section-review__O {
    padding-bottom: 80px;
  }
  .section-review_content {
    padding-left: 60px;
    padding-right: 0px;
  }
  .review__text {
    text-align: left;
    max-width: 600px;
}
}
/*--------　品質保証　-------------------*/
.section-Q_assurance {
  background-color: #FFFFFF;
  color: #333333;
  padding: 0 24px;
}
.section-Q_assurance h2 {
  /*  font-family: */
  padding-top: 60px;
}
.section-Q_assurance p {
  font-size: 16px;
  text-align: left;
  margin-bottom: 60px;
}
/*--------　品質保証・レスポンシブ-------------------*/
@media (min-width:960px) {
  .section-Q_assurance {
    background-color: #FFFFFF;
    color: #333333;
    /*    padding: 0 200px;*/
  }
  .section-Q_assurance h2 {
    padding: 80px 0 60px;
  }
  .section-Q_assurance p {
    font-size: 16px;
    text-align: left;
    margin-bottom: 80px;
  }
}
/*-------　クエスチョン　------------------*/
.section-question {
  background-color: #F9E6DC;
  padding: 0 24px;
}
.section-question h2 {
  padding-top: 60px;
  margin: 0 auto;
}
.section-question__01 {
  text-align: left;
}
.section-question__02 {
  text-align: left;
  padding-bottom: 60px;
}
.question_answer {
  border-bottom: none;
  text-align: left;
  padding-bottom: 30px;
}
.question_answer__text {
  margin-bottom: 0px;
}
/*  -------　クエスチョン・レスポンシブ　-----------*/
@media (min-width:960px) {
  .section-question {
    background-color: #F9E6DC;
    /*    padding: 0 200px;*/
  }
  .section-question h2 {
    padding: 80px 0 60px;
  }
  .section-question  {
  font-weight: bold;
    line-height: 2.0rem;
    }
  
  .section-question__01 {
    text-align: left;
  }
  .section-question__02 {
    text-align: left;
    padding-bottom: 20px;
  }
  .question_answer {
    border-bottom: none;
    text-align: left;
    padding-bottom: 30px;
    margin: 0;
  }
  .question_answer__text {
    margin-bottom: 60px;
    font-weight: 500;
  }
}
/*------------------------------*/
.section-sample_02 {
  background-color: #1D634B;
  color: #FFFFFF;
  padding: 0 24px;
}
.section-sample_02 h2 {
  padding-bottom: 60px;
}
.section-question h3 {
  font-weight: bold;
  line-height: 2.0rem;
}
.question_answer {
   font-weight: bold;
  line-height: 2.0rem;
  padding-bottom: 20px;
}
 
.section-sample_02 ul {
  list-style: none;
  padding: 0 24px;
}
.section-sample_02 ul li {
  text-align: left;
  margin: 0 auto;
}
.section-sample_02 ul li {
  padding-bottom: 60px;
}
.section-sample_contents__picture {
  width: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 20px;
  border: solid 1px #777777;
}
.section-sample_02 ul li span {
  font-size: 32px;
  font-weight: 600;
}
.section-sample_02 p {
  line-height: 2.0rem;
}
/*^-----------------------------------*/
/*-------------------------------------*/
@media (min-width:960px) {
  .section-sample_02 {
    background-color: #1D634B;
    color: #FFFFFF;
    /*    padding: 0 200px;*/
  }
  .section-sample_02 h4 {
    padding: 80px 0 30px;
    border-bottom: solid 1px #333333;
  }
  .section-sample_02 h2 {
    padding: 60px 0;
  }
  .section-sample_contents__picture {
    width: 100%;
    height: 300px;
    border-radius: 20px;
    border: solid 1px #777;
  }
  .section-sample_02 ul {
    list-style: none;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
  }
  .section-sample_02 ul li {
    /*    padding-bottom: 60px;*/
    max-width: 500px;
    text-align: left;
  }
  .section-sample_02 ul li span {
    font-size: 32px;
  }
}
.footer {
  height: 120px;
  background-color: #F8F2EF;
  color: #333333;
  font-size: 12px;
  position: relative;
}
.footer small {
  padding-top: 60px;
  clear: both;
  display: block;
  text-align: center;
}
.logo_footer {
  position: absolute;
  left: 24px;
  top: 30px;
  width: 140px;
}
@media(min-width:960px) {
  .footer {
    height: 120px;
    margin: 0 auto;
    background-color: #F8F2EF;
    color: #333333;
    font-size: 12px;
  }
  .logo_footer {
  position: absolute;
  left: 24px;
  top: 30px;
  width: 140px;
}
  .footer small {
    padding-top: 60px;
    clear: both;
    display: block;
    text-align: center;
  }
  .footer_wrapper {
    max-width: 1160px;
    margin: 0 auto;
    background-color: #AFE0B8;
  }
}
/*
  .logo_footer {
    position: absolute;
    left: 24px;
    bottom: 50px;
  
  
  */