/** Shopify CDN: Minification failed

Line 112:29 Expected ")" to end URL token
Line 278:27 Expected ")" to end URL token
Line 432:29 Expected ")" to end URL token
Line 436:29 Expected ")" to end URL token
Line 933:0 Unexpected "{"
Line 933:1 Expected identifier but found "%"
Line 933:31 Expected identifier but found "%"

**/
@import url('https://fonts.googleapis.com/css?family=Roboto&text=0123456789¥');

/* ================================================= */
:root {
  --PP-green-color-1: #217d5c;
  --PP-green-color-2: #95bba4;
  --PP-green-color-3: #c2eed4;
  --PP-brown-color-1: #3d332c;
  --PP-brown-color-2: #3f352b;
  --PP-brown-color-3: #5A4F44;
  --PP-beige-color-1: #f8eada;
  --PP-beige-color-2: #faf3eb;
  --PP-red-color-1: #9d1c1c;
  --PP-pale-gray-color-1: #f8f8f8;
  --PP-line-heigt: 1.6;
  --PP-fonts: 'Roboto', 'Young Serif', 'Noto Sans JP', 'Yu Gothic Pr6N M', sans-serif;
  --PP-fonts-serif: 'ヒラギノ明朝 ProN W3','HiraMinProN-W3','HG明朝E','ＭＳ Ｐ明朝','MS PMincho','MS 明朝', serif;
  --PP-bp-L: 989px;
  --PP-transition: all 300ms 0s ease;
  --main-color: #282828;
  --main-font: ryo-gothic-plusn, sans-serif;
--main-font-weight: 400;
--main-font-style: normal;
}

/* ================================================= */
/* modern css */
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block;width:100%}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}

/* ================================================= */
/* html {
  font-size: initial;
} */
body {
  font-family: var(--main-font);
  font-weight: var(--main-font-weight);
  font-style: var(--main-font-style);
  font-feature-settings: 'palt';
  -webkit-font-smoothing: antialiased;
  letter-spacing: initial;
  line-height: 1.8;
  color: var(--PP-brown-color-3);
  overflow-wrap: break-word;
  word-break: break-word;
  background-color: #fffdfa !important;
}
a {
  text-decoration: none;
  color:rgb(84, 83, 83);
}
a:hover {
  color: #8b8686 !important;
}
h1, h2, h3, h4, h5, .h0, .h1, .h2, .h3, .h4, .h5 {
  font-family: var(--main-font);
  font-weight: 700;
}
p, span, a {
  font-family: var(--main-font);
  font-weight: var(--main-font-weight);
}
/* ================================================= */
/* Site Header */
.SiteHeader {
  max-width: 100%;
}
@media screen and (min-width: 990px) {
  .SiteHeader {
    display: flex;
  }
}

@media screen and (min-width: 990px) {
  .SiteHeader .SiteHeader_Nav {
    margin-left: auto;
  }
}

#shopify-section-header {
  z-index: 10;
}

/* ================================================= */
/* Top page */

/* MainVisual */
@media screen and (min-width: 750px) {
  body .TopMainVisual .TopMainVisual_Content {
    justify-content: flex-start;
    align-items: center;
  }
}

@media screen and (min-width: 750px) {
  body .TopMainVisual .TopMainVisual_Text {
    background-color: var(--PP-green-color-1);
  }
}

.TopPage_Title {
    background-image: url({{ 'pawpad.png' | asset_url }});
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--PP-green-color-1);
    line-height: 10rem;
}

/* ================================================= */
/*  Container */
.pp-Container-Grid {
  display: grid;
  grid-template-columns: 1rem 1fr 1rem;
}

@media screen and (min-width: 990px) {
.pp-Container-Grid {
  grid-template-columns: 1fr repeat(12, minmax(64px, 84px)) 1fr;
}
}

.pp-Container-Button-Center {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ================================================= */
.Apps {
  padding: 2rem 4rem 4rem 4rem;
}

@media screen and (min-width: 750px) {
  .Apps {
    padding: 4rem 8rem 8rem 8rem;
  }
}

/* ================================================= */
.Button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.6rem 3.2rem;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  font-size: 2rem;
  border-radius: .25rem;
  /* font-family: var(--PP-fonts-serif); */
  font-family: var(--PP-fonts);
  transition: all .3s ease;
}

@media (hover: hover) {
.Button:hover {
  opacity: .9;
  transform: scale(105%);
  transition: all .3s ease;  
}
}

.Button-Main {
  background-color: var(--PP-green-color-1);
  color: #fff;
}

.Button-Outline {
  position: relative;
  border: solid 1px var(--PP-green-color-1);
  background-color: #fff;
  color: var(--PP-green-color-1);
}

.Button-Outline::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 3rem;
  border-top: currentColor 1px solid;
}

.Button-L {
  min-width: 80%;
}

/* ================================================= */
.Link-List  {
  color: var(--PP-green-color-1);
  text-decoration: none;
  border-bottom: dashed 1px currentColor;
  transition: var(--PP-transition);
}

@media (hover: hover) {
  .Link-List:hover  {
    opacity: .9;
    transform: translateY(-1rem);
     transition: var(--PP-transition);
  }
}

.Link-Text {
  font-size: 1.6rem;
  font-weight: 400;
  text-decoration: none;
  color: currentColor;
}

@media (hover:hover) {
  .Link-Text {
    color: currentColor;
  }
}

/* ================================================= */
.shopify-section {
  position: static;
  z-index: 0;
}

/* ================================================= */
.header__menu-item span {
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--main-color);
}

/* ================================================= */
.footer-block {
  color: #fff;
}

/* ================================================= */
.page-title {
  color: var(--main-color);
}

/* ================================================= */
/* Page Common */
/* ================================================= */
.Page .Page_Inner {
  max-width: 100rem;
}

.Page_Inner h1 {
  font-size: 2.8rem;
  font-weight: 600;
  background-image: linear-gradient(90deg, var(--PP-green-color-3) 0 10%, transparent 10%);
  background-repeat: no-repeat;
  background-size: 100% 10%;
  background-position: bottom;
  padding-bottom: 2rem;
}

@media screen and (min-width: 750px) {
   .Page_Inner h1 {
    font-size: 4.2rem;
  } 
}

.PageContent h2 {
  background-image: url({{ 'pawpad.png' | asset_url }});
  font-family: var(--font-family-serif);
  background-color: var(--PP-green-color-1);
  padding: 2rem 2rem 2rem 8rem;
  color: #fff;
  background-repeat: no-repeat;
  background-size: 4rem;
  background-position: 2rem center;
  font-size: 1.8rem;
  font-weight: 600;
}

@media screen and (min-width: 750px) {
  .PageContent h2 {
    font-size: 2rem;
  }
}

.PageContent h3 {
  padding: 2rem;
  border-top: solid 1px var(--PP-green-color-1);
  border-bottom: solid 1px var(--PP-green-color-1);
  color: var(--PP-green-color-1);
  font-weight: 600;
}

