@charset "UTF-8";

:root {
  font-family: "Noto Sans JP", sans-serif;
  -webkit-text-size-adjust: 100%;
  line-height: 1.8;
  --green: #46C38C;
  --lightgreen: #ECF9F3;
  --copyrightgreen: #C7EDDC;
}

a {
  color: #000;
}
.h-opa {transition: opacity .3s;}
.h-opa:hover {opacity: .7;}
.roboto {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
}
.serif {font-family: "Noto Serif JP", serif;}
.palt {
  font-feature-settings: "palt";
}

@media only screen and (max-width: 767px) {
  :root {
    /* font-size: 0.3125vw; dev-width: 320px */
    font-size: 0.25641vw; /* dev-width: 390px */
    font-size: 0.25vw; /* dev-width: 400px */
    --site-main-header: 250rem;
  }

  .site-header,
  .site-main,
  .site-footer {
    font-size: 16rem;
  }
}

@media print,
(min-width: 768px) {
  :root {
    font-size: 1px;
    --site-main-header: 460rem;
  }

  .site-header,
  .site-main,
  .site-footer {
    font-size: 16rem;
  }
  
  a[href^="tel:"] {
    pointer-events: none;
  }
}

@media (min-width: 1600px) {
  :root {
    font-size: 0.0625vw;
  }
}


/* --HEADER-- */
@media all {
  .site-header {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, .08);
    font-feature-settings: "palt";
    transition: top .5s;
  }

  .site-header-logo {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }

  .site-header-logo a {
    display: block;
  }

  .site-header-nav-item {
    display: flex;
    align-items: center;
  }
  .site-header-nav-item.contact a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: var(--green);
    font-weight: bold;
    color: #fff;
  }
  .site-header-nav-item.contact a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    background: center right / contain no-repeat url(../img/common/mail-w.svg);
  }
  .site-header-nav-item.tel a {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
  }
  .site-header-nav-item.tel a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    background: center left / contain no-repeat url(../img/common/phone-g.svg);
  }

  /* sp&tab */
  @media only screen and (max-width: 1180px) {

    body.nav-active {
      overflow: hidden;
    }

    .site-header {
      transition: background-color .5s, top .5s;
    }


    .site-header-nav {
      overflow-y: auto;
      position: fixed;
      left: 105vw;
      width: 100vw;
      background-color: #fff;
      transition: left .5s;
      z-index: 999;
      max-height: calc(100vh - 70rem);
      font-size: 15rem;
    }

    .nav-active .site-header-nav {
      left: 0;
    }

    .site-header-nav-list {
      padding: 0;
    }

    .site-header-nav-item {
      justify-content: center;
      padding: .75rem 0;
      border-top: 1rem solid var(--green);
      line-height: 1;
    }
    
    .site-header-nav-item > a {
      padding: .75em 0;
      display: inline-block;
    }
    
    .site-header-nav-item.contact {background-color: var(--green);}
    .site-header-nav-item.tel {
      flex-direction: column;
    }
    .site-header-nav-item.tel a {
      width: auto;
      height: 1.8em;
      padding: 0 0 0 38rem;
    }
    .nav-tel-notice {margin-top: -.5em;}
    .nav-tel-notice-item {
      display: inline-block;
    }
  }

  /* sp */
  @media only screen and (max-width: 767px) {
    .site-header {
      height: 60rem;
    }

    .site-header.close {
      top: -63rem;
    }

    body.header-close .site-header {
      top: -60rem;
    }

    .site-header-logo {
      top: 2rem;
      left: 15rem;
      width: 240rem;
    }

    .site-header-nav {
      top: 60rem;
      padding-bottom: 20rem;
    }

    .site-header-nav-list {
      padding-top: 14rem;
    }


    .site-header-nav-item {
      padding: 10rem 0;
    }

    .site-header-nav-item.tel {font-size: 13rem;}
    .site-header-nav-item.tel a {
      font-size: 30rem;
    }
    .site-header-nav-item.stores img {width: 13rem;}
    .site-header-nav-item.tel a::before {
      left: 7rem;
      width: 24rem;
    }
  }

  /* tab & pc */
  @media (min-width: 768px) {
    .site-header {
      height: 110rem;
    }

    .site-header.close {
      top: -113rem;
    }

    .site-header-logo {
      top: 0;
      left: 25rem;
      width: 521rem;
    }

    .site-header-nav-item.contact a{
      padding-left: 50rem;
      font-size: 18rem;
    }
    .site-header-nav-item.contact a::before {
      top: 1rem;
      left: 37rem;
      width: 37rem;
    }
    .site-header-nav-item.stores img {width: 15rem;}
    .site-header-nav-item.tel {
      order: 1;
      position: relative;
      width: 100%;
      font-size: 15rem;
      font-weight: 500;
      line-height: 18rem;
    }
    .site-header-nav-item.tel a {
      padding-left: 44rem;
      width: 320rem;
      font-size: 40rem;
      font-weight: bold;
    }
    .site-header-nav-item.tel a::before {
      width: 28rem;
      background-position-y: 52%;
    }
  }

  /* tab */
  @media screen and (min-width: 768px) and (max-width: 1180px) {
    .site-header {height: 80rem;}
    .site-header-logo {width: 380rem;}
    .site-header-nav {
      width: 360rem;
      padding-bottom: 20rem;
      text-align: center;
      border-bottom-left-radius: 20rem
    }

    .site-header-nav-item {
      padding: 10rem 0;
    }

    .nav-active .site-header-nav {
      left: calc(100vw - 360rem);
    }

    .site-header-nav-item.contact a::before {
      left: 105rem;
    }
    .nav-tel-notice {margin-top: -.75em;}

  }

  /* pc */
  @media print,
  (min-width: 1181px) {

    .site-header-nav {
      position: absolute;
      top: 0;
      right: 0;
      width: 600rem;
      height: 100%;
    }

    .site-header-nav-list {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      height: 100%;
    }

    .site-header-nav-item {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      height: 50%;
    }

    .site-header-nav-item.vegetables {
      order: 2;
      width: 80rem;
    }
    
    .site-header-nav-item.overview {
      order: 3;
      width: 70rem;
    }
    .site-header-nav-item.stores {
      order: 4;
      width: 140rem;
      white-space: nowrap;
      line-height: 1;
    }

    .site-header-nav-item.contact {
      order: 5;
      width: 230rem;
    }
    .site-header-nav-item.tel::after {
      content: '';
      position: absolute;
      bottom: -1rem;
      left: 0;
      width: 370rem;
      height: 1rem;
      background-color: var(--green);
    }
  }

}

