/*=================================================================
                              Custom
=================================================================*/
:root {
  --color1: #577f43;

  --c-spacing: 8px;
}
.swiper_banner_img {
  margin-bottom: 0;
}


/*==================================
                LOGO
====================================*/
.header_logo {
  margin-inline-start: -3rem;
  @media (min-width: 480px) {
    margin-inline-start: 0;
  }
  .img-fluid {
    inline-size: 26rem;
    @media (min-width: 1200px) {
      inline-size: 37rem;
    }    
  }
}

/*==================================
                Title
====================================*/
.main_title ._en {
  font-size: clamp(2.4rem, 0.13vw + 2.36rem, 2.6rem);
  font-weight: 700;
}

/*==================================
                 Footer
====================================*/
.footer_end {
  column-gap: 16px;
  flex-wrap: wrap;
  font-size: clamp(1.6rem, 0.13vw + 1.56rem, 1.8rem);
  font-weight: 700;
  & :where(a,p,span,li) {
    color: #bbb;
  }
  .footer-logo {
    inline-size: 90%;
    aspect-ratio: 30/7;
    @media (min-width: 480px) {
      inline-size: 40%;
    }
    @media (min-width: 1280px) {
      inline-size: 30%;
    }
  }
}

/*==================================
                Intro
====================================*/
.sec-intro {
  position: relative;
  padding-block: calc(5 * var(--c-spacing));
  overflow: clip;
  &:after {
    @media (min-width: 1280px) {
      opacity: .2;
      pointer-events: none;
      content: '';
      position: absolute;
      inset-block-start: -45%;
      inset-inline-end: -35%;
      inline-size: 80rem;
      block-size: 60rem;
      aspect-ratio: 4/3;
      background: url(../images/bg-intro.svg) no-repeat center;
      background-size: contain;      
    }
    @media (min-width: 1536px) {
      inline-size: 100rem;
      block-size: 75rem;      
    }
  }
  .intro-title {
    margin-block-end: calc(2 * var(--c-spacing));
    padding-block-end: calc(2 * var(--c-spacing));
    color: var(--color1);
    font-size: clamp(3rem, 0.13vw + 2.96rem, 3.2rem);
    font-weight: 700;
    border-block-end: 1px solid var(--color1);
  }
  .intro-desc {
    font-size: clamp(1.8rem, 0.25vw + 1.72rem, 2.2rem);
    line-height: 1.75;
  }
}

/*==================================
                Shop
====================================*/
.page_content {
  .shop_list {
    .shop_link {
      inline-size: 100%;
    }
    .shop_item {
      text-align: center;
    }
    .shop_name {
      align-content: center;
      min-block-size: 8rem;
      background-color: transparent;
      font-size: clamp(2rem, 0vw + 2rem, 2rem);
      font-weight: 700;
      border: 0;
      border-block-start: 1px solid;
      border-radius: 0;
    }    
  }
}