.PageContent h4 {
  color: var(--PP-green-color-1);
  font-size: 1.8rem;
  font-weight: 600;
}

.PageContent > *:not(first-of-type) {
  margin-top: 2.4rem;
}

@media screen and (min-width: 750px) {
.PageContent > *:not(first-of-type) {
  margin-top: 4rem;
}
}

/* ================================================= */
.product .product__title h1 {
  /* font-family: serif; */
  font-size: 2.8rem;
}

@media screen and (min-width: 750px) {
   .product .product__title h1 {
    font-size: 3rem;
  } 
}

.product .product__description > *:not(first-of-type){
  margin-top: 1.6rem;
}

.product .product__description h1, 
.product .product__description h2, 
.product .product__description h3, 
.product .product__description h4, 
.product .product__description h5, 
.product .product__description h6 {
  margin-top: 3rem;
  font-weight: 600;
  padding-left: 1.2rem;
  border-left: solid .4rem var(--PP-green-color-1);
}

/* ================================================= */
.blog-articles .card__heading a {
  font-weight: 600;
}

/* ================================================= */
.product .shopify-payment-button__button {
  background-color: var(--main-color);
  transition: .5s;
}

section[id*="__related-products"] {
  margin-top: 1.5rem;
}

@media screen and (min-width: 750px) {
 section[id*="__related-products"] {
  margin-top: 3rem !important;
} 
}

/* ================================================= */
.related-products__heading {
  font-weight: 600;
}

/* ================================================= */
/* Commitment Page */
/* ================================================= */
.PageContent .CommitmentQuality,
.PageContent .CommitmentNutrition {
  display: grid;
  gap: 2rem 0;
}

@media screen and (min-width: 750px) {
　.PageContent .CommitmentQuality,
　.PageContent .CommitmentNutrition {
  gap: 4rem 0;
}
}

.PageContent .CommitmentTitle-Quality,
.PageContent .CommitmentTitle-Nutrition {
  background-image: none;
  padding: 5rem;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  font-size: 3rem;
  /* font-family: var(--PP-fonts-serif); */
  font-family: var(--PP-fonts);
  font-weight: 400;
}

@media screen and (min-width: 750px) {
  .PageContent .CommitmentTitle-Quality,
  .PageContent .CommitmentTitle-Nutrition {
    padding: 8rem;
  }
}

.CommitmentDescription_Image {
  flex-basis: 33%;
}

.PageContent .CommitmentDescription_Text {
  display: grid;
  gap: 2rem 0;
  flex-basis: 67%;
}

.PageContent .CommitmentTitle-Nutrition {
  margin-top: 5rem;
}

@media screen and (min-width: 750px) {
  .PageContent .CommitmentTitle-Nutrition {
  margin-top: 8rem;
}
}

.PageContent .CommitmentTitle-Quality {
    background-image: url({{ 'dog_image01.png' | file_img_url:'1200x' }});
}

.PageContent .CommitmentTitle-Nutrition {
    background-image: url({{ 'dog_image02.png' | file_img_url:'1200x' }});
}

.PageContent .CommitmentTopic {
  text-align: center;
  font-weight: 600;
  background-image: linear-gradient(90deg, transparent 45%, var(--PP-green-color-3) 45%, var(--PP-green-color-3) 55%, transparent 55%);
  background-repeat: no-repeat;
  background-size: 100% 10%;
  background-position: bottom;
  padding-bottom: 2rem;
  border: 0;
  font-size: 2.4rem;
}

@media screen and (min-width: 750px) {
  .PageContent .CommitmentTopic {
  font-size: 3rem;
}
}

.PageContent .CommitmentDescription_Info {
  display: flex;
  flex-direction: column;
  /* font-family: var(--PP-fonts-serif); */
  font-family: var(--PP-fonts);
  gap: 2rem 0;
}

@media screen and (min-width: 750px) {
  .PageContent .CommitmentDescription_Info {
    flex-direction: row;
    gap: 0 4rem;
}
}

.PageContent .CommitmentTaste {
  padding: 3rem;
  background: var(--PP-beige-color-2);
  border-radius: 8px;
  display: grid;
  gap: 2rem 0;
}

.PageContent .CommitmentTaste_List {
  display: flex;
  flex-direction: column;
  list-style-type: none;
  margin: 0;
  padding: 0;
  gap: 2rem;
}

@media screen and (min-width: 750px) {
.PageContent .CommitmentTaste_List {
  flex-direction: row;
  gap: 1rem;
}
}

.PageContent .CommitmentTaste_ListItem {
  text-align: center;
  display: flex;
  gap: 1rem;
  flex-direction: column;
  background-color: #fff;
}

.PageContent .CommitmentTaste_ListItem h4 {
  font-size: 2.4rem;
  padding-bottom: 2rem;
}

.PageContent .CommitmentTaste_ListItem i {
  color: var(--PP-beige-color-1);
  font-size: 2.4rem;
}

.PageContent .CommitmentTaste_Title {
  text-align: center;
  /* font-family:  var(--PP-fonts-serif); */
  font-family:  var(--PP-fonts);
  color: #fff;
  background-color: var(--PP-green-color-1);
  font-weight: 400;
  font-size: 2.4rem;
  padding: 2.4rem;
}

@media screen and (min-width: 750px) {
  .PageContent .CommitmentTaste_Title {
    font-size: 3rem;
    padding: 4rem;
  }
}

.PageContent img {
  width: 100%;
  aspect-ratio: 3/2;
  object-fit: cover;
  height: 100%;
}

/* ================================================= */
/* Row */
/* ================================================= */
.pp-Row {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

@media screen and (min-width: 750px) {
  .pp-Row {
    padding-top: 3rem;
    padding-bottom: 3rem;
  } 
}

/* ================================================= */
.PageNotice {
  padding: 2rem 3rem;
  background-color: #ddd;
  color: #666;
  border-radius: .8rem;
}

.PageNotice_Text {
  font-size: 1.4rem;
  font-family: var(--PP-fonts);
}

/* ================================================= */
.Recommendation_Header {
  text-align: center;  
}

.Recommendation_Inner {
  display: grid;
  gap: 4rem;
}

@media screen and (min-width: 750px) {
  .Recommendation_Inner {
  gap: 2rem;
}
}

.RecommendationProduct {
  padding: 2rem;
  background-color: var(--PP-beige-color-2);
}

@media screen and (min-width: 750px) {
.RecommendationProduct {
  padding: 4rem;
}
}

.RecommendationProduct_Inner {
  display: grid;
  gap: 4rem 0;
  display: grid;
  gap: 3rem;
}

.RecommendationProduct_Header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  padding: 2rem;
}

.RecommendationProduct_Header figure img {
  aspect-ratio: 1/1;
  max-width: 10rem;
  border: 0;
} 

.RecommendationProduct_Header h3 {
  font-size: 3rem;
  border: 0;
  padding: 0;
}

.RecommendationProduct_Header h3 span {
  font-size: 1.6rem;
}

