@charset "UTF-8";


/* loading
------------------------------------------------- */
#wrapper,
#lang,
#navtoggle {
    opacity: 0;
}
#loading {
    width: 100%;
    height: 100vh;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99;
}
#loading .loadinglogo {
    width: 2.87rem;
    height: 0.77rem;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -0.385rem 0 0 -1.435rem;
    opacity: 0;
    transform: scale(1);
}
#loading.is-show {
    animation: fadeOut 0.9s ease 1.5s 1 forwards;
}
#loading.is-show .loadinglogo {
    animation: loading 2s ease-out 0.2s 1 forwards;
}
@media screen and (max-width:750px){
#loading {
    height: 100svh;
}
#loading .loadinglogo {
    width: 1.8rem;
    height: 0.482926rem;
    margin: -0.24146rem 0 0 -0.9rem;
}
}


/* body
------------------------------------------------- */
body {
    background: url("../img/common/bg.jpg") center top repeat-y;
    background-size: 100% auto;
}
@media screen and (max-width:750px){
#wrapper {
    overflow-x: hidden;
}
}


/* mainvisual
------------------------------------------------- */
.mainvisual {
    width: 100%;
    height: 56.36896vw;
    overflow: hidden;
    position: relative;
}
.mainvisual::after {
    content: '';
    width: 108.657vw;
    height: 23.937vw;
    background: url("../img/top/mainimg.svg") center center no-repeat;
    background-size: cover;
    position: absolute;
    left: -9.297vw;
    top: 13.25vw;
    z-index: 1;
}
.mainvisual .mainttl {
    width: 35.66325vw;
    height: 27.6vw;
    position: absolute;
    right: 50%;
    bottom: 1.61054vw;
    margin-right: 8.2723vw;
    z-index: 5;
    overflow: hidden;
}
.mainvisual h2 {
    opacity: 0;
    transition: 1s 0.2s;
}
.mainvisual.is-on2 h2 {
    opacity: 1;
}
.mainvisual h2 span {
    display: block;
    font-size: 1.42752vw;
    font-weight: 500;
    line-height: 1.4875;
    letter-spacing: 0.07em;
    text-align: right;
    padding-top: 1.53733vw;
}
.mainvisual picture {
    position: absolute;
    z-index: 3;
    opacity: 0;
}
.mainvisual picture.fi01 {
    transition: 0.4s 0.08s;
    opacity: 1;
}
.mainvisual picture.fi02 {
    transition: 0.4s 0.16s;
    opacity: 1;
}
.mainvisual picture.fi03 {
    transition: 0.4s 0.24s;
    opacity: 1;
}
.mainvisual picture.fi04 {
    transition: 0.4s 0.32s;
    opacity: 1;
}
.mainvisual picture.fi05 {
    transition: 0.4s 0.4s;
    opacity: 1;
}
.mainvisual picture.fi06 {
    transition: 0.4s 0.48s;
    opacity: 1;
}
.mainvisual picture.fi07 {
    transition: 0.4s 0.56s;
    opacity: 1;
}
.mainvisual picture.fi08 {
    transition: 0.4s 0.64s;
    opacity: 1;
}
.mainvisual picture.fi09 {
    transition: 0.4s 0.72s;
    opacity: 1;
}
.mainvisual picture.fi10 {
    transition: 0.4s 0.8s;
    opacity: 1;
}
.mainvisual picture.fi11 {
    transition: 0.4s 0.88s;
    opacity: 1;
}
.mainvisual picture.fi12 {
    transition: 0.4s 0.96s;
    opacity: 1;
}
.mainvisual .fruit {
    width: 8.1259vw;
    position: absolute;
    z-index: 2;
    opacity: 0;
    transition: 0.3s;
}
.mainvisual.is-on1 .fruit {
    opacity: 1;
}
.mainvisual .fruit h3 {
    width: 100%;
    height: 1.09809vw;
    font-size: 0.95168vw;
    font-weight: 500;
    line-height: 1.153846;
    letter-spacing: normal;
    color: #C7B299;
    margin-bottom: 0.585vw;
    opacity: 0;
}
.mainvisual .fruit p {
    font-size: 0.732064vw;
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: normal;
    color: #C7B299;
}
.mainvisual .main_avocado {
    width: 15.30014vw;
    left: 4.90483vw;
    top: 10.4685vw;
}
.mainvisual .avocado {
    width: 8.1259vw;
    left: 2.3426vw;
    top: 7.101vw;
}
.mainvisual .main_banana {
    width: 25.32942vw;
    left: 42.82576vw;
    bottom: 0;
}
.mainvisual .banana {
    left: 44.143vw;
    top: 34.626vw;
}
.mainvisual .main_berry {
    width: 10.61493vw;
    left: -5.27086vw;
    bottom: 1.46412vw;
}
.mainvisual .main_blueberry {
    width: 13.10395vw;
    left: 37.7013vw;
    top: 19.6925vw;
}
.mainvisual .blueberry {
    left: 51.537vw;
    top: 22.108vw;
    transform: rotate(90deg);
}
.mainvisual .main_cherry {
    width: 8.19912vw;
    left: 14.7144vw;
    top: 4.31918vw;
}
.mainvisual .cherry {
    left: 23.645vw;
    top: 5.124vw;
}
.mainvisual .cherry h3 {
    margin: 0.585vw 0 0;
}
.mainvisual .main_grape1 {
    width: 14.34846vw;
    right: 7.32064vw;
    top: 5.34407vw;
}
.mainvisual .grape {
    width: 7.3206vw;
    left: 88.653vw;
    top: 16.764vw;
    transform: rotate(90deg);
}
.mainvisual .main_grape2 {
    width: 12.2254vw;
    right: -4.39238vw;
    top: 24.59736vw;
}
.mainvisual .main_kiwifruit {
    width: 19.03367vw;
    right: 14.4948vw;
    top: 22.4743vw;
}
.mainvisual .kiwifruit {
    left: 66.105vw;
    top: 20.79vw;
}
.mainvisual .main_lemon {
    width: 10.61493vw;
    left: 32.9428vw;
    top: 7.10102vw;
}
.mainvisual .lemon {
    width: 9.59vw;
    left: 44.289vw;
    top: 7.101vw;
}
.mainvisual .main_mango {
    width: 11.5666vw;
    right: 21vw;
    bottom: 2.3426vw;
}
.mainvisual .mango {
    left: 68.228vw;
    top: 39.311vw;
    transform: rotate(90deg);
}
.mainvisual .main_orange {
    width: 13.1039vw;
    right: 32.1376vw;
    top: 7.1010vw;
}
.mainvisual .orange {
    left: 68.228vw;
    top: 8.784vw;
}
.mainvisual .main_pineapple {
    width: 12.6647vw;
    right: 7.467vw;
    bottom: 1.098vw;
}
.mainvisual .pineapple {
    width: 9.882vw;
    left: 91.142vw;
    top: 45.095vw;
}
@media screen and (max-width:750px){
.mainvisual {
    width: 100%;
    height: 145vw;
    overflow: inherit;
}
.mainvisual::after {
    width: 200vw;
    height: 44vw;
    top: 100vw;
}
.mainvisual .mainttl {
    width: 65vw;
    height: 50.303vw;
    right: auto;
    left: 4vw;
    bottom: auto;
    top: 45vw;
    margin-right: 0;
}
.mainvisual h2 span {
    font-size: 2.6vw;
}
.mainvisual .fruit {
    width: 20.31475vw;
}
.mainvisual .fruit h3 {
    height: 2.75vw;
    font-size: 2.3792vw;
}
.mainvisual .fruit p {
    font-size: 1.83016vw;
}
.mainvisual .main_avocado {
    width: 27vw;
    left: -2vw;
    top: 16vw;
}
.mainvisual .avocado {
    width: 28vw;
    left: 27vw;
    top: 23vw;
}
.mainvisual .main_banana {
    width: 48vw;
    left: 35vw;
    bottom: -8vw;
}
.mainvisual .banana {
    left: 30vw;
    top: 105vw;
}
.mainvisual .main_berry {
    display: none;
}
.mainvisual .main_blueberry {
    width: 26.2079vw;
    left: -8vw;
    top: auto;
    bottom: 27vw;
}
.mainvisual .blueberry {
    left: 7vw;
    top: 96vw;
}
.mainvisual .main_cherry {
    width: 16.39824vw;
    left: 4.5vw;
    top: -6vw;
}
.mainvisual .cherry {
    width: 18vw;
    left: 25vw;
    top: 2vw;
}
.mainvisual .main_grape1 {
    width: 28.69792vw;
    right: -6vw;
    top: -7vw;
}
.mainvisual .grape {
    width: 18vw;
    left: 58vw;
    top: 1vw;
}
.mainvisual .main_grape2 {
    display: none;
}
.mainvisual .main_kiwifruit {
    width: 38.06734vw;
    right: -10vw;
    top: 70vw;
}
.mainvisual .kiwifruit {
    width: 23vw;
    left: auto;
    right: 5vw;
    top: 63vw;
}
.mainvisual .main_lemon {
    width: 21.22986vw;
    left: 43vw;
    top: 15vw;
}
.mainvisual .lemon {
    display: none;
}
.mainvisual .main_mango {
    width: 20vw;
    right: 15vw;
    top: 41vw;
}
.mainvisual .mango {
    left: 66vw;
    top: 24vw;
}
.mainvisual .main_orange {
    width: 24vw;
    right: 62vw;
    top: auto;
    bottom: -5vw;
}
.mainvisual .orange {
    width: 30vw;
    left: -12vw;
    top: 134vw;
}
.mainvisual .orange h3 {
    text-align: right;
    padding-right: 1em;
    box-sizing: border-box;
}
.mainvisual .main_pineapple {
    width: 25.3294vw;
    right: -4vw;
    bottom: 0;
}
.mainvisual .pineapple {
    width: 30vw;
    left: 60.105vw;
    top: 95vw;
}
}