/* --BURGER-- */
@media all {
  /* sp & tab */
  @media only screen and (max-width: 1180px) {

    .menu-trigger,
    .menu-trigger span {
      width: 30rem;
    }


    .menu-trigger {
      position: absolute;
      top: 22rem;
      right: 10rem;
      height: 27rem;
      visibility: visible;
      opacity: 1;
      cursor: pointer;
    }

    .menu-trigger span {
      position: absolute;
      left: 0;
      display: block;
      box-sizing: border-box;
      height: 3px;
      line-height: 0;
      background-color: #ACA69E;
      transition: transform .4s, top .2s, left .4s, opacity .4s;
    }

    .menu-trigger span:nth-of-type(1) {
      top: 0;
    }

    .menu-trigger span:nth-of-type(2) {
      top: calc(50% - 2px);
    }

    .menu-trigger span:nth-of-type(3) {
      top: calc(100% - 3px);
    }

    .nav-active .menu-trigger span:nth-of-type(1) {
      top: calc(50% - 2px);
      transform: rotate(-220deg) scaleX(1.25);
      /* transform: translateY(12rem) rotate(-220deg) scaleX(1.25); */
    }

    .nav-active .menu-trigger span:nth-of-type(2) {
      opacity: 0;
      left: 20rem;
    }

    .nav-active .menu-trigger span:nth-of-type(3) {
      top: calc(50% - 2px);
      transform: rotate(220deg) scaleX(1.25);
      /* transform: translateY(-12.5rem) rotate(220deg) scaleX(1.25); */
    }

    .nav-active .menu-trigger {
      visibility: visible !important;
      opacity: 1 !important;
    }

    .menu-trigger.hidden {
      visibility: hidden;
      opacity: 0;
      transition: .5s;
    }

    .menu-bg,
    .bg-trigger {
      display: block;
      position: absolute;
      top: 60rem;
      left: 0;
      width: 100%;
      height: calc(100vh - 60rem);
      visibility: hidden;
    }

    .menu-bg {
      background: rgba(0, 0, 0, .75);
      opacity: 0;
      transition: .5s;
    }

    .nav-active .menu-bg {
      opacity: 1;
      visibility: visible;
    }

    .bg-trigger {
      cursor: pointer;
    }

    .nav-active .bg-trigger {
      visibility: visible;
    }
  }

  /* sp */
  @media only screen and (max-width: 767px) {
    .bg-trigger {
      top: 60rem;
      height: calc(100vh - 60rem);
    }
  }

  /* tab */
  @media only screen and (min-width: 768px) and (max-width: 1180px) {

    .menu-trigger,
    .menu-trigger span {
      width: 40rem;
    }

    .menu-trigger {
      top: 24rem;
      right: 33rem;
      width: 40rem;
      height: 32rem;
    }

    .menu-trigger span {
      height: 4rem;
      border-radius: 2rem;
    }

    .menu-bg,
    .bg-trigger,
    .site-header-nav {
      top: 80rem;
    }
  }

  /* pc */
  @media print,
  (min-width: 1181px) {

    .menu-trigger,
    .menu-bg,
    .bg-trigger {
      display: none;
    }
  }
}