.RecommendationProduct_Header a {
  color: #fff;
  font-family: var(--PP-fonts);
}

.RecommendationProduct_Header a:hover {
  color: #fff;
}

.PageContent .Recommendation_Title {
  background: transparent;
  color: var(--PP-green-color-1);
  padding: 2rem;
}

@media screen and (min-width: 750px) {
.RecommendationProduct_Image {
  flex-basis: 65%;
}
}

@media screen and (min-width: 750px) {
.RecommendationProduct_Header {
  flex-basis: 35%;
}
}

.PageContent .RecommendationProduct_List {
  display: grid;
  gap: 2rem 0;
  list-style-type: none;
  padding: 0;
}

@media screen and (min-width: 750px) {
  .PageContent .RecommendationProduct_List {
  gap: 4rem 0;
}
}

.RecommendationProduct_ListItem {
  display: flex;
  flex-direction: column;
}

@media screen and (min-width: 990px) {
 .RecommendationProduct_ListItem {
  flex-direction: row;
} 
}

/* ================================================= */
.footer .list-social__item .icon {
  transform: scale(1.5);
}

.footer .list-social__link {
  color: #fff;
}

.PP-Footer .footer-block--newsletter {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 2rem;
  width: 100%;
}

.PP-Footer .footer__follow-on-shop {
  text-align: center;
  display: flex;
  justify-content: center !important;
  align-content: center;
  width: 100%;
}

/* ================================================= */
.Text-Deco01 {
  color: var(--PP-green-color-1);
  position: relative;
}

.Text-Deco01::before {
  content: "";
  position: absolute;
  top: .6rem;
  left: -2.4rem;
  width: 1.2rem;
  height: 1.2rem;
  display: inline-block;
  border-right: 1px solid var(--PP-green-color-1);
  transform: rotate(-36deg);
}

.Text-Deco01::after {
  content: "";
  position: absolute;
  top: 0;
  right: -1.2rem;
  width: 1.2rem;
  height: 1.2rem;
  display: inline-block;
  border-right: 1px solid var(--PP-green-color-1);
  transform: rotate(36deg);
}



/* ================================================= */
/* Override */
/* ================================================= */
@media screen and (min-width: 750px) {
  .blog-articles {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}

/* ================================================= */
/* Slider */
/* ================================================= */

@media screen and (max-width: 899px) {
.TopMainSlide .slideshow__text-wrapper {
  display: none;
} 
}

/* ================================================= */
.u-aspect-initial {
  aspect-ratio: initial;
}

.u-br-sp {
  display: block;
}

.u-br-pc {
  display: none;
}


@media screen and (min-width: 750px) {
.u-br-sp {
  display: none;
}

.u-br-pc {
  display: block;
}

}


/* ================================================= */
/* .swiper {
  width: 100%;
  height: 570px;
}
.swiper-slide {
  width: 100%;
  height: 100%;
background-size:cover;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: bold;
}
.swiper-pagination-bullet {
background-color:none;
  border:white;
}
.swiper-pagination-bullet-active {
background-color:white;
}
h2 {
font-size: 40px;
}
@media screen and (max-width: 990px) {
.swiper {
height:420px;
}
} */


.swiper-container-main {
    text-align: center;
}
/* ================================================= */

.product-form__buttons button.shopify-payment-button__button {
  pointer-events: visible !important;
}

.collection-hero__description {display: none;}




/* ==================================以下より特ちゃんショップCSS==================================== */

/* =====共通====== */
@media screen and (min-width: 650px){	
  .pc { display:block; }
  .mb { display:none; }
}

@media screen and (max-width: 979px){
  .pc { display:none; }
  .mb { display:none; }
}

@media screen and (max-width: 650px){	
  .pc { display:none; }
  .mb { display:block; }
}



.tcs-page-title {
  text-align: center;
  font-size: 3rem;
}
.top_hedding {
  text-align: center;
  margin: 8rem 0 5rem;
}
.top_hedding-sub-hedding {
      font-size: 2rem;
    font-weight: bold;
    color: var(--main-color);
}
.top_hedding-main-hedding {
      font-size: 3rem;
    font-weight: bold;
    color: var(--main-color);
}
    .page-width--narrow {
        max-width: initial !important;
    }
.tcs-page-title {
    padding: 5rem 0 !important;
    font-size: 3.5rem !important;
    line-height: 1 !important;
  margin-bottom: 0 !important;
  font-family: "source-han-serif-variable", sans-serif;
}
.nanacanele-main-page {
      padding-top: 5rem !important;
}
@media (max-width: 765px) {
  .top_hedding {
    text-align: center;
    margin: 5rem 0 3rem;
}
.top_hedding-main-hedding {
    font-size: 2.5rem;
}
.top_hedding-sub-hedding {
    font-size: 1.5rem;
}
  .lorenzo_product-grid {
    margin: 0 !important;
  }
.tcs-main-page .tcs-page-title {
          font-size: 2.8rem !important;
        padding: 3rem 0 !important;
}
.nanacanele-main-page {
      padding: 0;
}

  
}



/* swiper*/
.swiper-slide img {
  object-fit: cover;
aspect-ratio: 4/ 2;
}
.swiper-pagination {
    z-index: 1 !important;
}
@media (max-width: 765px) {
.swiper-slide img {
  object-fit: cover;
aspect-ratio: 3/ 2;
}
.swiper-pagination {
    position: relative !important;
    margin-top: 1rem !important;
}
}


/* ヘッダー */
.header__active-menu-item {
          text-decoration: none !important;
}
.header__menu-item:hover span {
    text-decoration: underline !important;
    text-underline-offset: .3rem;
}
{% comment %} ナナカヌレ {% endcomment %}
.nanacanele-header {
      position: fixed;
    width: -webkit-fill-available;
    top: 2%;
        justify-content: flex-end;
}
.nanacanele_header_list {
      margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
        justify-content: flex-end;
}
.nanacanele_header_list > li {
  padding: 0 3rem;
  border-left: solid 1px #fff;
      text-shadow: 1px 1px 1px var(--main-color);
}
.nanacanele_header_list > li a {
color: #fff;
    text-shadow: 1px 1px 1px var(--main-color);
}
.nanacanele_header_list > li:last-child {
border-right: solid 1px #fff;
    text-shadow: 1px 1px 1px var(--main-color);
}
.header__icon {
    color: #fff;
        text-shadow: 1px 1px 1px var(--main-color);

}
.nanacanele_header-menu {
  position: relative;
  z-index: 10;
}


/* ▼ 各メニュー項目 */
.nanacanele_header_list li {
  position: relative;
}

/* ▼ メガメニュー */
.nanacanele-header .megamenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 200px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  pointer-events: none; /* ←これが重要！hover範囲外でも反応しないように */
  transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s ease;
  z-index: 1000;
  padding: 1rem;
}

/* ▼ hover時にふわっと表示 */
.nanacanele_header_list li:hover > .megamenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto; /* ←表示中だけクリック可能に */
}

