@import url("https://fonts.googleapis.com/css2?family=Radley:ital@0;1&display=swap");
.container-inner_category {
  background: rgba(238, 238, 238, 0.5);
  padding: 2rem;
  margin-bottom: 10rem; }
  @media only screen and (max-width: 1024px) {
    .container-inner_category {
      margin-bottom: 6rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner_category {
      margin-bottom: 2rem;
      padding: 1rem; } }

  .container-inner_category ul {
    max-width: 124rem;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; }
    .container-inner_category ul li {
      background: #fff;
      border-radius: 15rem;
      padding: 0 1.5rem;
      height: 3.6rem;
      font-size: 1.3rem;
      display: flex;
      justify-content: center;
      align-items: center;
      border: .3rem solid #fff;
      margin: .5rem .5rem;
      cursor: pointer; }
      @media only screen and (max-width: 767px) {
        .container-inner_category ul li {
          padding: 0 1rem;
          height: 3rem;
          font-size: 1rem;
          border-width: .2rem;
          margin: .3rem;
          min-width: 6rem; } }
      .container-inner_category ul li:hover {
        font-weight: 700;
        border-color: #eeeeee; }
      .container-inner_category ul li.on {
        font-weight: 700;
        border-color: #ccc; }
      .container-inner_category ul li.off {
        color: rgba(102, 102, 102, 0.5);
        cursor: default; }
        .container-inner_category ul li.off:hover {
          font-weight: 400; }
      .container-inner_category ul li.all {
        width: 13rem;
        background: #ccc;
        border-color: #ccc;
        color: #fff; }
        @media only screen and (max-width: 767px) {
          .container-inner_category ul li.all {
            width: auto; } }
        .container-inner_category ul li.all:hover {
          color: #fff; }
.container-inner_aiueo {
  background: rgba(238, 238, 238, 0.5);
  padding: 2rem;
  margin-bottom: 10rem; }
  @media only screen and (max-width: 1024px) {
    .container-inner_aiueo {
      margin-bottom: 6rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner_aiueo {
      margin-bottom: 4rem;
      padding: 1rem; } }

  .container-inner_aiueo ul {
    max-width: 124rem;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; }
    .container-inner_aiueo ul li {
      background: #fff;
      border-radius: 15rem;
      padding: 0 1.5rem;
      height: 3.6rem;
      font-size: 1.3rem;
      display: flex;
      justify-content: center;
      align-items: center;
      border: .3rem solid #fff;
      margin: .5rem;
      cursor: pointer; }
      @media only screen and (max-width: 767px) {
        .container-inner_aiueo ul li {
          padding: 0 1rem;
          font-size: 1rem;
          height: 3rem;
          border-width: .2rem;
          min-width: 6rem;
          margin: .3rem; } }
      .container-inner_aiueo ul li:hover {
        font-weight: 700;
        border-color: #eeeeee; }
      .container-inner_aiueo ul li.on {
        font-weight: 700;
        border-color: #ccc; }
      .container-inner_aiueo ul li.off {
        color: rgba(102, 102, 102, 0.5);
        cursor: default; }
        .container-inner_aiueo ul li.off:hover {
          font-weight: 400; }
      .container-inner_aiueo ul li.all {
        width: 13rem;
        background: #ccc;
        border-color: #ccc;
        color: #fff; }
        @media only screen and (max-width: 767px) {
          .container-inner_aiueo ul li.all {
            width: auto; } }
        .container-inner_aiueo ul li.all:hover {
          color: #fff; }
.container-inner .section-brands {
  margin-bottom: 6rem;
  display: none; }
  @media only screen and (max-width: 767px) {
    .container-inner .section-brands {
      margin-bottom: 3rem; } }
  .container-inner .section-brands.active {
    display: block; }
  .container-inner .section-brands_ttl {
    font-size: 2.4rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 4rem; }
    @media only screen and (max-width: 767px) {
      .container-inner .section-brands_ttl {
        font-size: 1.8rem;
        margin-bottom: 2rem; } }
    .container-inner .section-brands_ttl:before, .container-inner .section-brands_ttl:after {
      content: "";
      width: 3rem;
      height: .2rem;
      background: #eeeeee;
      margin: 0 1rem; }
.container-inner_brands {
  margin: 0 3rem 5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start; }
  @media only screen and (max-width: 1024px) {
    .container-inner_brands {
      margin: 0 2rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner_brands {
      margin: 0 1rem; } }

  .container-inner_brands .article-brand {
    width: 18%;
    margin: 0 1% 6rem;
    letter-spacing: .1rem;
    position: relative; }
    @media only screen and (max-width: 1024px) {
      .container-inner_brands .article-brand {
        width: 31.333%; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner_brands .article-brand {
      width: 46%;
      margin: 0 2% 3rem; } }

    .container-inner_brands .article-brand > a {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 10; }
    .container-inner_brands .article-brand:hover .article-brand_fig-bg {
      transform: scale(1.2, 1.2); }
    .container-inner_brands .article-brand_fig {
      overflow: hidden;
      position: relative; }
      .container-inner_brands .article-brand_fig:after {
        content: "";
        width: 100%;
        display: block;
        padding-top: 100%; }
      .container-inner_brands .article-brand_fig-bg {
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: cover;
        background-color: #eeeeee;
        position: absolute;
        width: 100%;
        height: 100%;
        transition: .5s all; }
    .container-inner_brands .article-brand_ttl {
      font-size: 1.8rem;
      line-height: 1.3;
      padding: 1rem 0; }
      @media only screen and (max-width: 767px) {
        .container-inner_brands .article-brand_ttl {
          font-size: 1.6rem; } }
    .container-inner_brands .article-brand p {
      font-size: 1.2rem;
      line-height: 1.3;
      padding-bottom: 1rem; }
      @media only screen and (max-width: 767px) {
        .container-inner_brands .article-brand p {
          font-size: 1rem; } }
    .container-inner_brands .article-brand dl {
      border-top: 0.1rem solid #eeeeee;
      display: flex;
      justify-content: space-between;
      font-size: 1rem;
      font-weight: 700;
      padding: .8rem 0; }
      @media only screen and (max-width: 767px) {
        .container-inner_brands .article-brand dl {
          font-size: .9rem; } }
      .container-inner_brands .article-brand dl dt {
        flex-shrink: 0;
        padding-right: 1rem;
        color: #666666; }
        @media only screen and (max-width: 767px) {
          .container-inner_brands .article-brand dl dt {
            padding-right: .5rem; } }
      .container-inner_brands .article-brand dl dd {
        width: 100%; }
  .container-inner_brands.brands-ranking .article-brand {
    padding-top: 3rem; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(1):after {
      content: "1"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(1):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(2):after {
      content: "2"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(2):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(3):after {
      content: "3"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(3):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(4):after {
      content: "4"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(4):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(5):after {
      content: "5"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(5):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(6):after {
      content: "6"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(6):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(7):after {
      content: "7"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(7):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(8):after {
      content: "8"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(8):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(9):after {
      content: "9"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(9):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(10):after {
      content: "10"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(10):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(11):after {
      content: "11"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(11):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(12):after {
      content: "12"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(12):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(13):after {
      content: "13"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(13):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(14):after {
      content: "14"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(14):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(15):after {
      content: "15"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(15):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(16):after {
      content: "16"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(16):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(17):after {
      content: "17"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(17):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(18):after {
      content: "18"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(18):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(19):after {
      content: "19"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(19):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(20):after {
      content: "20"; }
    .container-inner_brands.brands-ranking .article-brand:nth-of-type(20):before {
      content: "No."; }
    .container-inner_brands.brands-ranking .article-brand:after, .container-inner_brands.brands-ranking .article-brand:before {
      content: "";
      width: 50%;
      top: 0;
      position: absolute;
      line-height: 1;
      color: #999124;
      font-weight: 600; }
    .container-inner_brands.brands-ranking .article-brand:after {
      right: 0;
      text-align: left;
      font-size: 2rem; }
    .container-inner_brands.brands-ranking .article-brand:before {
      left: 0;
      text-align: right;
      font-size: 1.2rem;
      padding-top: .6rem; }
.container-inner .section-products {
  position: relative;
  background: rgba(238, 238, 238, 0.5);
  padding: 8rem 2rem 0; }
  .container-inner .section-products .container-inner_box {
    margin-bottom: 0 !important; }
  @media only screen and (max-width: 1024px) {
    .container-inner .section-products {
      padding: 6rem 2rem 2rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner .section-products {
      padding: 2rem 0 1rem; } }

  .container-inner .section-products_header {
    text-align: center;
    padding-bottom: 6rem; }
    @media only screen and (max-width: 1024px) {
      .container-inner .section-products_header {
        padding-bottom: 4rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner .section-products_header {
      padding-bottom: 2.5rem; } }

    .container-inner .section-products_header-ttl {
      font-size: 3.6rem;
      line-height: 1.3;
      padding-bottom: .5rem; }
      @media only screen and (max-width: 1024px) {
        .container-inner .section-products_header-ttl {
          font-size: 3.2rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner .section-products_header-ttl {
      font-size: 2.4rem; } }

      .container-inner .section-products_header-ttl span {
        display: block;
        font-size: 2rem; }
        @media only screen and (max-width: 1024px) {
          .container-inner .section-products_header-ttl span {
            font-size: 1.8rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner .section-products_header-ttl span {
      font-size: 1.4rem; } }

    .container-inner .section-products_header-en {
      font-size: 1.6rem;
      font-weight: 600;
      letter-spacing: .1rem; }
      @media only screen and (max-width: 1024px) {
        .container-inner .section-products_header-en {
          font-size: 1.8rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .container-inner .section-products_header-en {
      font-size: 1.4rem; } }