.c-breadcrumbs {
  margin-bottom: 100px;
  padding-top: 40px;

  .c-breadcrumbs__list {
    display: flex;
    align-items: center;
    gap: 5px;  
  }

  .c-breadcrumbs__item {
    display: flex;
    align-items: center;
    gap: 5px;

    &:not(:last-child) {
      &::after {
        content: '';
        display: inline-block;
        background-image: url('../../../img/common/icon/arrow_right_gray.svg');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: 0 0;
        width: 4px;
        height: 7px;
        min-width: 4px;
      }  
    }
  }

  .c-breadcrumbs__link {
    display: flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
  }

  .c-breadcrumbs__link--home {
    min-width: 62px;
  }

  .c-breadcrumbs__text {
    font-size: 14px;
    letter-spacing: 1.4px;
    color: var(--color-text);
  }

  .c-breadcrumbs__arrow {
    display: inline-flex;
    align-items: center;
  }
}

.c-breadcrumb__section {
  margin-bottom: 50px;
  padding: 20px 0 0 0;
}

/* TABLET */
@media screen and (max-width: 1024px) {
  .c-breadcrumbs {
    padding: 40px var(--device-tab-padding) 0 var(--device-tab-padding);
    overflow-x: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;

    &::-webkit-scrollbar{
      display: none;
    }

    .c-breadcrumbs__item {
      white-space: nowrap;
    }

    .c-breadcrumb__text {
      white-space: nowrap;
    }
  }
}

/* SP */
@media screen and (max-width: 768px) {
  .c-breadcrumbs {
    margin: 30px 0 70px 0;
    padding: 0 0 0 30px;
  }
}