/* ▼ メガメニュー内のグリッド */
.mega-menu__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 20px;
}

/* ▼ 各アイテム */
.mega-menu__item {
  text-align: left;
}

.mega-menu__item img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mega-menu__item:hover img {
  transform: scale(1.03);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
}

.mega-menu__item a {
  display: block;
  color: #333;
  text-decoration: none;
  margin-top: 8px;
  font-size: 14px;
  transition: color 0.3s ease;
}

.mega-menu__item a:hover {
  color: #c47a3f; /* アクセントカラー */
}
#mobile-menu-toggle {
  display: none;
}
#Details-menu-drawer-container {
      justify-content: end;
}
.megamenu__list {
  display: none;
}
  .nanacanele-kotei_header {
        position: relative;
    background: var(--main-color);
        padding: 3rem 5rem;
  }








@media (max-width: 765px) {
  .megamenu__list {
  display: block;
}
  #Details-menu-drawer-container {
    display: block;
  }
  #mobile-menu-toggle {
  display: block;
}
/* --- icon 切り替え --- */
#mobile-menu-toggle .icon-close {
  display: none;
}
.menu-opened #mobile-menu-toggle .icon-hamburger {
  display: none;
}
.menu-opened #mobile-menu-toggle .icon-close {
  display: inline-block;
}

/* --- 暗幕背景 --- */
.mobile-menu-overlay {
  position: fixed;
  inset: 0;
          background: rgb(0 0 0 / 81%);
  display: none;
  z-index: 9998;
}
.menu-opened .mobile-menu-overlay {
  display: block;
}

/* --- メニュー（UL）中央配置 --- */
.nanacanele_header_list {
  position: fixed;
          top: 40%;
        left: 20%;
  transform: translate(-50%, -50%);
  z-index: 10000;
  display: none;
  text-align: center;
  list-style: none;
}
.nanacanele_header_list.active {
        display: flex;
        flex-flow: column;
        gap: 2rem;
        justify-content: center;
        align-items: baseline;
        line-height: 1;
}

/* スクロール禁止 */
html.menu-open,
body.menu-open {
  overflow: hidden;
  height: 100%;
}
.nanacanele_header_list > li {
    border-left: none;
        text-shadow: none;
                text-align: start;
                        padding: 0;
}
.nanacanele_header_list > li:last-child {
    border-right: none;
    text-shadow: none;
}
.megamenu__list {
      margin-top: 2rem;
      position: relative;
}
.megamenu__list::before {
          content: "";
        position: absolute;
        width: 2rem;
        height: 1px;
        top: 50%;
        left: 15%;
        background: #fff;
}

.header__search {
  display: none;
}

}

/* カート画面 */
#shopify-section-template--20462457290977__cart-items .page-width {
    padding: 5rem 0 0;
    width: 90%;
}
#shopify-section-template--20462457290977__cart-items .underlined-link {
  background: var(--main-color);
    color: #fff;
    padding: 0.5rem 2rem;
}

/* 共通 */
@media (max-width: 765px) {
.nanacanele-main-page {
    padding-top: 5rem !important;
}
.tcs-page-title {
    padding: 3rem 0 !important;
    font-size: 3rem !important;
    line-height: 1 !important;
    margin-bottom: 0 !important;
    font-family: "source-han-serif-variable", sans-serif;
}
}

/* フッター */
@media (max-width: 765px) {
.nanacanele_footer-logo_img {
    width: 35% !important;
    margin: 0 auto;
}
}













/* =====会社案内ページ====== */
.company_width {
  width: 80%;
  margin: 0 auto;
  padding: 8rem 0;
}
.company-hedding h2 {
      position: relative;
    padding-bottom: 1.5rem;
    padding-left: 5px;
    font-size: 3rem;
    color: var(--main-color);
}
.company-hedding h2::after {
  content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 8px;
	background-image: repeating-linear-gradient(45deg, var(--main-color) 0px, var(--main-color) 1px, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%);
	background-size: 8px 8px;
}
.company_tate {
  display: flex;
  flex-flow: column;
  gap: 5rem;
}
.company_map iframe {
  width: 100%;
}
.company_guide, .company_info {
  display: flex;
  flex-flow: column;
  gap: 2.5rem;
}
.company_imfo-table {
  width: 100%;
}
.company_imfo-table th, .company_imfo-table td {
  border-bottom: solid 1px #ccc;
      padding: 1.5rem 0;
}
.company_imfo-table th {
  width: 20%;
  border-right: solid 1px #ccc;
}
.company_imfo-table td {
  width: 80%;
      padding: 1.5rem 2.5rem !important;
}
.company_imfo-table_first {
   border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
}
.company_img {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}
.company_img img {
  margin-bottom: 0;
  height: 100%;
      aspect-ratio: 4 / 2.5;
    object-fit: cover;
}

@media (max-width: 765px) {
.company_width {
    width: 90%;
    margin: 0 auto;
    padding: 5rem 0;
}
.company_tate {
    gap: 4rem;
}
   .company_imfo-table th {
    width: 30%;
}  
.company_imfo-table td {
    padding: 1.5rem 1.5rem !important;
}
.company_img {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
    margin-bottom: 2rem;
}
.company-hedding h2 {
    font-size: 2.5rem;
}
  
  }




/* =====商品詳細ページ====== */
.related-products__heading {
  color: var(--main-color);
}
 .related-products .card {
  background: #fff !important;
}
.related-products .card a {
  color: var(--main-color);
      font-weight: 600;
    font-size: 2rem;
}
.related-products .card .card-information .price__container {
  color: var(--main-color);
}
#cart-notification-form {
  display: none;
}
.shopify-payment-button {
  display: none;
}
.product-contactBotton a {
display: block;
width: 50%;
background: var(--main-color);
color: #fff;
    padding: 1.4rem 0;
text-align: center;
line-height: 1;
font-weight: 600;
}


/* =====ご利用ガイドページ====== */
.tcs_Usage-guide-width {
      width: 60%;
    margin: 0 auto;
    padding: 0 0 8rem;
}
.tcs_Usage-guide-Content {
      display: grid;
    gap: 4rem;
}
.tcs_Usage-guideL-Content_hedding h4 {
      display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 1rem;
      font-size: 2rem;
    color: var(--main-color);
    border-bottom: solid 1.2px var(--main-color);
      font-weight: 600;
      padding: 0.5rem;
      font-family: "source-han-serif-variable", sans-serif;
      position: relative;
}
.tcs_Usage-guide-table th, .tcs_Usage-guide-table td {
  padding: 0.5rem !important;
    border-right: solid 1px;
    border-bottom: solid 1px;
    text-align: center;
    line-height: 1.4;
    font-size: 1.3rem;
}
.tcs_Usage-guide-table {
width: -webkit-fill-available;
}
  .cg_hokkaidou {
    background: #c9d3de;
  }
