@charset "utf-8";
/* CSS Document */

/*** top ***/
.top {
  height: 600px;
  background-image: url("../images/farm/main_visual.jpg");
  background-position: right 0px top 0px;
  background-size: 1017px 600px;
  background-repeat: no-repeat;
  color: #333;
  margin-bottom: 200px;
  text-align: left;
}
.top-text {
  width: 100%;
  padding: 260px 0 0 50px;
}
.top-text h1 {
  font-size: 6.6rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 700;
  line-height: 1.0;
  letter-spacing: 0.025rem;
  margin-bottom: 35px;
  background-color: #fff;
  width: 330px;
  padding: 10px 10px 15px 30px;
}
.top-text p {
  font-size: 2.4rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.1rem;
  margin-left: 80px;
  background-color: #fff;
  width: 260px;
  padding: 3px 8px 7px 20px;
}
.top-text p:first-of-type {
  margin-bottom: 20px;
}
.top-text a {
  text-decoration: none;
  color: #333;
}
@media(max-width: 768px) {
  .top {
    height: 490px;
    background-size: cover;
    margin-bottom: 100px;
  }
  .top-text {
    padding: 190px 0 0;
  }
  .top-text h1 {
    font-size: 2.4rem;
    width: 160px;
    margin-bottom: 40px;
    padding: 15px 10px 20px 30px;
  }
  .top-text p {
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: 0.1rem;
    margin: 0 auto;
    width: 200px;
    padding: 5px 8px 5px 20px;
    border-radius: 10px;
    vertical-align: middle;
  }
  .top-text p:first-of-type {
    margin-bottom: 20px;
  }
  .top-text a {
    
  }
  .top-text img {
    display: inline-block;
    vertical-align: text-bottom;
    margin: auto 0;
  }
}

/*** farm ***/
.farm {
  width: 100%;
  margin-bottom: 200px;
}
.farm-wrapper {
  width: 100%;
  text-align: center;
}
.farm-title {
  font-size: 4.8rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1rem;
  margin-bottom: 10px;
}
.farm-separator {
  font-size: 2.4rem;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 117px;
}
.farm-lead {
  font-size: 3.6rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.2rem;
  margin-bottom: 100px;
}
.farm-info1 {
  margin-bottom: 30px;
  padding: 0;
  display: flex;
  height: 454px;
}
.farm-info2 {
  margin: 0;
  padding: 0;
  display: flex;
  height: 438px;
}
.farm-info3 {
  margin: 0;
  padding: 0;
  display: flex;
  height: 447px;
}
.farm-info2 {
  flex-flow: row-reverse;
}
.farm-info1-visual, .farm-info2-visual, .farm-info3-visual {
  width: 50vw;
  margin: 0;
}
.farm-info1-image, .farm-info2-image, .farm-info3-image {
  height: auto;
  width: 82.5%;
}
.farm-info1-description, .farm-info2-description, .farm-info3-description {
  width: 50vw;
  text-align: left;
  font-size: 2.4rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.1rem;
}
.farm-info1-description {
  padding: 100px 0 0 45px;
}
.farm-info2-description {
  padding: 100px 0 0 14.5%;
}
.farm-info3-description {
  padding: 100px 0 0 50px;
}
.farm-info1-description p, .farm-info3-description p {
  width: 62.5%;
}
.farm-info2-description p {
  width: 88%;
}

@media(max-width: 768px) {
  .farm {
    margin-bottom: 150px;
  }
  .farm-title {
    font-size: 2.4rem;
    margin-bottom: 60px;    
  }
  .farm-separator {
    display: none;
  }
  .farm-lead {
    font-size: 1.8rem;
    margin-bottom: 60px;
    letter-spacing: 0;
  }
  .farm-info1, .farm-info2, .farm-info3 {
    margin-bottom: 80px;
    padding: 0;
    display: block;
    height: auto;
  }
  .farm-info2 {
    flex-flow: nowrap;
  }
  .farm-info1-visual, .farm-info2-visual, .farm-info3-visual {
    width: 100%;
    margin-bottom: 20px;
    }
  .farm-info1-description, .farm-info2-description, .farm-info3-description {
    width: 100%;
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: 0;
    padding: 0 24px;
  }
  .farm-info1-description p, .farm-info2-description p, .farm-info3-description p {
    width: 100%;
  }
}