/* breadcrumbs */
@media all {

  .breadcrumbs {
    position: relative;
  }

  .breadcrumbs-list {
    display: flex;
    align-items: center;
  }

  .breadcrumbs-item {
    flex-shrink: 0;
  }

  .breadcrumbs-item:last-child {
    flex-shrink: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .breadcrumbs-item+.breadcrumbs-item::before {
    content: '＞';
    display: inline-block;
    width: 1.25em;
    text-align: center;
  }



  /* sp */
  @media only screen and (max-width: 767px) {
    .breadcrumbs-list {
      padding: 10rem 20rem;
      font-size: 11rem;
    }
  }

  /* pc & tab */
  @media print,
  (min-width: 768px) {
    .breadcrumbs-list {
      margin: 0 auto;
      padding: 0 20rem;
      max-width: 1040rem;
      font-size: 12rem;
    }
  }
}


/* site-main */
@media all {
  .site-main {
    overflow: hidden;
    overflow: clip;
    width: 100%;
  }

  .main-section {
    position: relative;
  }

  .section-ttl {
    font-family: "Noto Serif JP", serif;
    font-weight: normal;
  }

  /* --MAIN-- sp */
  @media only screen and (max-width:768px) {
    .section-ttl {
      font-size: 28rem;
      line-height: 1.54;
    }
  }

  /* tab & pc */
  @media (min-width:768px) {
    .section-ttl {
      font-size: 34rem;
      line-height: 1.62;
    }
  }

  /* pc */
  @media screen and (min-width:1025px) {}

  /* tab */
  @media screen and (min-width: 768px) and (max-width: 1024px) {}
}

/* --FOOTER-- */
@media all {
  .footer-img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .site-footer {
    position: relative;
    background-color: var(--green);
    color: #fff;
  }

  .footer-address {display: block;}

  .footer-contact-txt {font-weight: bold;}

  .footer-contact-tel {
    position: relative;
    display: flex;
    align-items: flex-end;
    margin-top: 10rem;
    width: 100%;
    font-size: 15rem;
    font-weight: 500;
  }
  .footer-contact-tel a {
    position: relative;
    display: flex;
    align-items: center;
    color: #fff;
    line-height: 1;
    padding-left: 44rem;
    width: 320rem;
    font-size: 40rem;
    font-weight: bold;
  }
  .footer-contact-tel a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    background: center left / contain no-repeat url(../img/common/phone-w.svg);
    width: 28rem;
    height: 44rem;
    background-position-y: 52%;
  }
  .footer-contact-tel-notice-item {display: inline-block;}


  .footer-contact-form {
    position: relative;
    margin-top: 16rem;
    padding-left: 44rem;
    width: 450rem;
  }
  .footer-contact-form::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    background: center right / contain no-repeat url(../img/common/mail-w.svg);
    width: 36rem;
  }
  .footer-contact-form a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: #fff;
    font-weight: bold;
    color: var(--green);
    border-radius: 3rem;
    font-size: 26rem;
    padding-right: 16rem;
  }
  .footer-contact-form a::after {
    content: '';
    position: absolute;
    display: block;
    height: 100%;
    background: center right / contain no-repeat url(../img/common/arrow-g.svg);
    top: 0;
    right: 8rem;
    width: 17rem;
  }

  .footer-bottom-outer {
    background-color: var(--copyrightgreen);
  }
  .footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
    color: var(--green);
    line-height: 1;
  }
  .footer-bottom a {color: var(--green);}

  /* sp */
  @media only screen and (max-width: 767px) {
    .footer-img {height: 160rem;}
    .footer-1 {
      margin: 50rem auto 0;
      width: 360rem;
    }
    .footer-address {
      margin-top: 4rem;
      font-size: 14rem;
    }
    .footer-2 {
      position: relative;
      margin-top: 25rem;
      padding: 25rem 20rem 0;
    }
    .footer-2::before {
      content: '';
      position: absolute;
      top: 0;
      left: calc(50% - 50rem);
      display: block;
      width: 100rem;
      height: 1px;
      border-top: max(1px, 1rem) solid #fff;
    }
    .footer-contact-txt {
      font-size: 15rem;
      font-weight: 500;
      line-height: 1.6;
      font-feature-settings: "palt";
      text-align: center;
    }

    .footer-contact-tel {
      flex-wrap: wrap;
      margin: 16rem auto 0;
      width: 320rem;
    }
    .footer-contact-tel-notice {
      padding-left: 50rem;
    }

    .footer-contact-form {
      margin: 16rem auto 0;
      width: 340rem;
    }
    .footer-contact-form a {
      padding: 8rem;
      line-height: 1.25;
      font-feature-settings: "palt";
      text-align: justify;
    }
    .footer-contact-form a::after {
      top: 1.25em;
      left: 3.125em;
      height: 2em;
    }
    .footer-bottom {
      margin-top: 40rem;
      padding: 10rem 10rem 10rem;
      font-size: 11rem;
    }
  }

  /* tab & pc */
  @media print,
  (min-width: 768px) {
    .footer-img {height: 294rem;}
    .site-footer-inner {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      margin: 0 auto;
      padding: 0 0 24rem;
      max-width: 1135rem;
    }
    .footer-1 {
      margin-top: 40rem;
      padding: 0 20rem;
      width: 419rem;
    }
    .footer-address {
      margin-top: 4rem;
    }

    .footer-2 {
      margin-top: 30rem;
      padding: 0 20rem;
    }

    .footer-bottom {
      margin-top: 40rem;
      padding: 10rem 20rem 14rem;
      max-width: 1135rem;
    }
    .copyright {font-size: 12rem;}
  }

  /* tab */
  @media screen and (min-width: 768px) and (max-width: 1024px) {
    .site-footer-inner {
      justify-content: space-evenly;
    }
  }

}




