@charset "UTF-8";
/**********************************
 *
 * pankuzu
 *
**********************************/
#pankuzu {
  width: 100%;
  height: auto;
  background-color: #f7f4ee;
  font-size: 11px;
  letter-spacing: 2.2px;
  color: #6c5b52;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 6px 0 0 0;
  position: fixed;
  z-index: 50;
  top: 100px;
  left: 0;
}

#pankuzu ul {
  margin: auto;
}

#pankuzu ul li {
  float: left;
  margin: 5px 30px 6px 0;
  border-radius: 2px;
  background-color: #669219;
  position: relative;
  vertical-align: middle;
  padding: 2px;
}

#pankuzu ul li a {
  color: #fff;
  padding: 5px 10px;
}

#pankuzu ul li:last-child {
  background-color: #fff;
  padding: 5px 10px;
  margin: 0 0 6px 0;
}

#pankuzu ul li:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -15px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-top: 1px solid #669219;
  border-right: 1px solid #669219;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

#pankuzu ul li:last-child::after {
  display: none;
}

body header {
  position: relative;
}

.loading .item .straw {
  width: 5.6vw;
}
@media (max-width: 768px) {
  .loading .item .straw {
    width: 14vw;
  }
}

.hero {
  background-position: center 112%;
}

.hero__inner {
  padding-top: 7vw;
  padding-bottom: 14vw;
}

.hero__inner .sub::before {
  left: 1vw;
}

.hero__inner .wrapper .title {
  width: 47vw;
  margin-top: 5vw;
}
@media (max-width: 768px) {
  .hero__inner .wrapper .title {
    width: 90.5vw;
    margin-top: -6vw;
  }
}

.hero__inner .wrapper .prods {
  align-items: flex-start;
  grid-column: 2;
  grid-row: 2;
}
@media (max-width: 768px) {
  .hero__inner .wrapper .prods {
    margin-top: 14vw;
  }
}

figure.straw2 {
  width: 8vw;
  margin-left: -0.5vw;
}
@media (max-width: 768px) {
  figure.straw2 {
    width: 18vw;
    margin-left: -50vw;
  }
}

figure.kv_img06 {
  transform: rotate(108deg) translate(-2.5vw, -8vw);
  width: 5vw;
}
@media (max-width: 768px) {
  figure.kv_img06 {
    transform: rotate(0) translate(0, 0);
    width: 11.4vw;
  }
}

.hero__inner .wrapper .pkg {
  margin-top: 3vw;
  margin-left: 7vw;
  gap: 0.1vw;
  display: flex;
}
@media (max-width: 768px) {
  .hero__inner .wrapper .pkg {
    margin-top: -60vw;
    margin-left: 20vw;
    margin-bottom: 10vw;
    gap: 2vw;
  }
}

.hero__inner .wrapper .pkg--large, .hero__inner .wrapper .pkg--short {
  width: 9vw;
}
@media (max-width: 768px) {
  .hero__inner .wrapper .pkg--large, .hero__inner .wrapper .pkg--short {
    width: 17.9vw;
  }
}

.hero__inner .sub::before {
  top: -1vw;
}

.about .intro2 {
  margin-top: 2vw;
}

.about::after {
  bottom: -2vw;
}

.about .intro2 .h3 {
  width: 51vw;
}
@media (max-width: 768px) {
  .about .intro2 .h3 {
    width: 76vw;
    margin: 5vw auto 0;
  }
}

.good__title {
  width: 84vw;
  left: -3.3vw;
}

.good__content.content1 .image .arrow {
  width: 9.3vw;
  position: absolute;
  top: 10vw;
  left: 14vw;
  z-index: 31;
}
@media (max-width: 768px) {
  .good__content.content1 .image .arrow {
    width: 24vw;
    top: 40vw;
    left: 48vw;
  }
}

.good .paragraph__main {
  margin-bottom: 3vw;
  margin-top: 4.4vw;
}
.good .paragraph__main.gatte {
  margin-top: 0;
}
@media (max-width: 768px) {
  .good .paragraph__main {
    margin-bottom: 6vw;
  }
}

.good__contents .content2 {
  display: none;
}

.good .bg-item.leaf-left {
  top: 70vw;
  left: -26.5vw;
}
@media (max-width: 768px) {
  .good .bg-item.leaf-left {
    top: 250vw;
    left: -26.5vw;
  }
}

.good .bg-item.leaf-right {
  width: 38vw;
  top: 36vw;
  right: -22.5vw;
}
@media (max-width: 768px) {
  .good .bg-item.leaf-right {
    width: 70vw;
    top: 188vw;
    right: -28vw;
  }
}

img.num {
  display: none !important;
}

.earth__inner .textbox .title {
  width: 39.4vw;
}
@media (max-width: 768px) {
  .earth__inner .textbox .title {
    width: 88vw;
  }
}

.earth__inner .textbox .desc span.asterisk {
  font-size: 50%;
  vertical-align: top;
  line-height: 3.2;
}

.earth__inner .textbox .desc.desc1::after {
  content: "(※)";
  display: none;
}

.products__inner .title {
  width: 36.2vw;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .products__inner .title {
    width: 72.9vw;
  }
}

@media (max-width: 768px) {
  .hero__inner .wrapper .prods__strong {
    width: 14.6666666667vw;
    height: 11.3333333333vw;
    top: -7vw;
    left: -26vw;
  }
}
@media (max-width: 768px) {
  .good__content.content1 {
    flex-direction: column-reverse;
  }
}
@media (max-width: 768px) {
  .good__content.content1 .paragraph {
    margin-top: 10vw;
  }
}
@media (max-width: 768px) {
  .good .bg-item.leaf-right.sp-only {
    bottom: 30vw;
  }
}
@media (max-width: 768px) {
  .special-feature .list {
    width: 82.6vw;
    margin: auto;
    gap: 2.4vw;
  }
  .special-feature .list::before, .special-feature .list::after {
    display: none;
  }
}
.slider__slide.large {
  width: 7.5vw;
}
@media (max-width: 768px) {
  .slider__slide.large {
    width: 13.6vw;
  }
}

@media (max-width: 768px) {
  .earth__inner {
    background-size: 75vw;
  }

  .earth__inner .textbox {
    padding-bottom: 20vw;
  }
}