@charset "UTF-8";
:root {
  --ff-zen-kaku-gothic-new: "Zen Kaku Gothic New";
  --ff-zen-old-mincho: "Zen Old Mincho";
  --ff-helvetica-lt-pro: "helvetica-lt-pro";

  --sec-tittle-font: var(--ff-helvetica-lt-pro), var(--ff-zen-kaku-gothic-new), sans-serif;
}

body:has(.brandLogo[data-brand="total"]) {
  font-family: var(--ff-zen-kaku-gothic-new), sans-serif;
}


body:has(.brandLogo[data-brand="total"]) .naviList .nav-list .naviList-inner .naviList-inner-ttl {
  font-weight: 300;
  text-transform: uppercase;
}

body:has(.brandLogo[data-brand="total"]) .menu-contents-ttl{
  text-transform: uppercase;
  font-weight: 300;
  font-size: 1.4rem;
}

body:has(.brandLogo[data-brand="total"]) .guide-perContents > div .category-serviceTtl{
  text-transform: uppercase;
  font-weight: 300;
}


@media screen and (min-width: 768px) {

  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList{
    width: 100%;
    margin-right: 0;
  }

  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px 40px;
  }

  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList li{
    margin-top: 0;
  }

  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList li:nth-child(3n + 1),
  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList li:nth-child(3n - 1){
    width: auto;
    margin-right: 0;
  }

  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList li:nth-child(-n + 3),
  body:has(.brandLogo[data-brand="total"]) .navi-JewelryList .navi-catgoryList .cardUnit-categoryList li:nth-child(3n + 1){
    margin-top: 0;
  }

}


body:has(.brandLogo[data-brand="total"]) .fixedNews .fixedNews_inner p {
  font-family: var(--ff-zen-kaku-gothic-new), sans-serif;
}

/* @media screen and (min-width: 768px) {
  @media only screen and (max-width: 1400px) {
    body:has(.brandLogo[data-brand="total"]) .naviList .nav-list {
        padding: 0 5%;
    }
  }
  @media only screen and (max-width: 1220px) {
    body:has(.brandLogo[data-brand="total"]) .naviList .nav-list {
        padding: 0 2%;
    }
  }
} */