.cg_kitatohoku {
background: #c9dbde;
}
.cg_minamitohoku {
background: #dec9ca;
}
.cg_kanto {
background: #dedec9;
}
.cg_shinetu {
background: #dedec9;
}
.cg_hokuriku {
background: #dedec9;
}
.cg_chubu {
background: #dedec9;
}
.cg_kansai {
background: #dedec9;
}
.cg_chugoku {
background: #dec9ca;
}
.cg_shikoku {
background: #dec9ca;
}
.cg_kyushu {
background: #c9dbde;
}
.cg_okinawa {
background: #d0c9de;
}
.table-scroll {
position: relative;
    overflow: auto;
}
    


@media (max-width: 765px) {
.tcs_Usage-guide-width {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 8rem;
    overflow-x: initial !important;
}
.tcs_Usage-guide-Content {
    gap: 3rem;
            width: -webkit-fill-available;
        overflow-x: initial !important;
}
.tcs_Usage-guideL-Content_hedding h4 {
    font-size: 2rem;
}
.tcs_Usage-guide-Content1, .tcs_Usage-guide-Content2, .tcs_Usage-guide-Content3, .tc_Usage-guide-Content5, .tcs_Usage-guide-Content6, .tcs_Usage-guide-Content7 {
      width: 90%;
}

.table-scroll {
  width: 100%;
  max-width: 100vw;  
  margin: 0 auto;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;

  /* 他のレイアウト影響から切り離す */
  display: block;
  box-sizing: border-box;
}

/* 2. テーブル本体は横に伸びてOK */
.tcs_Usage-guide-table {
  table-layout: auto !important;
  width: max-content !important; 
  min-width: 900px;         
  border-collapse: collapse;
  white-space: nowrap;
}

/* 3. どんな親の影響も受けないようにする保険 */
.tcs_Usage-guide,
.tcs_Usage-guide-width,
.tcs_Usage-guide-Content,
.tcs_Usage-guide-Content_naka {
  max-width: 100% !important;
  min-width: 0 !important; 
  overflow-x: hidden;        
}
  
}


/* =====プライバシーポリシーページ====== */
.tcs_privacypolicy-width {
  width: 60%;
    margin: 0 auto;
        padding: 0 0 8rem;
}
.tcs_privacypolicy-content {
  display: grid;
  gap:3rem;
}
.tcs_privacypolicy-content_hedding {
  color: var(--main-color);
  font-weight: 600;
  font-size: 2rem;
      font-family: "source-han-serif-variable", sans-serif;
          margin-bottom: 0.8rem;
}
.tcs_privacypolicy-content9 a {
  color: var(--main-color) !important;
}
.tcs_privacypolicy-date {
      font-weight: 600;
    color: #bbb;
    font-family: "source-han-serif-variable", sans-serif;
}

@media (max-width: 765px) {
.tcs_privacypolicy-width {
  width: 90%;
    margin: 0 auto;
    padding: 5rem 0;
}
.tcs_privacypolicy-content_hedding {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

  
}



/* =====特商法ページ====== */
.tcs_commerce-width {
      width: 60%;
    margin: 0 auto;
    padding: 0 0 8rem;
}
.tcs_commerce-content_tate {
      display: grid;
    gap: 4rem;
}
.tcs_commerce-content_hedding h4 {
      display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 1.5rem;
    font-size: 2.5rem;
    color: var(--main-color);
    border-bottom: solid 1.2px var(--main-color);
    font-weight: 600;
    padding: 0.5rem 1rem;
}
.tcs_commerce-content_sub-hedding h5 {
    margin-bottom: 0.8rem;
    font-size: 2rem;
    color: var(--main-color);
    font-weight: 600;
    padding-left: 1rem;
  border-left: solid 5px var(--main-color);
}
.tcs_commerce-Content {
  display: flex;
  flex-flow: column;
  gap: 5rem;
}
.tcs_commerce-table table {
  width: 100%;
      border: solid 1px #ccc;
}
.tcs_commerce-table table th {
  text-align: start;
  width: 40%;
  border: solid 1px #ccc;
  font-family: "source-han-serif-variable", sans-serif;
    font-size: 1.8rem;
}
.tcs_commerce-table table td {
  text-align: start;
  width: 60%;
   border: solid 1px #ccc;
}
.tcs_commerce-content_sub-hedding h5 {
  font-weight: 600;
    font-family: "source-han-serif-variable", sans-serif;
    font-size: 1.5rem;
        padding-left: 0.5rem;
}
.tokushouhou_soryo-button {
  background: #787878;
    padding: 1rem 3rem;
    line-height: 1;
    display: inline-block;
    font-weight: 500;
    color: #fff !important;
    border: solid 1px #787878;
    transition: all .3s !important;
}
.tokushouhou_soryo-button:hover {
  background: #fff;
  color: #787878;
}

@media (max-width: 765px) {
.tcs_commerce-width {
    width: 90%;
    margin: 0 auto;
    padding: 5rem 0;
}
.tcs_commerce-content_tate {
    gap: 3rem;
}
.tcs_commerce-content_hedding h4 {
    font-size: 2rem;
}
  
}


/* ====== 利用規約======  */
  .terms-of-service_width {
    width: 60%;
    margin: 0 auto;
    padding: 0 0 8rem;
  }
  .terms-of-service_haco h3 {
    color: #252525;
        font-weight: 600;
    font-family: "source-han-serif-variable", sans-serif;
    font-size: 2rem;
  }
  .terms-of-service_tate {
    display: flex;
    flex-flow: column;
    gap: 5rem;
  }
  .terms-of-service_haco {
    display: flex;
    flex-flow: column;
    gap: 1.5rem;
  }
  @media (max-width: 765px) {
    .terms-of-service_width {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 5rem;
}
  }
 /* 利用規約ここまで */



/* ログイン画面 */
#customer_login .field input {
  background: var(--main-color);
  color: #fff;
}
#customer_login a {
  color: var(--main-color);
}
#customer_login button {
  background-color: #eee;
}
#customer_login button:after {
  box-shadow: 0 0 0 #bbb;
}



.register > h1 {
      color: var(--main-color);
    font-size: 3rem;
}
#create_customer .field input {
  background: var(--main-color);
  color: #fff;
}
#create_customer button {
  background-color: #eee;
}
#create_customer button:after {
  box-shadow: 0 0 0 #bbb;
}



/* =====TOPページ====== */

/* 動画 */
.top-main {
  position: relative;
}
.top-video {
  line-height: 0;
      filter: brightness(0.5);
}
.top-main .top-main_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.top-main-logo-img {
      width: 35%;
    margin: 0 auto;
}
.top-main_logo-heading h2 {
  color: #fff;
  text-align: center;
  display: flex;
  flex-flow: column;
  gap: 1.5rem;
  font-size: 2rem;
  font-weight: 600;
}
.top-main_logo-heading h2 p:first-child {
  font-size: 1.4rem;
  font-weight: 500;
}
.top-main_logo-tate {
  display: flex;
  flex-flow: column;
  gap: 3rem;
}



