@charset "UTF-8";
/*--------------------
共通設定
----------------------*/
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

a {
  text-decoration: none;
  color: #171717;
  transition: .4s; }
  a:hover {
    color: #171717; }
  a:visited {
    color: transparent; }
  a.disabled {
    pointer-events: none;
    text-decoration: none; }

ul, ol {
  list-style: none; }

.pc {
  display: block; }
  @media screen and (max-width: 1080px) {
    .pc {
      display: none; } }

.sp {
  display: none; }
  @media screen and (max-width: 1080px) {
    .sp {
      display: block; } }

p {
  margin: 0;
  padding: 0; }

/*--------------------- ここから ----------------------*/
#fs_ProductCategory h1.ttl {
  text-align: center; }

.category-wrapper {
  max-width: 980px;
  margin: 0 auto 5%;
  text-align: left; }
  .category-wrapper .txt {
    margin: 48px auto;
    width: fit-content;
    max-width: 90%; }
    .category-wrapper .txt h1 {
      font-weight: 400;
      font-size: 1.0em;
      line-height: 2.0;
      margin-bottom: 1.5em; }
      @media screen and (max-width: 600px) {
        .category-wrapper .txt h1 {
          font-size: 3.0vw; } }
    .category-wrapper .txt p {
      font-size: .9em;
      line-height: 2.0; }
      @media screen and (max-width: 600px) {
        .category-wrapper .txt p {
          font-size: 3.0vw;
          text-align: justify-all; } }
  .category-wrapper .subttl {
    font-size: .9em;
    margin-bottom: .5em;
    font-weight: 600; }
    @media screen and (max-width: 600px) {
      .category-wrapper .subttl {
        font-size: 2.8vw; } }
  .category-wrapper .rank_box {
    margin: 1.0em auto; }
  .category-wrapper .feature {
    margin: 10% auto; }
    @media screen and (max-width: 1080px) {
      .category-wrapper .feature {
        width: 95%; } }
    .category-wrapper .feature .subttl {
      margin-left: 1%; }
    .category-wrapper .feature ul {
      display: flex;
      align-items: stretch;
      justify-content: flex-start;
      flex-wrap: wrap; }
      .category-wrapper .feature ul li {
        width: calc(100%/2 - 2%);
        margin: 1% 1% 5%; }
        .category-wrapper .feature ul li a {
          display: block; }
          .category-wrapper .feature ul li a h3 {
            width: 95%;
            font-weight: 400;
            font-size: 0.8em;
            margin: 1.5em auto; }
            @media screen and (max-width: 600px) {
              .category-wrapper .feature ul li a h3 {
                font-size: 2.8vw; } }
          .category-wrapper .feature ul li a p {
            width: 95%;
            margin: 0 auto;
            font-size: 0.8em;
            line-height: 1.8; }
            @media screen and (max-width: 600px) {
              .category-wrapper .feature ul li a p {
                font-size: 2.8vw; } }
    .category-wrapper .feature .ranking_item {
      counter-reset: rank;
      margin-bottom: 56px; }
      @media screen and (max-width: 600px) {
        .category-wrapper .feature .ranking_item {
          margin-bottom: 64px; } }
      .category-wrapper .feature .ranking_item .contents {
        position: relative;
        margin-right: 8px;
        overflow: hidden;
        /*border: 1px solid #f2f2f2;*/ }
        @media screen and (max-width: 1080px) {
          .category-wrapper .feature .ranking_item .contents {
            margin-right: 8px; } }
        .category-wrapper .feature .ranking_item .contents::before {
          counter-increment: rank;
          content: counter(rank);
          position: absolute;
          font-size: .9em;
          left: 8px;
          top: 7px;
          line-height: 1.0;
          color: #ffffff;
          z-index: +1; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents::before {
              font-size: 2.5vw;
              left: 8px;
              top: 6px; } }
        .category-wrapper .feature .ranking_item .contents::after {
          content: "";
          width: 60px;
          height: 60px;
          transform: rotate(45deg);
          top: -30px;
          left: -30px;
          position: absolute;
          background: #ec6800; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents::after {
              width: 52px;
              height: 52px;
              top: -26px;
              left: -26px; } }
        .category-wrapper .feature .ranking_item .contents:nth-child(10)::before {
          left: 4px; }
        .category-wrapper .feature .ranking_item .contents a {
          position: relative;
          display: block; }
          .category-wrapper .feature .ranking_item .contents a img {
            border: 1px solid #f2f2f2; }
        .category-wrapper .feature .ranking_item .contents p, .category-wrapper .feature .ranking_item .contents h2 {
          font-size: min(0.8em, 2.8vw); }
          .category-wrapper .feature .ranking_item .contents p.name, .category-wrapper .feature .ranking_item .contents h2.name {
            padding-top: 10px;
            position: relative;
            height: calc(1.7em * 2 + 10px);
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2; }
          .category-wrapper .feature .ranking_item .contents p.price, .category-wrapper .feature .ranking_item .contents h2.price {
            position: relative; }
        .category-wrapper .feature .ranking_item .contents.legatolargo a::after, .category-wrapper .feature .ranking_item .contents.l_shoulder a::after, .category-wrapper .feature .ranking_item .contents.l_ruck a::after, .category-wrapper .feature .ranking_item .contents.l_tote a::after, .category-wrapper .feature .ranking_item .contents.l_goods a::after {
          position: absolute;
          content: "";
          top: 10px;
          right: 8px;
          background: url("https://carrot.itembox.design/item/images/2025/SVG/tag_legato.svg?t=250901");
          background-repeat: no-repeat;
          width: 77px;
          height: 22px;
          background-size: contain; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents.legatolargo a::after, .category-wrapper .feature .ranking_item .contents.l_shoulder a::after, .category-wrapper .feature .ranking_item .contents.l_ruck a::after, .category-wrapper .feature .ranking_item .contents.l_tote a::after, .category-wrapper .feature .ranking_item .contents.l_goods a::after {
              width: 53px;
              height: 15px; } }
        .category-wrapper .feature .ranking_item .contents.anello a::after, .category-wrapper .feature .ranking_item .contents.a_tote a::after, .category-wrapper .feature .ranking_item .contents.a_ruck a::after, .category-wrapper .feature .ranking_item .contents.a_shoulder a::after, .category-wrapper .feature .ranking_item .contents.a_crossbody a::after, .category-wrapper .feature .ranking_item .contents.a_goods a::after {
          position: absolute;
          content: "";
          top: 10px;
          right: 8px;
          background: url("https://carrot.itembox.design/item/images/2025/SVG/tag_anello.svg?t=250901");
          background-repeat: no-repeat;
          width: 55px;
          height: 17px;
          background-size: contain; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents.anello a::after, .category-wrapper .feature .ranking_item .contents.a_tote a::after, .category-wrapper .feature .ranking_item .contents.a_ruck a::after, .category-wrapper .feature .ranking_item .contents.a_shoulder a::after, .category-wrapper .feature .ranking_item .contents.a_crossbody a::after, .category-wrapper .feature .ranking_item .contents.a_goods a::after {
              width: 40px;
              height: 11px;
              top: 10px;
              right: 6px; } }
        .category-wrapper .feature .ranking_item .contents.grande a::after, .category-wrapper .feature .ranking_item .contents.g_ruck a::after, .category-wrapper .feature .ranking_item .contents.g_shoulder a::after, .category-wrapper .feature .ranking_item .contents.g_tote a::after, .category-wrapper .feature .ranking_item .contents.g_goods a::after {
          position: absolute;
          content: "";
          top: 10px;
          right: 8px;
          background: url("https://carrot.itembox.design/item/images/2025/SVG/tag_grande.svg?t=250901");
          background-repeat: no-repeat;
          width: 76px;
          height: 30px;
          background-size: contain; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents.grande a::after, .category-wrapper .feature .ranking_item .contents.g_ruck a::after, .category-wrapper .feature .ranking_item .contents.g_shoulder a::after, .category-wrapper .feature .ranking_item .contents.g_tote a::after, .category-wrapper .feature .ranking_item .contents.g_goods a::after {
              width: 54px;
              height: 18px;
              top: 13px;
              right: 8px; } }
        .category-wrapper .feature .ranking_item .contents.fulcro a::after, .category-wrapper .feature .ranking_item .contents.f_ruck a::after, .category-wrapper .feature .ranking_item .contents.f_shoulder a::after, .category-wrapper .feature .ranking_item .contents.f_boston a::after, .category-wrapper .feature .ranking_item .contents.f_tote a::after, .category-wrapper .feature .ranking_item .contents.f_body a::after {
          position: absolute;
          content: "";
          top: 10px;
          right: 8px;
          background: url("https://carrot.itembox.design/item/images/2025/SVG/tag_fulcro.svg?t=250901");
          background-repeat: no-repeat;
          width: 73px;
          height: 20px;
          background-size: contain; }
          @media screen and (max-width: 600px) {
            .category-wrapper .feature .ranking_item .contents.fulcro a::after, .category-wrapper .feature .ranking_item .contents.f_ruck a::after, .category-wrapper .feature .ranking_item .contents.f_shoulder a::after, .category-wrapper .feature .ranking_item .contents.f_boston a::after, .category-wrapper .feature .ranking_item .contents.f_tote a::after, .category-wrapper .feature .ranking_item .contents.f_body a::after {
              width: 62px;
              height: 15px;
              top: 11px;
              right: -9px; } }

.feature-box {
  margin: 0 auto 5%;
  text-align: left; }
  @media screen and (max-width: 1080px) {
    .feature-box {
      width: 95%; } }
  .feature-box h2 {
    font-size: 1.0em;
    margin-bottom: 1.5em; }
    @media screen and (max-width: 600px) {
      .feature-box h2 {
        font-size: 3.0vw; } }
  .feature-box .articles__slide .contents {
    width: calc(100%/3 + 1%);
    max-width: 300px;
    padding-right: 3%;
    margin: 0; }
    .feature-box .articles__slide .contents h3 {
      font-weight: 400;
      font-size: min(0.8em, 2.8vw);
      margin-top: 0.5em; }

.fs-c-subgroup.center {
  margin: 24px auto;
  max-width: 980px; }