/* newsbox
------------------------------------------------- */
.newsbox {
    padding: 0.15rem 0 1.1rem;
}
.newsbox .sec {
    height: 1.82rem;
    background-color: #fff;
    border-radius: 0.3rem;
    padding: 0.15rem 1.15rem 0.15rem 0.55rem;
    box-sizing: border-box;
}
.newsbox .sec h3 {
    font-size: 0.12rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
}
.newsbox .sec h3 span {
    font-size: 0.3rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: normal;
    color: #00AA2D;
    padding-right: 0.1rem;
}
.newsbox .sec .box {
    width: 7.5rem;
    border-left: 0.005rem solid #999;
    padding-left: 0.3rem;
    box-sizing: border-box;
}
.newsbox .sec .box .news-slider {
    height: 1.18rem;
}
.newsbox .sec .box .news-slider .swiper-slide {
    height: 0.2rem;
    margin-bottom: 0.2rem;
}
.newsbox .sec .box .news-slider .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
}
.newsbox .sec .box .news-slider .swiper-slide a dl {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dt {
    width: 25%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dt span {
    width: 1.02rem;
    height: 0.2rem;
    background-color: #CCEED5;
    font-size: 0.12rem;
    letter-spacing: 0.02em;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dt b {
    font-size: 0.11rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    color: #999;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dd {
    width: 72%;
    font-size: 0.14rem;
    line-height: 1.25;
    letter-spacing: normal;
    display: -webkit-box;             
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}
.newsbox .sec .box .swiper-scrollbar {
    width: 0.11rem;
    height: 1.53rem;
    background-color: #fff;
    right: 0.83rem;
    top: 0.13rem;
    border: 0.005rem solid #707070;
    border-radius: 0.1rem;
    box-sizing: border-box;
}
.newsbox .sec .box .swiper-scrollbar .swiper-scrollbar-drag {
    width: 0.07rem;
    background-color: #747373;
    left: 0.015rem;
    top: 0;
}
.newsbox .sec .box .swiper-button-next,
.newsbox .sec .box .swiper-button-prev {
    width: 0.26rem;
    height: 0.26rem;
    left: auto;
    right: 0.32rem;
    top: 0.39rem;
    margin: 0;
}
.newsbox .sec .box .swiper-button-next {
    transform: scale(1, -1);
    top: auto;
    bottom: 0.39rem;
}
.newsbox .sec .box .swiper-button-next::after,
.newsbox .sec .box .swiper-button-prev::after {
    content: '';
    width: 0.26rem;
    height: 0.26rem;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_6806%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%206806%22%20transform%3D%22translate(-1224%20-826)%22%3E%20%3Ccircle%20id%3D%22%E6%A5%95%E5%86%86%E5%BD%A2_36%22%20data-name%3D%22%E6%A5%95%E5%86%86%E5%BD%A2%2036%22%20cx%3D%2213%22%20cy%3D%2213%22%20r%3D%2213%22%20transform%3D%22translate(1224%20826)%22%20fill%3D%22%23ccc%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_112126%22%20data-name%3D%22%E3%83%91%E3%82%B9%20112126%22%20d%3D%22M1229.64%2C841.87l6.97-6.98%2C6.98%2C6.98%22%20transform%3D%22translate(0.86%20-1)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%221%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
}
.newsbox .sec .box .btnst1 {
    justify-content: flex-end;
    margin-top: 0.05rem;
}
.newsbox .sec .box .btnst1 a {
    width: 1rem;
    height: 0.15rem;
    padding-right: 0.2rem;
}
.newsbox .sec .box .btnst1 a span {
    right: 0;
}
.newsbox .sec .box .btnst1 a::before {
    content: '';
    width: 0;
    height: 0.02rem;
    background-color: #00AA2D;
    position: absolute;
    left: 0;
    bottom: -0.04rem;
    z-index: 2;
    transition: 0.3s;
}
.newsbox .sec .box .btnst1 a::after {
    display: none;
}
@media (hover: hover) and (min-width:751px) {
.newsbox .sec .box .news-slider .swiper-slide a:hover dl dd {
    text-decoration: underline;
}
.newsbox .sec .box .btnst1 a:hover::before {
    width: calc(100% - 0.2rem);
}
}
@media screen and (max-width:750px){
.newsbox {
    padding: 0.3rem 0 0.8rem;
}
.newsbox .sec {
    height: 2.55rem;
    border-radius: 0.2rem;
    padding: 0.2rem 0.35rem 0.2rem 4vw;
}
.newsbox .sec h3 {
    font-size: 0.12rem;
    margin-bottom: 0.15rem;
}
.newsbox .sec .box {
    width: 100%;
    border-left: none;
    padding-left: 0;
}
.newsbox .sec .box .news-slider {
    height: 1.5rem;
}
.newsbox .sec .box .news-slider .swiper-slide {
    height: 0.45rem;
    margin-bottom: 0.05rem;
}
.newsbox .sec .box .news-slider .swiper-slide a dl {
    display: block;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dt {
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 0.02rem;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dt span {
    margin-right: 0.15rem;
}
.newsbox .sec .box .news-slider .swiper-slide a dl dd {
    width: 100%;
}
.newsbox .sec .box .swiper-scrollbar {
    height: 1.7rem;
    right: 0.15rem;
    top: 0.65rem;
}
.newsbox .sec .box .swiper-button-next,
.newsbox .sec .box .swiper-button-prev {
    display: none;
}
.newsbox .sec .box .btnst1 {
    margin-right: 0.1rem;
}
.newsbox .sec .box .btnst1 a::before {
    display: none;
}
}


/* about
------------------------------------------------- */
.about {
    padding-bottom: 1.4rem;
    position: relative;
}
.about::after {
    content: '';
    width: 11.57rem;
    height: 5rem;
    background: url("../img/top/about_bg.png") center center no-repeat;
    background-size: cover;
    mix-blend-mode: multiply;
    position: absolute;
    left: 50%;
    top: 0.77rem;
    margin-left: -3.8rem;
    opacity: 0;
}
.about.isAnimate::after {
    animation: fadeUp 0.8s ease 0.4s 1 forwards;
}
.about .inner11 {
    z-index: 2;
}
.about p {
    width: 3.44rem;
    font-size: 0.14rem;
    line-height: 2.14;
    letter-spacing: 0.06em;
    padding-bottom: 1em;
}
@media screen and (max-width:750px){
.about {
    padding-bottom: 0.8rem;
}
.about::after {
    width: 130vw;
    height: 56.18vw;
    left: -20vw;
    margin: 0;
    top: 2rem;
}
.about p {
    width: 100%;
    line-height: 1.875;
    letter-spacing: 0.04em;
    padding: 45vw 0 1em;
}
}


/* strength
------------------------------------------------- */
.strength {
    background-color: rgba(255,255,255,0.6);
    border-radius: 0.5rem;
    padding: 1rem 0 0.85rem;
    margin-bottom: 2.1rem;
    position: relative;
}
.strength::after {
    content: '';
    width: 7.9rem;
    height: 7.9rem;
    background: url("../img/strength/earth.png") center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 50%;
    top: 1.07rem;
    margin-left: 0.47rem;
    opacity: 0;
}
.strength.isAnimate::after {
    animation: fadeUp 0.8s ease 0.4s 1 forwards;
}
.about .strength {
    z-index: 2;
}
.strength p {
    width: 3.44rem;
    font-size: 0.14rem;
    line-height: 2.14;
    letter-spacing: 0.06em;
    padding-bottom: 1em;
}
@media screen and (max-width:750px){
.strength {
    border-radius: 0.25rem;
    padding: 0.5rem 0 0.85rem;
    margin-bottom: 1.8rem;
}
.strength::after {
    width: 80vw;
    height: 80vw;
    right: -120vw;
    top: auto;
    bottom: -1.4rem;
    margin-left: -10vw;
}
.strength p {
    width: 100%;
    line-height: 1.875;
    letter-spacing: 0.04em;
}
}


/* products
------------------------------------------------- */
.products {
    margin-bottom: 1.5rem;
}
.products .headline3 {
    margin-bottom: 0.6rem;
}
 
.products .products-slider {
    overflow: inherit;
}
.products .products-slider .swiper-slide {
    width: 2.2rem;
    height: 2.2rem;
    background-color: #fff;
    border-radius: 50%;
    margin-right: 0.2rem;
}
.products .products-slider .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
    padding-top: 1.33rem;
    box-sizing: border-box;
    position: relative;
}
.products .products-slider .swiper-slide a.new::after {
    content: '';
    width: 0.56rem;
    height: 0.56rem;
    background: url("../img/products/new.svg") center center no-repeat;
    background-size: cover;
    position: absolute;
    right: 0.06rem;
    top: -0.06rem;
}
.products .products-slider .swiper-slide a picture {
    width: 1.8rem;
    height: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0.2rem;
    bottom: 0.96rem;
    transition: 0.3s;
}
.products .products-slider .swiper-slide a picture img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 100%;
}
.products .products-slider .swiper-slide a h4 {
    font-size: 0.18rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: normal;
    padding-top: 0.15rem;
    text-align: center;
    position: relative;
}
.products .products-slider .swiper-slide a h4::before {
    content: '';
    width: 0.01rem;
    height: 0.14rem;
    background-color: #707070;
    position: absolute;
    left: 50%;
    top: 0;
}
.products .products-slider .swiper-slide a h4 span {
    display: block;
    font-size: 0.11rem;
    font-weight: 400;
    line-height: 1.18;
    letter-spacing: 0.05em;
    color: #696969;
}
.products .products-slider .swiper-slide a h4 b {
    display: block;
    width: 0.2rem;
    height: 0.125rem;
    position: absolute;
    left: 50%;
    bottom: -0.2rem;
    overflow: hidden;
    margin-left: -0.15rem;
}
.products .products-slider .swiper-slide a h4 b::before,
.products .products-slider .swiper-slide a h4 b::after {
    content: '';
    width: 0.14rem;
    height: 0.12rem;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214.088%22%20height%3D%2212.534%22%20viewBox%3D%220%200%2014.088%2012.534%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_7131%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%207131%22%20transform%3D%22translate(-1139.787%20-885.807)%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_126483%22%20data-name%3D%22%E3%83%91%E3%82%B9%20126483%22%20d%3D%22M1180.3%2C882.36l4.853%2C4.853-4.853%2C4.853%22%20transform%3D%22translate(-32.693%204.861)%22%20fill%3D%22none%22%20stroke%3D%22%2300aa2d%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_68%22%20data-name%3D%22%E7%B7%9A%2068%22%20x2%3D%2211.053%22%20transform%3D%22translate(1140.787%20892.221)%22%20fill%3D%22none%22%20stroke%3D%22%2300aa2d%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -0.06rem;
}
.products .products-slider .swiper-slide a h4 b::after {
    transform: translateX(-150%);
}

.products .slider__scrollbar {
	width: 8rem;
	height: 100%;
	margin: 0.85rem 0 0 0.6rem;
	position: relative;
}
.products .slider__scrollbar::before {
	content: '';
	display: block;
	width: 105%;
	height: 0.005rem;
	background-color: #000;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.products .slider__scrollbar::after {
	content: 'SCROLL';
    font-family: "Work Sans", sans-serif;
    font-size: 0.12rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: normal;
    position: absolute;
    left: -0.6rem;
    top: 50%;
    margin-top: -0.06rem;
}
.products .slider__scrollbar .slider__btn {
	width: 0.63rem !important;
	height: 0.63rem !important;
	cursor: grab;
}
.products .slider__scrollbar .slider__btn::before {
	content: '';
	width: 0.63rem !important;
	height: 0.63rem !important;
	background: url("../img/top/scroll.svg") center center no-repeat;
	background-size: 100% auto;
	cursor: grab;
	position: absolute;
	left: 0;
	top: 0;
	transition: 0.4s;
}
.products .btnst1 {
    position: absolute;
    right: 0;
    bottom: -0.05rem;
}
@media (hover: hover) and (min-width:751px) {
.products .products-slider .swiper-slide a:hover picture {
    bottom: 1.06rem;
}    
.products .products-slider .swiper-slide a:hover h4 b::before {
    animation: transformRightLeft 0.3s 0.1s forwards;
}
.products .products-slider .swiper-slide a:hover h4 b::after {
    animation: transformLeftRight 0.3s 0.2s forwards;
}
.products .slider__scrollbar .slider__btn:hover::before {
	transform: scale(1.1);
}
}
@media screen and (max-width:750px){
.products {
    margin-bottom: 0.8rem;
}
.products .slider__scrollbar {
	width: 65vw;
	margin: 0.35rem 0 0 0.6rem;
}
.products .slider__scrollbar::before {
	height: 0.01rem;
}
.products .slider__scrollbar::after {
	content: 'SCROLL';
    font-family: "Work Sans", sans-serif;
    font-size: 0.12rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: normal;
    position: absolute;
    left: -0.6rem;
    top: 50%;
    margin-top: -0.06rem;
}
.products .slider__scrollbar .slider__btn {
	width: 0.45rem !important;
	height: 0.45rem !important;
}
.products .slider__scrollbar .slider__btn::before {
	width: 0.45rem !important;
	height: 0.45rem !important;
}
.products .btnst1 {
    position: static;
    justify-content: flex-end;
    margin-top: 0.1rem;
}
}


/* buyerinfo
------------------------------------------------- */
.buyerinfo {
    padding-top: 0.9rem;
    position: relative;
}
.buyerinfo::after {
    content: '';
    width: 100%;
    height: 8.4rem;
    background-color: #00AA2D;
    border-radius: 0.5rem;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}
.buyerinfo .inner {
    max-width: 12.64rem;
    z-index: 2;
}
.buyerinfo .inner11 {
    z-index: 2;
}
.buyerinfo .headline2 {
    color: #fff;
}
.buyerinfo .headline2 span::after {
    background-color: #fff;
}
.buyerinfo .btn {
    width: 100%;
    height: 1.37rem;
    margin: 0.72rem 0 0.54rem;
}
.buyerinfo .btn a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}
.buyerinfo .btn a::before {
    content: '';
    width: 6.7rem;
    height: 1.89rem;
    background: url("../img/top/buyerinfo_fruit.png") center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: -0.61rem;
    z-index: 2;
    transition: 0.3s;
}
.buyerinfo .btn a::after {
    content: '';
    width: 10.53rem;
    height: 100%;
    background-color: #fff;
    border-radius: 0.2rem;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.buyerinfo .btn a h3 {
    font-size: 0.28rem;
    font-weight: 700;
    line-height: 1.45;
    position: absolute;
    left: 7rem;
    top: 0.43rem;
    z-index: 3;
}
.buyerinfo .btn a h3 span {
    display: block;
    font-size: 0.12rem;
    font-weight: 400;
    line-height: 1.16;
    color: #008138;
}
.buyerinfo .btn a .btnst1 {
    height: 0.75rem;
    line-height: 1;
    padding-right: 0.45rem;
    display: flex;
    align-items: center;
    position: absolute;
    right: 0.43rem;
    top: 0.33rem;
    z-index: 3;
}
.buyerinfo .btn a .btnst1::after {
    content: '';
    width: 0.75rem;
    height: 0.75rem;
    background-color: #D6F1DD;
    border-radius: 50%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    transition: 0.3s;
}
.buyerinfo .btn a .btnst1 img {
    position: relative;
    z-index: 2;
}
.buyerinfo .btn a .btnst1 span {
    display: block;
    width: 0.2rem;
    height: 0.2rem;
    position: absolute;
    right: 0.25rem;
    top: 50%;
    margin-top: -0.1rem;
    overflow: hidden;
    z-index: 2;
}
.buyerinfo .btn a .btnst1 span::before,
.buyerinfo .btn a .btnst1 span::after {
    content: '';
    width: 0.14rem;
    height: 0.12rem;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214.088%22%20height%3D%2212.534%22%20viewBox%3D%220%200%2014.088%2012.534%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_7131%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%207131%22%20transform%3D%22translate(-1139.787%20-885.807)%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_126483%22%20data-name%3D%22%E3%83%91%E3%82%B9%20126483%22%20d%3D%22M1180.3%2C882.36l4.853%2C4.853-4.853%2C4.853%22%20transform%3D%22translate(-32.693%204.861)%22%20fill%3D%22none%22%20stroke%3D%22%2300aa2d%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_68%22%20data-name%3D%22%E7%B7%9A%2068%22%20x2%3D%2211.053%22%20transform%3D%22translate(1140.787%20892.221)%22%20fill%3D%22none%22%20stroke%3D%22%2300aa2d%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -0.06rem;
}
.buyerinfo .btn a .btnst1 span::after {
    transform: translateX(-150%);
}
.buyerinfo .sec .con {
    width: 49%;
    padding: 0.35rem 0.2rem 0.35rem 0.4rem;
    box-sizing: border-box;
    position: relative;
}
.buyerinfo .sec .con::before {
    content: '';
    width: 1.83rem;
    height: 1.82rem;
    background: url("../img/buyerinfo/bg_report.svg") right top no-repeat;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}
.buyerinfo .sec .con.con2::before {
    width: 2.95rem;
    background-image: url("../img/buyerinfo/bg_trivia.svg");
}
.buyerinfo .sec .con::after {
    content: '';
    width: 100%;
    height: 4.7rem;
    background-color: #fff;
    border: 0.005rem solid #00AA2D;
    border-radius: 0.2rem;
    position: absolute;
    left: 0;
    top: 0;
    box-sizing: border-box;
    z-index: 1;
}
.buyerinfo .sec .con h4 {
    font-size: 0.28rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: normal;
    display: flex;
    align-items: center;
    margin-bottom: 0.15rem;
    position: relative;
    z-index: 3;
}
.buyerinfo .sec .con h4 span {
    font-size: 0.12rem;
    font-weight: 400;
    color: #00AA2D;
    margin-right: 0.17rem;
}
.buyerinfo .sec .con .box {
    width: 100%;
    height: 3.18rem;
    overflow-y: auto;
    position: relative;
    z-index: 3;
}
.buyerinfo .sec .con .box::-webkit-scrollbar {
    width: 0.11rem;
    background-color: #FFF;
    border: 0.005rem solid #707070;
    padding: 0.02rem;
    border-radius: 0.06rem;
    box-sizing: border-box;
}
.buyerinfo .sec .con .box::-webkit-scrollbar-thumb {
    --bg-opacity: 1;
    background-color: #747373;
    border-right: 0.02rem solid transparent;
    border-left: 0.02rem solid transparent;
    background-clip: padding-box;
    border-radius: 0.05rem;
}
.buyerinfo .sec .con .box::-webkit-scrollbar-track {
    margin-top: 0.02rem;
    margin-bottom: 0.02rem;
}
.buyerinfo .sec .con .box ul {
    width: 5.4rem;
}
.buyerinfo .sec .con .box ul li {
    width: 100%;
    height: 1rem;
    margin-bottom: 0.09rem;
}
.buyerinfo .sec .con .box ul li:last-child {
    margin-bottom: 0;
}
.buyerinfo .sec .con .box ul li a {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #F5F5F5;
    border-radius: 0.2rem;
    padding: 0.08rem 0.1rem 0.08rem 0.2rem;
    box-sizing: border-box;
}
.buyerinfo .sec .con .box ul li a dl {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.buyerinfo .sec .con .box ul li a dl::after {
    content: '';
    width: 0.005rem;
    height: 100%;
    background-color: #808080;
    position: absolute;
    left: 1.2rem;
    top: 0;
}
.buyerinfo .sec .con .box ul li a dl dt {
    width: 20%;
    text-align: center;
}
.buyerinfo .sec .con .box ul li a dl dt b {
    font-size: 0.11rem;
    font-weight: 400;
    color: #999;
}
.buyerinfo .sec .con .box ul li a dl dt span {
    width: 100%;
    height: 0.19rem;
    background-color: #FFEDCC;
    font-size: 0.12rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0.025rem 0 0.1rem;
}
.buyerinfo .sec .con .box ul li a dl dd {
    width: 74%;
    height: 100%;
    padding-right: 1.4rem;
    box-sizing: border-box;
    position: relative;
}
.buyerinfo .sec .con .box ul li a dl dd h5 {
    font-size: 0.14rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.285;
    margin: 0.08rem 0;
    display: -webkit-box;             
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}
.buyerinfo .sec .con .box ul li a dl dd p {
    font-size: 0.14rem;
    letter-spacing: 0.06em;
    display: -webkit-box;             
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}
.buyerinfo .sec .con .box ul li a dl dd .photo {
    width: 1.24rem;
    height: 0.84rem;
    border-radius: 0.13rem;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
}
.buyerinfo .sec .con .box ul li a dl dd .photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.buyerinfo .sec .con .btnst1 {
    justify-content: flex-end;
    margin: 0.2rem 0.2rem 0 0;
}
.buyerinfo .sec .con .btnst1 a {
    width: 1rem;
    height: 0.2rem;
    padding-right: 0.2rem;
}
.buyerinfo .sec .con .btnst1 a::before {
    content: '';
    width: 0;
    height: 0.02rem;
    background-color: #00AA2D;
    position: absolute;
    left: 0;
    bottom: -0.04rem;
    z-index: 2;
    transition: 0.3s;
}
.buyerinfo .sec .con .btnst1 a::after {
    display: none;
}
.buyerinfo .sec .con .btnst1 a span {
    right: 0;
}
@media (hover: hover) and (min-width:751px) {
.buyerinfo .btn a:hover::before {
    top: -0.7rem;
}
.buyerinfo .btn a:hover .btnst1::after {
    transform: scale(1.2);
}
.buyerinfo .btn a:hover .btnst1 span::before {
    animation: transformRightLeft 0.3s 0.1s forwards;
}
.buyerinfo .btn a:hover .btnst1 span::after {
    animation: transformLeftRight 0.3s 0.2s forwards;
}
.buyerinfo .sec .con .box ul li a:hover {
    background-color: #ddd;
}
.buyerinfo .sec .con .box ul li a:hover dl dd h5,
.buyerinfo .sec .con .box ul li a:hover dl dd p {
    text-decoration: underline;
}
.buyerinfo .sec .con .btnst1 a:hover::before {
    width: calc(100% - 0.2rem);
}
}
@media screen and (max-width:750px){
.buyerinfo {
    padding-top: 0.5rem;
    position: relative;
}
.buyerinfo::after {
    height: 12.8rem;
    border-radius: 0.25rem;
}
.buyerinfo .btn {
    height: 1.55rem;
    margin: 0.7rem 0 0.3rem;
}
.buyerinfo .btn a::before {
    width: 100vw;
    height: 28.2vw;
    left: -4vw;
    top: -0.61rem;
}
.buyerinfo .btn a::after {
    width: 100%;
    height: 100%;
    border-radius: 0.15rem;
}
.buyerinfo .btn a h3 {
    font-size: 0.24rem;
    left: 4vw;
    top: 0.5rem;
}
.buyerinfo .btn a h3 span {
    font-size: 0.12rem;
}
.buyerinfo .btn a .btnst1 {
    right: 0;
    top: 0.85rem;
}
.buyerinfo .btn a .btnst1::after {
    display: none;
}
.buyerinfo .sec .con {
    width: 100%;
    padding: 0.25rem 4vw 0.45rem;
}
.buyerinfo .sec .con::before {
    content: '';
    width: 1.83rem;
    height: 1.82rem;
    background: url("../img/buyerinfo/bg_report.svg") right top no-repeat;
    background-size: 100% auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}
.buyerinfo .sec .con.con2::before {
    width: 2.95rem;
    background-image: url("../img/buyerinfo/bg_trivia.svg");
}
.buyerinfo .sec .con::after {
    width: 100%;
    height: 3.95rem;
    border-radius: 0.15rem;
}
.buyerinfo .sec .con h4 {
    font-size: 0.24rem;
    margin-bottom: 0.18rem;
}
.buyerinfo .sec .con h4 span {
    margin-right: 0.12rem;
}
.buyerinfo .sec .con .box {
    height: 2.8rem;
}
.buyerinfo .sec .con .box ul {
    width: 97%;
}
.buyerinfo .sec .con .box ul li {
    height: 1.31rem;
    margin-bottom: 0.09rem;
}
.buyerinfo .sec .con .box ul li a {
    padding: 0.1rem 0.1rem 0 0.15rem;
}
.buyerinfo .sec .con .box ul li a dl {
    display: block;
}
.buyerinfo .sec .con .box ul li a dl::after {
    display: none;
}
.buyerinfo .sec .con .box ul li a dl dt {
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
}
.buyerinfo .sec .con .box ul li a dl dt b {
    margin-right: 0.15rem;
}
.buyerinfo .sec .con .box ul li a dl dt span {
    width: 1.26rem;
    height: 0.22rem;
    background-color: #FFEDCC;
    border-radius: 0.05rem;
    letter-spacing: 0.08em;
    margin: 0;
}
.buyerinfo .sec .con .box ul li a dl dd {
    width: 100%;
    padding-right: 1.4rem;
}
.buyerinfo .sec .con .box ul li a dl dd h5 {
    margin-top: 0.1rem;
}
.buyerinfo .sec .con .box ul li a dl dd p {
    letter-spacing: normal;
}
.buyerinfo .sec .con .box ul li a dl dd .photo {
    width: 1.24rem;
    height: 0.775rem;
    border-radius: 0.1rem;
}
.buyerinfo .sec .con .btnst1 {
    margin: 0.05rem 0.1rem 0 0;
}
}


/* bgwh
------------------------------------------------- */
.bgwh {
    background-color: #fff;
    padding: 4rem 0 1.6rem;
    margin-top: -2.75rem;
}
@media screen and (max-width:750px){
.bgwh {
    padding: 3.8rem 0 0.75rem;
    margin-top: -2.75rem;
}
}


/* company
------------------------------------------------- */
.company {
    background-color: #F2F2F2;
    border-radius: 0.5rem 0.5rem 0 0;
    padding: 0.97rem 0 1.65rem;
    position: relative;
    z-index: 1;
}
.company ul li {
    width: 30.9%;
    height: 3.3rem;
}
.company ul li a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0.2rem;
    overflow: hidden;
    position: relative;
}
.company ul li a img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s;
}
.company ul li a::before {
    content: '';
    width: 100%;
    height: 100%;
    background: url("../img/company/cover.png") center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    mix-blend-mode: multiply;
    z-index: 1;
}
.company ul li a h4 {
    width: 100%;
    font-size: 0.18rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.08em;
    color: #fff;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: 0.15rem;
    z-index: 2;
}
@media (hover: hover) and (min-width:751px) {
.company ul li a:hover img {
    transform: scale(1.1);
}
}
@media screen and (max-width:750px){
.company {
    border-radius: 0.25rem 0.25rem 0 0;
    padding: 0.5rem 0 0.85rem;
}
.company ul li {
    width: 2.8rem;
    height: 2.8rem;
    margin: 0 auto 0.25rem;
}
}


/* recruit
------------------------------------------------- */
.recruit {
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 0.97rem 0 0.6rem;
    margin-top: -0.5rem;
    position: relative;
    z-index: 2;
}
.recruit .btn {
    width: 100%;
    height: 3.45rem;
}
.recruit .btn a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0.2rem;
    overflow: hidden;
    position: relative;
}
.recruit .btn a::after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #1A1A1A;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.68;
    z-index: 1;
    transition: 0.3s;
}
.recruit .btn a p {
    width: 5.5179rem;
    position: absolute;
    left: 0.56rem;
    top: 2.43rem;
    z-index: 2;
}
.recruit .btn a h4 {
    font-size: 0.18rem;
    font-weight: 700;
    line-height: 1.45;
    color: #fff;
    position: absolute;
    left: 0.56rem;
    top: 1.73rem;
    z-index: 2;
}
.recruit .btn a h4 span {
    display: block;
    font-size: 0.12rem;
    font-weight: 400;
    line-height: 1.166;
    letter-spacing: normal;
    margin-bottom: 0.09rem;
}
.recruit .btn a picture {
    position: absolute;
    left: 0;
    top: 0;
    transition: 0.3s;
}
.recruit .btn a picture img {
    display: block;
}
@media (hover: hover) and (min-width:751px) {
.recruit .btn a:hover::after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #1A1A1A;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.48;
    z-index: 1;
    transition: 0.3s;
}
.recruit .btn a:hover picture {
    transform: scale(1.08);
}
}
@media screen and (max-width:750px){
.recruit {
    border-radius: 0.25rem;
    padding: 0.5rem 0 0.3rem;
}
.recruit .btn {
    height: 2rem;
}
.recruit .btn a {
    border-radius: 0.2rem;
}
.recruit .btn a::after {
    opacity: 0.58;
}
.recruit .btn a p {
    width: 85%;
    left: 0.2rem;
    top: auto;
    bottom: 0.2rem;
}
.recruit .btn a h4 {
    font-size: 0.16rem;
    left: 0.2rem;
    top: 1rem;
}
.recruit .btn a h4 span {
    display: none;
}
}