/* コンセプト */
.top-concept {
  position: relative;
  z-index: 1;
}
.top-concept::before {
  content: "";
  background-image: url(/cdn/shop/files/re_DSC00096.png);
  background-size: contain;
   left: -1%;
    height: 30%;
    width: 30%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 100;
}
.top-concept::after {
       content: "";
    background-image: url(/cdn/shop/files/re_DSC00146.png);
    background-size: contain;
    left: -1%;
    top: 27%;
    height: 29%;
    width: 25%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 101;
}
.top-concept_back {
  background-color: var(--main-color);
  position: relative;
}
.top-concept_back::before {
     content: "";
    background-image: url(/cdn/shop/files/re_coffee.png);
    background-size: contain;
    right: 12%;
    top: 5%;
    height: 29%;
    width: 15%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 101;
}
.top-concept_back::after {
     content: "";
    background-image: url(/cdn/shop/files/re_chocolate.png);
    background-size: contain;
    right: 1%;
    top: 29%;
    height: 18%;
    width: 16%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 101;
}
.top-concept_width {
  width: 70%;
  margin: 0 auto;
  padding: 10rem 0;
}
.top-concept_tate {
  display: flex;
  flex-flow: column;
  gap: 6rem;
}
.top-concept_news {
  background-color: #fff;
  padding: 5rem;
  border-radius: 2vh;
      margin: 0 auto;
}
.top-concept_news {
  display: flex;
  flex-flow: column;
  gap: 1.5rem;
      width: 85%;
          position: relative;
    z-index: 100;
}
.top-concept_news-heading h2 {
  text-align: center;
  color: var(--main-color);
}
.top-concept_news-list {
      width: 90%;
    margin: 0 auto;
}
.top-concept_news-button {
      text-align: end;
}
.top-concept_news-list-tate li {
  list-style: none;
}
.top-concept_news-list-tate {
  display: flex;
  flex-flow: column;
  gap: 1.3rem;
}
.top-concept_content-yoko {
      display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
     align-items: center;
}
.top-concept_content {
      display: flex;
    flex-flow: column;
    gap: 4rem;
}
.top-concept_content-img img {
    border-radius: 1vh;
    box-shadow: 4px 4px 10px 1px #171717;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: right;
}
.top-concept_content-left {
      text-align: center;
    display: flex;
    flex-flow: column;
    gap: 2.5rem;
}
.top-concept_content-left p {
  color: #fff;
}
.top-concept_content-left_heading {
      display: flex;
    flex-flow: column;
    gap: 1.5rem;
}
.top-concept_content-button a {
  display: inline-block;
    line-height: 1;
    background: #fff;
    padding: 3rem;
    font-weight: 600;
    border-radius: 50vh;
    width: 60%;
    text-align: center;
    font-size: 2rem;
}
.top-concept_content-left_heading h3:first-child {
  font-size: 1.5rem;
}
@media (max-width: 765px) {
  .top-concept_news-list-tate li {
    display: flex;
    flex-flow: column;
}
.top-concept_news-list-tate .title {
  padding: 0;
  margin: 0;
  font-weight: 600;
}
.title::after, .title::before {
  display: none;
}
}



/* ラインナップ */
.top-lineup {
  position: relative;
}
.top-lineup::before {
      content: "";
    background-image: url(/cdn/shop/files/re_DSC00104.png);
    background-size: contain;
    right: 1%;
    top: -8%;
    height: 14%;
    width: 34%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 1;
}
.top-lineup::after {
      content: "";
    background-image: url(/cdn/shop/files/re_colortry.png);
    background-size: contain;
    left: 1%;
    top: -23%;
    height: 14%;
    width: 34%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: 101;
}
.top-lineup_tate {
      display: flex;
    flex-flow: column;
    gap: 10rem
}
.top-lineup_width {
  padding: 10rem 0;
}
.top-lineup_content-slider-haco {
  margin-right: 3rem;
}
.top-lineup_content-slider-img {
  box-shadow: 1px 1px 7px 1px #00000045;
  padding: 0.8rem;
}
.top-lineup_content-slider .slick-dots {
  bottom: -40px;
}
.top-lineup_content-slider .slick-dots li button:before {
  font-size: 14px;
}
.top-lineup_content-slider-text h6 {
      color: initial;
    margin: 0;
        font-size: 2.2rem;
    line-height: 1;
}
.top-lineup_content-slider-text {
  text-align: center;
      margin-top: 2rem;
}

.top-lineup_howtoeat {
  width: 70%;
  margin: 0 auto;
}
.top-lineup_content {
      display: flex;
    flex-flow: column;
    gap: 5rem;
}
.top-lineup_howtoeat-width {
      padding: 8rem;
      height: -webkit-fill-available;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: end;
}
.top-lineup_howtoeat-back {
     background-repeat: no-repeat !important;
    background-size: cover !important;
    background-color: #00000021 !important;
    background-blend-mode: color;
        background-position: center !important;
        height: 80rem;
}
.top-lineup_content-heading h2 {
    color: initial;
    text-align: center;
        font-size: 4rem;
    border-bottom: solid 1px;
    display: inline-block;
    line-height: 1.5;
    padding: 0 0.8rem;
}
.top-lineup_content-heading {
width: 70%;
  margin: 0 auto;
  text-align: center;
}
.top-lineup_howtoeat-tate {
      display: flex;
    flex-flow: column;
    gap: 3rem;
    justify-content: center;
    align-items: center;
}
.top-lineup_howtoeat-tate h4 {
      font-size: 2.5rem;
          text-shadow: 1px 2px 4px black;
}
.top-lineup_howtoeat-tate p {
  color: #fff;
  text-align: center;
      text-shadow: 1px 2px 4px black;
}

.top-lineup_staff-width {
  width: 70%;
  margin: 0 auto;
}
.top-lineup_staff-yoko01_left h5 {
  margin: 0;
  color: initial;
      text-align: center;
    font-size: 2.5rem;
    line-height: 1.4;
}
.top-lineup_staff-yoko01_right h5 {
   margin: 0;
  color: initial;
    font-size: 2.5rem;
    line-height: 1.4;
}
.top-lineup_staff-yoko01 {
  display: flex;
  gap: 3rem;
  align-items: center;
}
.top-lineup_staff-yoko01 .top-lineup_staff-yoko01_left {
  flex-basis: 30%;
}
.top-lineup_staff-yoko01 .top-lineup_staff-yoko01_right {
flex-basis: 70%;
}
.top-lineup_staff-yoko02 {
      display: flex;
    gap: 4rem;
    align-items: center;
}
.top-lineup_staff-yoko02 .top-lineup_staff-yoko01_left {
  flex-basis: 30%;
}
.top-lineup_staff-yoko02 .top-lineup_staff-yoko01_right {
  flex-basis: 70%;
}
.top-lineup_staff-yoko01_left img {
  aspect-ratio: 1.5 / 2;
    object-fit: cover;
}
.top-lineup_staff-tate {
  display: flex;
    flex-flow: column;
    gap: 5rem;
}
.top-lineup_staff-yoko01_right {
   display: flex;
    flex-flow: column;
    gap: 2rem;
}
.slick-next, .slick-prev {
  display: none !important;
}
/*以下よりスクロールアニメーション*/
.fadeUp {
  animation-name: costcutfadeUpAnime;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes costcutfadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fadeUpTrigger {
  opacity: 0;
}





/* Instagram */
.top-instagram_back {
  background-color: var(--main-color);
}
.top-instagram_width {
  width: 70%;
  margin: 0 auto;
  padding: 10rem 0 3rem;
}
.top-instagram_yoko {
  display: flex;
  gap: 2rem;
      align-items: center;
}
.top-instagram_left {
  display: flex;
  flex-flow: column;
  gap: 4rem;
      flex-basis: 8%;
}
.top-instagram_heading {
    text-align: center;
}
.top-instagram_heading h2 {
      font-size: 4rem;
    border-bottom: solid 1px;
    display: inline-block;
    line-height: 1.5;
    padding: 0 0.8rem;
}


/* インスタセクション */
#shopify-section-template--20462457585889__1764228892071c14a1 {
background-color: var(--main-color);
}
#shopify-section-template--20462457585889__1764228892071c14a1 .page-width {
  width: 70%;
    margin: 0 auto;
    padding: 0 0 10rem;
    
}
    