/* 印刷用 */
@media print {
  body {
    width: 100%;
  }

  .site-header {
    position: absolute;
  }

  .site-header-nav,
  .to-top {
    display: none !important;
  }

}


/* --TO TOP-- */
@media all {
  .to-top {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 3.4375em;
    height: 3.4375em;
    border-radius: 50%;
    /* box-shadow: 0 0 4px 2px var(--bg0); */
    font-size: 12px;
    overflow: hidden;
  }

  .to-top a {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--btn-bg);
  }

  .to-top a::after {
    content: '';
    position: absolute;
    top: 42.5%;
    left: 35%;
    width: 25%;
    height: 25%;
    border: 1px solid #fff;
    border-left: none;
    border-bottom: none;
    transform: translateY(0) rotate(-45deg);
    transition: .3s;
  }

  .to-top a:hover::after {
    transform: translateY(-30%) rotate(-45deg);
  }

  @media only screen and (max-width: 767px) {
    .to-top {
      font-size: var(--sp-vw-12px);
    }
  }
  
  @media (min-width: 1025px) {
    .to-top a {
      font-size: 12.8px;
    }
  }
}

/* inview */
@media not print {
  .elemFadeIn {
    opacity: 0;
    filter: blur(10rem);
    /* transform: translateY(30rem); */
    transition: 1s opacity, 1s filter, 1s transform;
  }

  .elemFadeIn.animated {
    opacity: 1;
    filter: blur(0);
    /* transform: translateY(0rem); */
  }

  .elemUpperIn {
    transform: translateY(60rem);
    transition: transform .4s cubic-bezier(0.42, 0, 0.47, 2.5);
  }

  .elemUpperIn.animated {
    transform: translateY(0);
  }

  .elemPolygonIn-LR {
    clip-path: polygon(0 100%, 0 100%, 0 100%);
    transition: clip-path 1.5s ease-out;
  }

  .elemPolygonIn-LR .elemPolygonIn-fadeIn {
    opacity: 0;
    transition: opacity 1s;
    transition-delay: 1s;
  }

  .elemPolygonIn-LR.animated {
    clip-path: polygon(0 -100%, 0 100%, 200% 100%);
  }

  .elemPolygonIn-LR.animated .elemPolygonIn-fadeIn {
    opacity: 1;
  }

  .elemPolygonIn-RL {
    clip-path: polygon(100% 100%, 100% 100%, 100% 100%);
    transition: clip-path 1.5s ease-out;
  }

  .elemPolygonIn-RL .elemPolygonIn-fadeIn {
    opacity: 0;
    transition: opacity 1s;
    transition-delay: 1s;
  }

  .elemPolygonIn-RL.animated {
    /* clip-path: polygon(0 0, 100% 200%, 100% -100%); */
    clip-path: polygon(-100% 100%, 100% -100%, 100% 100%);
  }

  .elemPolygonIn-RL.animated .elemPolygonIn-fadeIn {
    opacity: 1;
  }

  .smoothText {
    display: block;
    overflow: hidden;
  }

  .smoothTextTrigger {
    display: block;
    transition: .8s cubic-bezier(0.42, 0, 0.47, 1.41);
    transform: translate3d(0, 100%, 0) skewY(12deg);
    transform-origin: left;
  }

  .elemPolygonIn-RL .smoothTextTrigger,
  .elemPolygonIn-LR .smoothTextTrigger {
    transition-delay: .25s;
    transition-property: transform;
  }

  .animated .smoothTextTrigger {
    transform: translate3d(0, 0, 0) skewY(0);
  }

  .elemPopIn {
    opacity: 0;
    transform: scale(0);
    transition: transform .3s cubic-bezier(0.42, 0, 0.47, 1.5), opacity .4s, filter .4s;
  }

  .animated.elemPopIn {
    opacity: 1;
    transform: scale(1);
  }

  .elemToggleUp-Obj {
    position: absolute;
    bottom: 0;
    display: none;
  }
}