/* link
------------------------------------------------- */
.link {
    background-color: #F2F2F2;
    border-radius: 0 0 0.5rem 0.5rem;
    padding: 1.45rem 0 0.65rem;
    margin-top: -0.5rem;
    position: relative;
    z-index: 1;
}
.link ul li {
    width: 1.77rem;
}
.link ul li:nth-child(2) {
    width: 1.42rem;
    margin: 0 0.69rem 0 0.43rem;
}
.link ul li:nth-child(3) {
    width: 1.3107rem;
    margin-right: 0.65rem;
}
.link ul li:nth-child(4) {
    width: 2.1rem;
    mix-blend-mode: multiply;
}
.link ul li a img {
    display: block;
    transition: 0.3s;
}
.link .btnst1 {
    justify-content: center;
    margin-top: 0.1rem;
}
@media (hover: hover) and (min-width:751px) {
.link ul li a:hover img {
    transform: translateY(-0.15rem);
}
}
@media screen and (max-width:750px){
.link {
    border-radius: 0 0 0.25rem 0.25rem;
    padding: 1.2rem 0 0.4rem;
}
.link .headline4 {
    margin-bottom: 0.25rem;
}
.link ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.link ul li {
    width: 1.416rem;
    margin-bottom: 0.1rem;
}
.link ul li:nth-child(2) {
    width: 1.13rem;
    margin: 0 0.1rem 0 0.15rem;
}
.link ul li:nth-child(3) {
    width: 1.04856rem;
    margin-right: 0.3rem;
}
.link ul li:nth-child(4) {
    width: 1.68rem;
}
.link .btnst1 {
    margin-top: 0.1rem;
}
}


