@import url('https://fonts.googleapis.com/css?family=Noto+Sans:ital,wght@0,400,700;1,400,700&family=BIZ+UDGothic:wght@400;700display=swap');

:root {
  --gap-col3:40px;
  --gap-col4:30px;
  --gap-col5:25px;
  --gap-col6:20px;
  --h1:36px;
  --h2:30px;
  --h3:27px;
  --h4:24px;
  --h5:20px;
  --text:18.5px;
  --s-text:16px;
  --ss-text:14px;
  --bread:13px;
  --new-green:#2E8208;
  --q-bg:#E3F0DD;
  --pale-bg:#fbf7ef;
  --border:solid 1px #c9c9c9;
}
@media (max-width:768px){
  :root {
    /*仮*/
    --h1:24px;
    --h2:20px;
    --h3:18px;
    --h4:16px;
    --h5:15px;
    --text:15px;
    --s-text:13px;
    --ss-text:13px;
    --bread:12px;    
  }
}

* {
  box-sizing: border-box;
  }

body{font-family:"Noto Sans","BIZ UDGothic",sans-serif}

/* 視覚非表示（スクリーンリーダー用） */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

/*------- title + パンくず共通 -------*/
.page .wrapper{background:#fff;}

.page-title{
    width: 100%;
    background:var(--pale-bg)
}
.page-title-inner{
    max-width: 1480px;
    margin: 0 auto;
    padding: 35px 40px 35px;
    box-sizing: border-box;
}

.page-title .bread_crumble_block, .page_path{padding:0;}
.page-title-inner h1,
.page-title-inner h2{ font-weight: 700;}

/*ページタイトル*/
.page-title-inner .title-text{
  font-size: var(--h1);
  line-height: 130%;
  text-align: center;
  color: #444;
  padding:40px 0 30px;
}
.title-lead{font-size:var(--text); text-align:center; font-weight:700;}

/*検索タイトル*/
.result-text{
  font-size: var(--h1);
  line-height: 130%;
  text-align: center;
  padding:30px 0 0;
}
.result-text span{
  font-size:var(--h3); 
  text-align: center;
  padding:0 10px;
}
.result-num{
  font-size:var(--h3);
  text-align: center;
}

/* section-title */
.section-title{
  font-size:var(--h2);
  font-weight:700;
  text-align:center;
  margin-bottom:50px;
}
.section-stitle{
  font-size:var(--h3);
  font-weight:700;
  text-align:center;
  margin-bottom:50px;
}

.key-color{color:var(--new-green)}
.pale-bg{background:var(--pale-bg)}

@media (max-width:768px){
  .page-title-inner{
      max-width: 1480px;
      margin: 0 auto;
      padding: 25px 20px 30px;
      box-sizing: border-box;
  }
  .page-title-inner .title-text{
    font-size: var(--h1);
    padding:30px 0 15px;
  }

  /* section-title */
  .section-title{
    font-size:var(--h2);
    margin-bottom:30px;
  }
  .section-stitle{
    font-size:var(--h3);
    margin-bottom:50px;
  }

  .result-text{
    font-size: var(--h1);
    padding:20px 0 0;
  }
  .result-text b{display:inline-block;}
  .result-text span{
    font-size:var(--h3); 
    text-align: center;
    padding:0;
    display:inline-block;
  }
  .result-num{
    font-size:var(--h3);
    font-weight: 700;
    text-align: center;
  }
}

/*------ 検索エリア ------*/

.search-section {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-bottom: 3rem;
}

.search-form {
  flex: 1;
  display: flex;
  gap: 20px;
  align-items: center;
  margin:30px auto 20px;
  max-width:1300px;
}

.search-input-wrapper {
  flex: 1;
  position: relative;
}

.search-label{
  color:var(--new-green);
  font-size:var(--text);
  font-weight: 700;
}
.search-input-wrapper input {
  width: 100%;
  padding: 20px 35px 20px 50px;
  border: 2px solid var(--new-green);
  border-radius: 999px;
  font-size:var(--text);
  height:60px;
  position:relative;
  background:url(/assets/images/_resource/pages/products/products/icon-search.svg) #fff no-repeat; background-size: 20px 20px; background-position:20px center;
}

.search-input-wrapper input:focus {
  outline: 3px solid #000;
  outline-offset: 2px;
  background-image:url(/assets/images/_resource/pages/products/products/icon-search.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position:20px center;  
}

.search-button {
  background: var(--new-green);
  color: #fff;
  border: none;
  padding: 20px 35px;
  border-radius: 999px;
  font-size:var(--text);
  display: flex;
  align-items: center;
  font-weight: 700;
  cursor: pointer;
  height:60px;
  transition:all .4s;
}

.search-button:hover,
.search-button:focus {
  opacity:.8;
}

.search-button:focus {
  outline: 3px solid #000;
  outline-offset: 2px;
}

@media (max-width:768px){
  .search-form {
    flex-wrap:wrap;
    gap:10px;
  }

  .search-label{
    color:var(--new-green);
    width:100%;
    text-align:center;
  }
  .search-input-wrapper input {
    width: 100%;
    padding: 16px 24px 16px 50px;
    border: 2px solid var(--new-green);
    border-radius: 999px;
    height:48px;
  }

  .search-input-wrapper input:focus {
    outline: 3px solid #000;
    outline-offset: 2px;
  }

  .search-button {
    background: var(--new-green);
    color: #fff;
    border: none;
    padding: 16px 24px;
    border-radius: 999px;
    font-size:var(--text);
    font-weight: 700;
    cursor: pointer;
    height:48px;
    transition:all .4s;
  }
}

@media (max-width:576px){
  .search-form {
    flex-wrap:wrap;
    flex-direction: column;
    gap:16px;
  }
  .search-input-wrapper{width:100%}
  .search-input-wrapper input{width:100%;}
  .search-button {
    padding: 13px 40px;
    height:40px;
  }
}

/*footer*/
footer{margin-top:0;}

/*inner //仮調整中 */
.inner{width:100%;}
.inner.narrow-column{width:86%;}

@media (max-width:960px){
  .inner.narrow-column{width:93%;}
}
@media (max-width:768px){
  .inner.narrow-column{width:95%;}
}

/*------- 商品一覧 -------*/
.products-list{display:flex; gap:var(--gap-col4); flex-wrap: wrap;}
.products-list .products-item {
    flex-basis: calc((100% - var(--gap-col4) * 3) / 4);
    width: calc((100% - var(--gap-col4) * 3) / 4);
}

.products-list.col3{display:flex; gap:var(--gap-col3); flex-wrap: wrap;}
.products-list.col3 .products-item {
    flex-basis: calc((100% - var(--gap-col3) * 2) / 3);
    width: calc((100% - var(--gap-col3) * 2) / 3);
}
.products-list.col3.border .products-item-img{min-height:200px;}

.products-list.col5{display:flex; gap:var(--gap-col5); flex-wrap: wrap;}
.products-list.col5 .products-item {
    flex-basis: calc((100% - var(--gap-col5) * 4) / 5);
    width: calc((100% - var(--gap-col5) * 4) / 5);
}

.products-list.col6{display:flex; gap:var(--gap-col6); flex-wrap: wrap;}
.products-list.col6 .products-item {
    flex-basis: calc((100% - var(--gap-col6) * 5) / 6);
    width: calc((100% - var(--gap-col6) * 5) / 6);
}

.products-list.border .products-item-img{background: #fff;  border-radius:20px; padding:20px; border:var(--border); display: flex; justify-content: center;}
.products-list.border .products-item-img.no-space{padding:0; border:none;}
.products-list.border .products-item-img img{ border-radius:20px; }
.products-list.border .products-item-img.no-space img{border:var(--border);}
.products-item-link{text-decoration: none; display: block;}
.products-item-caption{
    font-style: normal;
    font-weight: 700;
    font-size: var(--text);
    line-height: 130%;
    color: #444;
    margin: 17px 0 0;
    font-feature-settings: "palt";
    letter-spacing:-0.02em;
    display: flex;
    align-items: center;
    justify-self: center;
}
.products_side_space{padding:0 40px}

@media (max-width:960px){
  .products-list{display:flex; gap:var(--gap-col3); flex-wrap: wrap;}
  .products-list .products-item {
      flex-basis: calc((100% - var(--gap-col3) * 2) / 3);
      width: calc((100% - var(--gap-col3) * 2) / 3);
  }

  .products-list.col3{display:flex; gap:var(--gap-col3); flex-wrap: wrap;}
  .products-list.col3 .products-item {
      flex-basis: calc((100% - var(--gap-col3) * 1) / 2);
      width: calc((100% - var(--gap-col3) * 1) / 2);
  }
  .products-list.col3.border .products-item-img{min-height:200px;}

  .products-list.col5,
  .products-list.col6{display:flex; gap:var(--gap-col3); flex-wrap: wrap;}
  .products-list.col5 .products-item,
  .products-list.col6 .products-item {
      flex-basis: calc((100% - var(--gap-col3) * 2) / 3);
      width: calc((100% - var(--gap-col3) * 2) / 3);
  }
  .products-list.border .products-item-img{padding:12px;}
}

@media (max-width:768px){
  .products-list,
  .products-list.col3,
  .products-list.col5,
  .products-list.col6{display:flex; gap:var(--gap-col5); flex-wrap: wrap;}
  .products-list .products-item,
  .products-list.col3 .products-item,
  .products-list.col5 .products-item,
  .products-list.col6 .products-item{
      flex-basis: calc((100% - var(--gap-col5) * 1) / 2);
      width: calc((100% - var(--gap-col5) * 1) / 2);
  }
  .products-list.border .products-item-img{padding:8px;}
  .products-list.col3.border .products-item-img{min-height:auto;}
  .products_side_space{padding:0 25px}
}
@media (max-width:576px){
  .products-list.border .products-item-img{padding:6px;}
}

.pagination {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

.pagination__list {
  display: flex;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
  align-items: center;
}

.pagination__link,
.pagination__ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  border-radius: 6px;
  font-size: var(--ss-text);
  text-decoration: none;
  background: #fff;
  color: #444;
  transition: 0.2s ease;
}

.pagination__link:hover,
.pagination__link:focus {
  background: #e8e8e8;
  outline: none;
}

.pagination__link[aria-current="page"] {
  background: #000;
  color: #fff;
  font-weight: bold;
  pointer-events: none;
}

.pagination__link--prev,
.pagination__link--next {
  background: #2e7d32;
  color:#fff;
  border-radius: 14px;
  line-height: 12px;
  font-weight: bold;
  overflow: hidden;
}
.pagination__link--prev img,
.pagination__link--next img{height:12px;}
.pagination__link--prev:hover,
.pagination__link--next:hover{background: var(--new-green);}

/*----- recipe -----*/

.swiper{
  padding:0 23px !important;
  margin:0 -23px !important;
}

.swiper-slide{
  background:#fff;
  border-radius:20px;
  overflow:hidden;
  border: var(--border);
}

.recipe-card{
  transition:transform .3s ease;
}

.recipe-card:hover{
  transform:translateY(-5px);
  cursor: pointer;
}
.recipe-card a{text-decoration:none;}

.recipe-card__image{
  aspect-ratio: 4/3;
  overflow:hidden;
}

.recipe-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.recipe-card__body{
  padding:20px;
}

.recipe-card__title{
  font-size:var(--text);
  font-weight:bold;
  margin-bottom:12px;
}

.recipe-card__text{
  font-size:var(--s-text);
  line-height:1.6;
  margin-bottom:16px;
  font-weight:500;
}

.recipe-card__tags{
  display:flex;
  column-gap:12px;
  row-gap: 2px;
  flex-wrap:wrap;
}

.recipe-card__tag{
  font-size:var(--s-text);
  color:#2e7d32;
}

.swiper-button-prev,
.swiper-button-next{
  color:#fff;
  width:50px !important;
  height:50px !important;
  background:#3aaa35;
  border-radius:50%;
}

.swiper-button-prev{left:0 !important; }
.swiper-button-next{right:0 !important;}

.swiper-button-prev:after,
.swiper-button-next:after{
  content:"" !important;
  font-size:var(--text);
  font-weight:bold;
  color:#fff;
}
.swiper-button-prev:after,
.swiper-button-next:after{content:"";}


/* レスポンシブ */
@media (max-width:1024px){

}

@media (max-width:768px){
  .swiper{
    padding:0 20px;
  }
  .swiper{
  padding:0 16px !important;
  margin:0 -16px !important;
  }
  .swiper-button-prev,
  .swiper-button-next{
    color:#fff;
    width:42px !important;
    height:42px !important;
    background:#3aaa35;
    border-radius:50%;
  }
}

/*------ btn --------*/

.btn-wrap{display:flex; flex-wrap:wrap; gap:20px; justify-content: center;}
.btn-wrap a{display:inline-flex; align-items: center; justify-content: center; text-decoration:none; padding:0 35px; height:50px; border-radius:30px; font-weight:700; font-size:var(--text); letter-spacing:-0.04em; position:relative; width:300px;}
.btn-wrap a.auto{width:auto;}
.btn-wrap a.type01{color:#fff; background:var(--new-green); border:solid 2px var(--new-green);}
.btn-wrap a.type02{color:var(--new-green); background:#fff; border:solid 2px var(--new-green);}
.btn-wrap a.type01:after,.btn-wrap a.type02:after{
    content: '';
    background-image: url(/assets/images/_resource/shared/icons/icon-btn-arrow-white.svg);
    width: 8px;
    height:13px;
    aspect-ratio: 4 / 6;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: 15px;
}
.btn-wrap a.type02:after{background-image: url(/assets/images/_resource/shared/icons/icon-btn-arrow-darkgreen.svg);}

@media (max-width:768px){
.btn-wrap a{padding:0 40px; letter-spacing:-0.02em;  position:relative; width:270px;}
}

/*------- コンテンツマップ -------*/

.content-map{
    width: 100%;
    background:var(--pale-bg);
}

.puroducts-content-map{display:flex; justify-content: space-between; gap:40px; width:100%; max-width:1120px; padding:0 30px;margin:0 auto;}
.puroducts-content-map .map-title{
  font-size:var(--h3);
  font-family: 'BIZ UDGothic';
  font-style: normal;
  font-weight: 700;
  color: #444;
  margin: 0 0 30px;
}
.puroducts-content-map div{width:50%; max-width:500px;}
.puroducts-content-map ul{display:flex; gap:20px; flex-wrap:wrap;}
.puroducts-content-map ul li{width:calc((100% - 40px) / 2);}
.puroducts-content-map ul li a{text-decoration:none; font-size:var(--text); padding:0; font-weight:700;}
.puroducts-content-map div.shop-banner{margin:20px 0 10px; max-width:260px;}
.puroducts-content-map div.shop-banner a{display: block;}

@media (max-width:960px){
  .puroducts-content-map{flex-direction: column; justify-content: center; align-items: center;}
  .puroducts-content-map div{width:90%; max-width:840px;}
}

@media (max-width:768px){
  .puroducts-content-map{flex-direction: column; justify-content: center; align-items: center;}
  .puroducts-content-map div{width:100%; max-width:840px;}
  .puroducts-content-map .map-title{margin-bottom:20px}
}


/* 2603 */
.products_index_lead h2 {
  font-size: 22px;
  margin: 5px 0 12px;
  line-height: 1.6;
}
.products_index_lead p {
  line-height: 1.6;
}

.products_index_lineup {
  padding: 60px 0 20px;
  text-align: center;
}
.products_index_list {
  width: 50%;
  min-width: 460px;
  max-width: 640px;
  margin: 0 auto;
}
.products_index_list .products_item {
  margin: 50px 0 80px;
}
.products_index_list .products_item_ttl {
    font-weight: 700;
    font-size: 20px;
    color: #2E8208;
}
.products_index_list .products_item_img {
    background: #fff;
    border-radius: 20px;
    padding: 0;
    border: var(--border);
    display: flex;
    justify-content: center;
    margin: 15px 0 12px;
}
.products_index_list .products_item_img img {
    border-radius: 20px;
}
.products_index_list .products_item_caption {
  line-height: 1.6;
}

@media (max-width:768px){
  .products_index_lead h2 {
    font-size: 18px;
  }
  .products_index_lineup {
    padding: 40px 0 10px;
  }
  .products_index_list {
    width: 100%;
    min-width: inherit;
  }
  .products_index_list .products_item {
    margin: 30px 0 60px;
  }
  .products_index_list .products_item_ttl {
    font-weight: 700;
    font-size: 18px;
  }
}

/* 2カラム */
@media (min-width:769px){
  .products_index_list.col2 {
    width: 100%;
    max-width: inherit;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 70px 4%;
    margin: 50px 0 30px;
  }
  .products_index_list.col2 .products_item {
    width: 48%;
    max-width: 644px;
    margin: 0;
  }
}