/* pagination */
@media all {
	ul.page-numbers {
		display: flex;
		justify-content: center;
	}
	ul.page-numbers li > * {
		display: block;
		padding: 0 1em;
	}
  li .page-numbers {
    position: relative;
    display: inline-block;
    line-height: 1;
  }
  li a.page-numbers:not(.next):not(.prev) {color: #aaa;}
  li a.page-numbers:hover {color: #000!important;}
  li span.page-numbers.current {
    color: #000;
  }
  li span.page-numbers.current::after,
  li a.page-numbers:hover::after {
    content: '';
    position: absolute;
    top: 150%;
    left: calc(50% - .2em);
    display: block;
    width: .4em;
    height: .4em;
    background-color: var(--green);
    border-radius: 50%;
  }
  @media only screen and (max-width: 767px) {
    .page-nav {margin-top: 40rem;}
    ul.page-numbers {
      padding: 0 10rem 40rem;
    }
  }
  /* tab & pc */
  @media print,
  (min-width: 768px) {
    .page-nav {margin-top: 100rem;}
    ul.page-numbers {
      padding: 0 20rem 100rem;
      font-size: 25rem;
    }
  }
}

/* --Util--*/
@media all {
  .ilb {display: inline-block;}
  /* --Util-- sp */
  @media only screen and (max-width: 767px) {
    .spNone {
      display: none !important;
    }
  }

  /* --Util-- tab & sp */
  @media only screen and (max-width: 1024px) {
    .pcOnly {
      display: none !important;
    }
  }

  /* --Util-- tab & pc */
  @media print,
  (min-width: 768px) {
    .spOnly {
      display: none !important;
    }
  }

  /* --Util-- pc */
  @media print,
  (min-width: 1025px) {
    .pcNone {
      display: none !important;
    }
  }
}

/* the_content() */
@media all {
  .the_content ul li {
    margin-left: 1.5em;
    list-style-type: disc;
  }

  .the_content ol li {
    margin-left: 1.5em;
    list-style-type: decimal;
  }

  /* .the_content *+* {
    margin-top: 1em;
  } */

  .the_content li+li {
    margin-top: 0;
  }

  @media only screen and (max-width: 767px) {
    .the_content {
      font-size: 14rem;
    }

    .the_content img {
      width: 100%;
    }
  }

  @media print,
  (min-width: 768px) {
    .the_content {
      font-size: 15rem;
    }

    .the_content::after {
      content: '';
      display: block;
      clear: both;
    }
  }
}








/* template-section */
@media all {
	/* sp */
	@media only screen and (max-width: 767px) {}

	/* pc & tab */
	@media print,
	(min-width: 768px) {}
}