/* インスタセクションここまで */



/* よくある質問 */
.top-faq_width {
  width: 70%;
  margin: 0 auto;
  padding: 10rem 0;
}
.top-faq_tate {
      display: flex;
    flex-flow: column;
    gap: 5rem;
}
.top-faq_heading {
  text-align: center;
}
.top-faq_heading h2 {
 font-size: 4rem;
    color: var(--main-color);
    border-bottom: solid 1px;
    display: inline-block;
    line-height: 1.5;
    padding: 0 0.8rem;
}
.accordion-area{
    list-style: none;
    width: 96%;
    max-width: 900px;
    margin:0 auto;
	display: flex;
	flex-flow: column;
	gap: 1.5rem;
}
.accordion-area li{
    margin: 0px 0;
}
.title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:1.5rem;
    font-weight: normal;
    padding: 3% 3% 3% 50px;
    transition: all 0.8s ease;
}
.title::before,
.title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
	transition: all 0.8s ease;
    
}
.title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
.title.close::before{
  transform: rotate(45deg);
}

.title.close::after{
  transform: rotate(-45deg);
}
.box {
    display: none;/*はじめは非表示*/
  margin:0 3% 0% 3%;
    padding: 3%;
}
.top-faq .title {
	background: var(--main-color);
	color: #fff;
	    padding: 3% 3% 3% 65px;
	    border-radius: 5px;
	font-family: auto;
	font-weight: 600;
  margin: 0;
}
.title::before, .title::after {
    background-color: #fff;
}
.title::after {
    left: 1.7rem;
}
.title::before {
    left: 1.7rem;
}
/*アコーディオンここまで*/
    @media (max-width: 765px) {
.accordion-area {
    gap: 1rem;
    padding: 0 !important;
          margin: 0 !important;
}

      
  }
/* よくある質問ここまで */



/* INFO */
.top-info {
  position: relative;
}
.top-info::before {
      position: absolute;
    content: "";
    background-image: url(/cdn/shop/files/canele-kiritori_info.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 21%;
    height: 80%;
    top: 60%;
    right: 0;
}
.top-info_back {
  background-color: var(--main-color);
}
.top-info_width {
  width: 60%;
  margin: 0 auto;
  padding: 10rem 0;
}
.top-info_tate {
 display: flex;
    flex-flow: column;
    gap: 5rem;
}
.top-info_heading {
  text-align: center;
}
.top-info_heading h2 {
 font-size: 4rem;
    color: #fff;
    border-bottom: solid 1px;
    display: inline-block;
    line-height: 1.5;
    padding: 0 0.8rem;
}
.top-info-content table th, .top-info-content table td {
  border: none;
  color: #fff;
  font-weight: 400;
}
.top-info-content table {
      table-layout: auto;
    border-collapse: initial;
    font-size: 1.8rem;
    border-style: none;
    box-shadow: none;
        display: block;
    width: 60%;
    margin: 0 auto;
}
.top-info-content table th {
  padding-right: 4rem;
}

/* INFOここまで */


.top-fixedimg01 {
  background-attachment: fixed !important;
  background-size: cover !important;
  background-position: center !important;
  height: 400px; /* 高さは必要に応じて調整 */
}
.top-fixedimg02 {
  background-attachment: fixed !important;
  background-size: cover !important;
  background-position: center !important;
  height: 650px; /* 高さは必要に応じて調整 */
  background-color: #000 !important;
    background-blend-mode: luminosity;
}

@media (max-width: 765px) {
.top-concept_width {
    width: 90%;
    margin: 0 auto;
    padding: 8rem 0;
}
.top-concept_news {
    width: 90%;
}
.top-concept_news {
    background-color: #fff;
    padding: 3rem;
}
.top-concept_content-yoko {
    display: flex;
    gap: 2rem;
    flex-flow: column;
}
.top-concept_content-button a {
    padding: 1.6rem;
    width: -webkit-fill-available;
    font-size: 1.5rem;
}
.top-concept_content-right {
  order: 0;
}
.top-concept_content-left {
  order: 1;
}
.top-concept_content-left_heading h3 {
      font-size: 1.5rem;
}
.top-concept_content-left_heading {
    gap: 1rem;
}
.top-main_logo-heading h2 p:first-child {
    font-size: 1rem;
}

.top-lineup_width {
    padding: 8rem 0;
}
.top-lineup_content {
    gap: 4rem;
}
.top-lineup_content-heading h2 {
    font-size: 3rem;
}
.top-lineup_content {
    gap: 3rem;
}

.top-lineup_tate {
    gap: 8rem;
}
.top-lineup_howtoeat {
    width: 90%;
    margin: 0 auto;
}
.top-lineup_howtoeat-width {
    padding: 2rem;
}
.top-lineup_howtoeat-tate {
    gap: 2rem;
}
.top-lineup_howtoeat-back {
    height: 86rem;
}
.top-lineup_staff-width {
    width: 90%;
    margin: 0 auto;
}
.top-lineup_staff-yoko01 {
    display: flex;
    gap: 1.5rem;
    flex-flow: column;
}
.top-lineup_staff-yoko01_left h5 {
    font-size: 2.2rem;
}
.top-lineup_staff-tate {
    gap: 4rem;
}
.top-lineup_staff-yoko02 {
    display: flex;
    gap: 2rem;
    flex-flow: column;
}
.top-lineup_staff-yoko01_right {
    gap: 1.5rem;
}
.top-instagram_width {
    width: 90%;
    margin: 0 auto;
    padding: 8rem 0 2rem;
}

.top-instagram_heading h2 {
    font-size: 3rem;
}
.top-instagram_left {
    flex-basis: 16%;
}
.top-instagram_yoko {
    gap: 1rem;
    align-items: center;
        justify-content: flex-start;
}
#shopify-section-template--20462457585889__1764228892071c14a1 .page-width {
    width: 90%;
    margin: 0 auto;
    padding: 0px 0 8rem;
}
.top-fixedimg01 {
    height: 300px;
    background-attachment: initial !important;
}
.top-faq_width {
    width: 90%;
    margin: 0 auto;
    padding: 8rem 0;
}
.top-faq_tate {
    display: flex;
    flex-flow: column;
    gap: 4rem;
}
.top-faq_heading h2 {
    font-size: 3rem;
}
.top-info_width {
    width: 90%;
    margin: 0 auto;
    padding: 8rem 0;
}
.top-info_heading h2 {
    font-size: 3rem;
}
.top-info_tate {
    gap: 3rem;
}
.top-info-content table {
    font-size: 1.8rem;
    width: -webkit-fill-available;
}
.top-info-content table th {
    padding-right: 2rem;
        line-height: 1;
}
.top-info-content table th, .top-info-content table td {
    border: none;
    color: #fff;
    font-weight: 400;
    line-height: 1.5;
        padding: 1rem;
                font-size: 1.5rem;
}
.top-fixedimg02 {
    height: 300px;
        background-attachment: initial !important;
}
.top-main .top-main_logo {
    width: 70%;
    top: 56%;
}
.top-main-logo-img {
    width: 30%;
    margin: 0 auto;
}
.top-main_logo-tate {
    gap: 1rem;
}
.top-main_logo-heading h2 {;
    gap: 1rem;
    font-size: 1.4rem;
}
.top-concept_news-list-tate {
    margin: 0;
    padding: 0;
}
.top-concept::before {
    left: -1%;
    height: 14%;
    width: 50%;

}
.top-concept_back::before {
    right: 1%;
    top: 2%;
    height: 11%;
    width: 25%;
}
.top-concept::after {
    content: "";
    background-image: url(/cdn/shop/files/re_DSC00146.png);
    background-size: contain;
    left: -1%;
    top: 30%;
    height: 9%;
    width: 33%;
}
.top-concept_back::after {
    right: 1%;
    top: 33%;
    height: 6%;
    width: 23%;
}
.top-lineup::after {
    left: 1%;
        top: -26%;
        height: 6%;
        width: 15%;
        display: none;
} 
.top-lineup::before {
    right: 1%;
    top: -2%;
    height: 5%;
    width: 43%;
}
.top-lineup_staff-yoko01_left img {
    aspect-ratio: 2 / 2;
    object-fit: cover;
}
.top-lineup .slick-dots li {
      width: 6px;
    height: 6px;
}
.top-info::before {
    width: 35%;
    height: 45%;
    top: 80%;
    right: 0;
}
#shopify-section-template--20462457585889__custom_liquid_KYtnmx .top-video video {
    height: auto !important;
}
.top-lineup_staff-yoko01_right h5 {
  font-size: 2.2rem;
    line-height: 1.3;
}
}