/*** product ***/
.product {
  width: 100%;
}
.product-wrapper {
  width: 100%;
  text-align: center;
  margin-bottom: 100px;
}
.product-title {
  font-size: 4.8rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1rem;
  margin-bottom: 10px;
}
.product-separator {
  font-size: 2.4rem;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 117px;
}
.product-lead {
  font-size: 3.6rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.2rem;
  margin-bottom: 100px;
}
.product-description {
  font-size: 2.4rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.1rem;
  width: 668px;
  text-align: left;
  margin: 0 auto;
}
.product-list1, .product-list2 {
  margin: 0;
  padding: 0;
  display: flex;
  height: 900px;
  position: relative;
}
.product-list2 {
  height: 710px;
}
.product-fig, .product-lotus, .product-calla, .product-rice {
  width: 50%;
  padding: 0 0 0 40px;
}
.product-fig-visual, .product-calla-visual {
  position: absolute;
}
.product-lotus-visual, .product-rice-visual {
  position: absolute;
  transform: translateX(-60px);
}
.product-fig-description,
.product-lotus-description,
.product-calla-description,
.product-rice-description {
  position: absolute;
  width: 417px;
  top: 450px;
  text-align: left;
  margin-left: 97px;
}
.product-lotus-description,
.product-rice-description {
  margin-left: 37px;
}
.product-fig-description h3,
.product-lotus-description h3,
.product-calla-description h3,
.product-rice-description h3 {
  font-size: 3.6rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.2rem;
  padding: 0 0 0 30px;
  margin-bottom: 80px;
}
.product-fig-description p,
.product-lotus-description p,
.product-calla-description p,
.product-rice-description p {
  width: 100%;
  font-size: 2.4rem;
  font-family: 'Shippori Mincho', serif;
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.05rem;
}
@media(min-width: 769px) and (max-width: 1360px) {
  .product-list1, .product-list2 {
    margin: 0 auto;
    padding: 0;
    display: block;
    height: 100%;
    width: 100%;
    position: static;
  }
  .product-list2 {
    margin-bottom: -200px
  }
  .product-fig, .product-lotus, .product-calla, .product-rice {
    width: 100%;
    padding: 0;
    position: static;
  }
  .product-fig-visual, .product-calla-visual {
    position: static;
    width: 100%;
  }
  .product-lotus-visual, .product-rice-visual {
    position: static;
    width: 100%;
    transform: translate(0);
  }
  .product-fig-image,
  .product-lotus-image,
  .product-calla-image,
  .product-rice-image {
    width: 77%;
  }
  .product-fig-description,
  .product-lotus-description,
  .product-calla-description,
  .product-rice-description {
    position: relative;
    width: 78%;
    top: -200px;
    text-align: left;
    margin: 0 auto;
  }
  .product-fig-description h3,
  .product-lotus-description h3,
  .product-calla-description h3,
  .product-rice-description h3 {
    padding: 0 0 0 20%;
  }
}
@media(max-width: 768px) {
  .product-wrapper {
    margin-bottom: 60px;
  }
  .product-title {
    font-size: 2.4rem;
    line-height: 1;
    margin-bottom: 60px;
  }
  .product-separator {
    display: none;
  }
  .product-lead {
    font-size: 1.8rem;
    margin-bottom: 60px;
    letter-spacing: 0;
  }
  .product-description {
    font-size: 1.6rem;
    line-height: 1.75;
    letter-spacing: 0;
    width: 100%;
    padding: 0 24px;
  }
  .product-list1, .product-list2 {
    margin: 0 auto;
    padding: 0 24px;
    display: block;
    height: 100%;
    width: 100%;
    position: static;
  }
  .product-list2 {
    margin-bottom: -100px
  }
  .product-fig, .product-lotus, .product-calla, .product-rice {
    width: 100%;
    height: 100%;
    padding: 0;
  }
  .product-fig-visual, .product-calla-visual {
    position: static;
    width: 100%;
  }
  .product-lotus-visual, .product-rice-visual {
    position: static;
    width: 100%;
    transform: translate(0);
  }
  .product-fig-image,
  .product-lotus-image,
  .product-calla-image,
  .product-rice-image {
    width: 100%;
  }
  .product-fig-description,
  .product-lotus-description,
  .product-calla-description,
  .product-rice-description {
    position: relative;
    width: 80%;
    top: -120px;
    text-align: left;
    margin: 0 auto;
  }
  .product-fig-description h3,
  .product-lotus-description h3,
  .product-calla-description h3,
  .product-rice-description h3 {
    font-size: 1.8rem;
    letter-spacing: 0.1rem;
    padding: 0 0 0 11%;
    margin-bottom: 30px;
  }
  .product-fig-description p,
  .product-lotus-description p,
  .product-calla-description p,
  .product-rice-description p {
    font-size: 1.6rem;
    line-height: 1.75;
    letter-spacing: 0.05rem;
  }
}