/* ================================================= */
/* 以下よりこだわりページCSS */
/* ================================================= */
/* #shopify-section-template--20462457749729__main .nanacanele-main-page .tcs-page-title {
display: none !important;
} */
.commitment-top_back {
  background: var(--main-color);
}
.commitment-top_width {
  padding: 15rem 0 7rem;
    width: 80%;
    margin: 0 auto;
}
.commitment-top_tate {
      display: flex;
    flex-flow: column;
    gap: 4rem;
}
.commitment-top_tate h2 {
      line-height: 1.6;
          font-family: "source-han-serif-variable", sans-serif;
}
.commitment-top_tate p {
  color: #fff;
      font-family: "source-han-serif-variable", sans-serif;
}
.commitment-content_back {
  padding: 8rem 0;
}
.commitment-content_yoko {
  display: flex;
  gap: 6rem;
  width: 90%;
    justify-content: space-between;
    align-items: center;
}
.commitment-content_tate {
  display: flex;
  flex-flow: column;
  gap: 7rem;
}
.commitment-content_right h3 {
  color: var(--main-color);
  text-align: center;
      font-family: "source-han-serif-variable", sans-serif;
}
.commitment-content_right {
  display: flex;
  flex-flow: column;
  gap: 2rem;
}
.commitment-content_left {
  flex-basis: 55%;
}
.commitment-content_right {
flex-basis: 45%;
}
.commitment-content_haco02, .commitment-content_haco04 {
margin: auto 0 auto auto;
}
.commitment-content_haco02 .commitment-content_left {
  order: 1;
}
.commitment-content_haco02 .commitment-content_right {
  order: 0;
}
.commitment-content_haco04 .commitment-content_left {
  order: 1;
}
.commitment-content_haco04 .commitment-content_right {
  order: 0;
}
.commitment-top_back {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.commitment-content_img img {
  margin: 0;
}
.page-commitment .main-page-title {
  display: none !important;
}
#shopify-section-template--20462457749729__main .nanacanele-main-page {
    padding-top: 0rem !important;
}

@media (max-width: 765px) {
.commitment-top_back {
      background-image: url(/cdn/shop/files/kodawari_back-mb.jpg?) !important;
}
  .commitment-top_tate h2 {
    line-height: 1.4;
    font-family: "source-han-serif-variable", sans-serif;
}
.commitment-content_yoko {
    display: flex;
    gap: 2rem;
    width: 90%;
    margin: 0 auto;
    flex-flow: column;
}
.commitment-content_haco02, .commitment-content_haco04 {
    margin: 0 auto;
}
.commitment-content_haco02 .commitment-content_right {
    order: initial;
}
.commitment-content_haco02 .commitment-content_left {
    order: initial;
}
.commitment-content_haco04 .commitment-content_right {
    order: initial;
}
.commitment-content_haco04 .commitment-content_left {
    order: initial;
}
.commitment-content_right {
    gap: 1rem;
}
.commitment-top_tate {
    gap: 3rem;
}
.commitment-top_width {
    padding: 5rem 0 35rem;
    width: 90%;
    margin: 0 auto;
}
}
/* ================================================= */
/* こだわりページCSSここまで */
/* ================================================= */





/* ================================================= */
/* 以下より新着情報一覧 */
/* ================================================= */

.full-unstyled-link {
   color: var(--main-color);
}
.lorenzo_main-blog .article-card__excerpt {
color: var(--main-color);
}
.article-card__info {
    color: #747272;
}

/* ================================================= */
/* 新地着情報一覧ここまで */
/* ================================================= */




/* ================================================= */
/* 以下より新着情報詳細ページ */
/* ================================================= */
@media (max-width: 765px) {
.lorenzo_article-template {
    padding: 0 !important;
}
.lorenzo_article-template {
    width: 90% !important;
    margin-top: 5rem !important;
}
.lorenzo_article-template {
    padding: 8rem 0;
}
.article-template__hero-medium {
    height: auto !important;
    aspect-ratio: 2 / 1.5 !important;
}
}
/* ================================================= */
/* 新地着情報詳細ページここまで */
/* ================================================= */