.l-lower-content-items {
  overflow: hidden;
}

.p-price {
  display: flex;
  border: 1px dotted #01a273;
  margin-top: 20px;
  margin-bottom: 5px;

  & .p-item01 {
    text-align: center;
    padding: 13px 20px;
    width: calc(100% / 3);
    letter-spacing: 0.05em;

    &:not(:last-child) {
      border-right: 1px dotted #01a273;
    }

    &.plan_reccommend {
      position: relative;
      background: #e5f6f1;

      &::after {
        content: "";
        display: inline-block;
        background-color: #FFC50E;
        clip-path: polygon(100% 0, 100% 50%, 100% 100%, 50% 50%, 0% 100%, 0% 0%);
        height: 50px;
        top: -7.5px;
        right: 10px;
        position: absolute;
        width: 35px;
      }
    }
  }

  & .p-heading01 {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 13px;
    color: #555;
  }

  & .p-text01 {
    font-size: 18px;
    line-height: 1;
    margin-bottom: 5px;

    & .big {
      color: #01a273;
      font-size: 30px;
      font-weight: 700;
      letter-spacing: -0.02em;
    }
  }

  & .p-text02 {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.01em;
    font-weight: 400;
  }

  & .p-text03 {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.01em;
    margin: 18px 0 5px 0;
  }
}

.p-price-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.p-plan-info-trigger {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: #01a273;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
  cursor: pointer;
}

.p-plan-info-trigger:hover {
  opacity: 0.7;
}

.p-price-footer .p-price-note {
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .p-plan-info-trigger,
  .p-price-footer .p-price-note {
    font-size: 12px;
  }
}

/* ============================================================
 * 最低利用期間モーダル
 * ============================================================ */
.p-plan-info-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.p-plan-info-modal.is-show {
  opacity: 1;
  pointer-events: auto;
}

.p-plan-info-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(2px);
  cursor: pointer;
}

.p-plan-info-modal__content {
  position: relative;
  background: #fff;
  width: 90%;
  max-width: 520px;
  padding: 40px 30px 30px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  transform: translateY(20px);
  transition: transform 0.3s ease;
  max-height: 90vh;
  overflow-y: auto;
}

.p-plan-info-modal.is-show .p-plan-info-modal__content {
  transform: translateY(0);
}

.p-plan-info-modal__close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  color: #aaa;
  cursor: pointer;
  padding: 5px;
}

.p-plan-info-modal__close:hover {
  color: #333;
}

.p-plan-info-modal__heading {
  font-size: 18px;
  font-weight: 700;
  color: #01a273;
  margin-bottom: 16px;
}

.p-plan-info-modal__body {
  font-size: 14px;
  line-height: 1.7;
}

.p-plan-info-modal__lead {
  margin-bottom: 16px;
}

.p-plan-info-modal__example {
  margin-top: 18px;
  padding: 14px 16px;
  background: #f4fbf9;
  border-radius: 8px;
}

.p-plan-info-modal__example-title {
  font-weight: 700;
  margin-bottom: 4px;
}

.p-plan-info-modal__example-body {
  margin: 0;
}

.p-plan-info-modal__note {
  font-size: 12px;
  color: #737373;
  margin-top: 16px;
}

.p-price-note {
  text-align: right;
  font-size: 14px;
  color: #737373;
  margin-bottom: 20px;
  font-weight: 500;
}

.p-price_item-list {
  padding-bottom: 0;

  & .p-text01 {
    font-size: 12px;

    .big {
      font-size: 20px;
      color: #01a273;
      font-weight: 700;
      letter-spacing: -0.02em;
    }
  }
}

@media(max-width: 768px) {
  .p-price {
    margin-top: 10px;
    margin-bottom: 5px;

    & .p-item01 {
      padding: 20px 0 12px;
      letter-spacing: 0;

      &.plan_reccommend {
        &::after {
          clip-path: polygon(100% 0, 100% 50%, 100% 100%, 50% 70%, 0% 100%, 0% 0%);
          height: 25px;
          width: 16px;
          top: -5px;
          right: 5px;
        }
      }
    }

    & .p-heading01 {
      font-size: 14px;
      margin-bottom: 16px;
      line-height: 1.5;
    }

    & .p-text01 {
      font-size: 11px;
      letter-spacing: -0.01em;

      & .big {
        font-size: 18px;
        letter-spacing: -0.02em;
      }
    }

    & .p-text02 {
      font-size: 10px;
      letter-spacing: 0;
    }

    & .p-text03 {
      font-size: 10px;
      margin-top: 10px;
    }
  }

  .p-price_item-list {
    padding-bottom: 5px;

    & .p-text01 {
      font-size: 11px;

      .big {
        font-size: 18px;
        color: #01a273;
        font-weight: 700;
        letter-spacing: -0.02em;
      }
    }
  }
}

.p-items {
  & .l-inner {
    max-width: 1250px;
    padding: 0 40px 40px;
  }

  & .list01 {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 50px 0;
  }

  & .list02 {
    margin-bottom: 5px;
  }

  & .item01 {
    width: 31.5%;
    background-color: #F6F6F6;
  }

  & .item02 {
    position: relative;
    display: flex;
    justify-items: start;
    align-items: center;
    gap: 7.5px;

    &:not(:last-child) {
      margin-bottom: 5px;
    }
  }

  & .wrap00 {
    width: 100%;
    height: auto;
    aspect-ratio: 313/204;
    margin-bottom: 15px;

    >a:hover {
      opacity: 0.8;
    }
  }

  & .wrap01 {
    display: flex;
    flex-direction: column;
    gap: 10px 0;
  }

  .content_pd {
    padding: 0 12px 20px 12px;
    box-sizing: border-box;
  }

  & .title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    padding: 0;
    margin-bottom: 12.5px;
  }

  & .text01 {
    font-size: 15px;
    line-height: 1;
    letter-spacing: 0.025em;
  }

  & .text02 {
    font-size: 14px;
    letter-spacing: 0.05em;

    & span {
      color: #01a273;
      font-weight: 700;
      letter-spacing: 0.1em;
    }
  }

  & .text05 {
    font-size: 14px;
    line-height: 1.4;
  }

  & .p-item__product-item-link {
    flex: 1;

    .p-item__product-item-tag-inner {
      padding-right: 0;
      padding: 10px 0;

      &::before {
        display: none;
      }
    }
  }

  & .link01 {
    background: #01a273;
    color: white;
    text-align: center;
    border-radius: 30px;
    padding-top: 15px;
    padding-bottom: 15px;
    font-weight: 600;
    letter-spacing: 0.025em;
    display: block;
    line-height: 1.4;
    height: auto;
    width: 100%;

  }

  & .img01 {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .p-price {
    margin-bottom: 25px;

    & .p-item01 {
      padding: 17.5px 4px;

      &.plan_reccommend {
        &::after {
          clip-path: polygon(100% 0, 100% 50%, 100% 100%, 50% 55%, 0% 100%, 0% 0%);
          height: 34px;
          top: -7.5px;
          right: 6px;
          width: 20px;
        }
      }
    }

    & .p-heading01 {
      margin-bottom: 10px;
    }

    & .p-text01 {
      font-size: 12px;
      margin-bottom: 10px;

      & .big {
        font-size: 18px;
      }
    }

    & .p-text02 {
      font-size: 10px;
      letter-spacing: 0;
    }
  }
}

@media(max-width: 1168px) {
  .p-items {
    & .item01 {
      width: 48%;
    }
  }
}

@media(max-width: 768px) {
  .p-items {
    padding-top: 0;

    & .l-inner {
      padding: 0 0 40px;

      & .p-items-category {
        padding: 0 20px 0;
      }
    }

    & .list01 {
      gap: 40px 0;
      width: 100%;
      margin-top: 30px;
    }

    & .list02 {
      margin-bottom: 5px;
    }

    & .item01 {
      width: 48%;
    }

    & .item02 {
      gap: 5px;

      &::before {
        font-size: 10px;
      }

      &:not(:last-child) {
        margin-bottom: 7.5px;
      }
    }

    & .wrap00 {
      margin-bottom: 12.5px;
    }

    & .wrap01 {
      gap: 10px 0;
    }

    & .title {
      font-size: 14px;
      padding: 0;
      padding-bottom: 2.5px;
      margin-bottom: 7px;
    }

    & .text01 {
      font-size: 14px;
      line-height: 1.4;
    }

    & .text02 {
      font-size: 12px;
      letter-spacing: 0.025em;
    }

    & .text05 {
      font-size: 12px;
      line-height: 1.4;
    }

    & .p-item__product-item-link {
      width: 100%;

      .p-item__product-item-tag-inner {
        padding-right: 0;
        font-size: 12px;
        padding: 8px 0;

        &::before {
          display: none;
        }
      }
    }

    & .link01 {
      font-size: 14px;
      width: 100%;
      margin: 0 auto;
      max-width: 400px;
    }

    .p-price {
      border-bottom: 2px dotted #01a273;
      margin-bottom: 20px;
      padding-bottom: 10px;

      & .p-item01 {
        padding: 13px 0px;
        letter-spacing: 0;

        &.plan_reccommend {
          &::after {
            clip-path: polygon(100% 0, 100% 50%, 100% 100%, 50% 70%, 0% 100%, 0% 0%);
            height: 25px;
            width: 16px;
            top: -5px;
            right: 5px;
          }
        }
      }

      & .p-heading01 {
        font-size: 12px;
        margin-bottom: 7.5px;
      }

      & .p-text01 {
        font-size: 11px;
        letter-spacing: -0.02em;
        margin-bottom: 5px;

        & .big {
          font-size: 17px;
        }
      }

      & .p-text02 {
        font-size: 10px;
        letter-spacing: 0;
      }
    }
  }
}

.p-item {
  background: white;
  padding: 25px 0 30px;

  & .inner {
    display: flex;
    justify-content: space-between;
    align-items: start;
  }

  & .p-item__grid-layout {
    display: grid;
    grid-template-columns: 60% 36%;
    grid-template-rows: auto 1fr;
    justify-content: space-between;
    align-items: start;
    row-gap: 0;
  }

  & .p-item__grid-layout .left {
    width: 100%;
  }

  & .p-item-title {
    position: relative;
    padding-left: 16px;
    border-left: 5px solid #01a273;
    line-height: 1.4;
    color: #545454;
    margin-top: 0;
    margin-bottom: 20px;
    padding-top: 0;
    padding-bottom: 0 !important;
    letter-spacing: 0 !important;
    border-bottom: none;
  }

  & .grid-right-wrapper {
    grid-column: 2;
    grid-row: 1 / span 2;
    position: sticky;
    top: 100px;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    scrollbar-width: none;
    /* Firefox */
  }

  & .grid-right-wrapper::-webkit-scrollbar {
    display: none;
    /* Chrome/Safari */
  }

  & .grid-gallery {
    grid-column: 1;
    grid-row: 1;
  }

  & .grid-details {
    grid-column: 1;
    grid-row: 2;
  }

  & .left {
    width: 60%;
  }

  & .right {
    width: 36%;

    &.grid-action {
      width: 100%;
    }

    & .p-price {
      display: flex;
      flex-direction: column;
      gap: 20px;
      border: none;
      /* remove default wrapper dotted border */
      margin-top: 10px;

      & .p-item01 {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr auto;
        grid-template-rows: auto auto;
        grid-template-areas:
          "heading price"
          "desc price";
        align-items: center;
        gap: 5px 20px;
        padding: 20px;
        border: 1px solid #e0e0e0;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
        text-align: left;
        transition: all 0.3s ease;
        cursor: pointer;

        &:not(:last-child) {
          border-right: 1px solid #e0e0e0;
          /* override the :not(:last-child) dotted border */
        }

        &.is-selected {
          border-color: #01a273;
          border-width: 2px;
          background: #f4fbf9;
          box-shadow: 0 6px 20px rgba(1, 162, 115, 0.15);
        }

        &:hover {
          border-color: #01a273;
          box-shadow: 0 6px 20px rgba(1, 162, 115, 0.08);
          transform: translateY(-2px);
        }

        &.plan_reccommend {
          position: relative;

          &::after {
            content: "1番人気";
            position: absolute;
            top: -12px;
            left: 20px;
            right: auto;
            background: #01a273;
            color: #fff;
            padding: 4px 16px;
            font-size: 12px;
            font-weight: 700;
            border-radius: 20px;
            clip-path: none;
            width: auto;
            height: auto;
            letter-spacing: 0.05em;
            box-shadow: 0 2px 6px rgba(1, 162, 115, 0.3);
          }
        }
      }

      & .p-heading01 {
        grid-area: heading;
        font-size: 16px;
        font-weight: 700;
        margin: 0;
        color: #555;
        line-height: 1.4;

        & br {
          display: none;
          /* remove line breaks for horizontal card layout */
        }
      }

      & .p-text03 {
        grid-area: desc;
        font-size: 12px;
        color: #777;
        margin: 0;
        line-height: 1.5;

        & br {
          display: none;
        }
      }

      & .p-text01 {
        grid-area: price;
        font-size: 14px;
        font-weight: 600;
        text-align: right;
        margin: 0;

        & .big {
          font-size: 26px;
          color: #01a273;
          font-weight: 700;
        }
      }
    }

    /* Small Mobile Adjustments (390px approx) */
    @media (max-width: 480px) {
      & .p-price {
        gap: 10px;

        & .p-item01 {
          padding: 12px 15px;
          gap: 4px 10px;

          &.plan_reccommend::after {
            font-size: 10px;
            padding: 2px 12px;
            top: -12px;
            left: 15px;
          }
        }

        & .p-heading01 {
          font-size: 14px;
        }

        & .p-text03 {
          font-size: 11px;
        }

        & .p-text01 {
          font-size: 12px;

          & .big {
            font-size: 22px;
          }
        }
      }
    }
  }

  & .title {
    font-size: 23px;
    font-weight: 600;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
    line-height: 1.4;
  }

  & .section01 {
    padding-bottom: 40px;

    & .block01 {
      background: #f6f6f6;
      display: flex;
      justify-content: space-between;
      align-items: start;
      border-radius: 30px;
      padding: 15px 30px;
    }

    /* Specialized wrapper for the now-compact Rental Guide */
    & .block-rental-guide {
      display: block;
      background: none;
      padding: 0;
    }

    & .wrap01 {
      width: 100%;
      margin-bottom: 30px;

      & img {
        width: 100%;
      }
    }

    & .wrap02 {
      width: 45%;
    }

    & .wrap03 {
      &:not(:first-child) {
        margin-top: 10px;
      }
    }

    & .heading02 {
      font-size: 15px;
      font-weight: 600;
      color: #555;
      margin-bottom: 8px;
      line-height: 1.4;
      display: block;
      letter-spacing: 0.05em;
    }

    & .text04 {
      font-size: 13px;
      line-height: 1.4;
    }

    /* Rental Guide Refined Styles */
    & .p-rental-guide {
      background: #fff;
      border: 1.5px dashed #01a273;
      border-radius: 10px;
      padding: 15px;
    }

    & .p-rental-guide__list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 0;
    }

    & .p-rental-guide__item {
      display: flex;
      align-items: flex-start;
      margin-bottom: 2px;
      line-height: 1.4;
      font-size: 13px;
    }

    & .p-rental-guide__label {
      font-size: 13px;
      font-weight: 600;
      color: #555;
      width: 7.5em;
      /* "返却時の梱包" など最長ラベルに合わせる */
      flex-shrink: 0;
      display: flex;
      justify-content: space-between;
      margin-right: 15px;
      margin-bottom: 0;
      line-height: 1.4;
    }

    & .p-rental-guide__label::after {
      content: "｜";
      font-weight: 400;
      color: #ccc;
    }

    & .p-rental-guide__val {
      color: #777;
      flex: 1;
    }

    & .p-rental-guide__modal-trigger {
      color: #01a273;
      text-decoration: none;
      font-size: 12px;
      margin-left: 5px;
      cursor: pointer;
      transition: opacity 0.2s;

      &:hover {
        opacity: 0.7;
      }
    }

    @media (max-width: 480px) {
      & .p-rental-guide {
        padding: 20px 15px;
      }
    }
  }

  & .section02 {
    padding: 7.5px 0 40px;

    & .item01 {
      &:not(:last-child) {
        margin-bottom: 22.5px;
      }
    }

    & .heading01 {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: 16px;
      font-weight: 600;
      margin-bottom: 12.5px;
      line-height: 1.4;

      &::before {
        content: '';
        display: inline-block;
        width: 6px;
        height: 11px;
        border-right: 2px solid #01a273;
        border-bottom: 2px solid #01a273;
        transform: rotate(45deg);
        margin-top: 4px;
        margin-right: 2px;
        flex-shrink: 0;
      }
    }

    & .text01 {
      font-size: 14px;
      letter-spacing: 0.01em;
      line-height: 1.4;
    }

    & .img01 {
      width: 100%;
      margin-bottom: 12.5px;
    }
  }

  & .section03 {
    padding: 7.5px 0 40px;

    & .list01 {
      display: flex;
      justify-content: center;
      align-items: start;
      gap: 50px;
    }

    & .item01 {
      width: calc((100% - 50px) / 2);
      position: relative;
    }

    & .wrap01 {
      width: 100%;
      height: auto;
      aspect-ratio: 20/13;
      margin-bottom: 10px;

      & img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    & .heading01 {
      font-size: 14px;
      margin-bottom: 5px;
      line-height: 1.4;
      letter-spacing: 0.05em;
    }

    & .text01 {
      font-size: 14px;
      letter-spacing: 0.05em;

      & .big {
        font-size: 20px;
        font-weight: 600;
      }
    }

    & .link01 {
      position: absolute;
      inset: 0;
      z-index: 1;
      transition: all 1s;

      &:hover {
        background: rgba(255, 255, 255, 0.6);
      }
    }
  }

  & .form {
    border-radius: 25px;
    border: 1px solid #01a273;
    padding: 6.5px;
    overflow: auto;
    position: sticky;
    max-height: calc(100vh - 130px);
    top: 100px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

    & .block01 {
      background: #f6f6f6;
      border-radius: 20px;
      padding: 30px 25px;

      & .p-form-label {
        font-size: 14px;
        font-weight: 700;
        color: #01a273;
        text-align: center;
      }
    }

    & .title {
      font-size: 22px;
      font-weight: 700;
      text-align: center;
      margin-top: 0;
      margin-bottom: 20px;
    }
  }

  & .c-subTitle {
    position: relative;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 24px;
    padding-top: 18px;
    border-top: 1px solid #e0e0e0;

    &::after {
      content: '';
      position: absolute;
      top: -1px;
      left: 0;
      width: 50px;
      height: 3px;
      background-color: #01a273;
    }
  }

  & .p-review-single {
    padding-bottom: 50px;
  }
}

@media(max-width: 768px) {
  .p-item {
    padding-bottom: 50px;

    & .inner {
      flex-direction: column;
    }

    & .p-item__grid-layout {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    & .grid-right-wrapper {
      display: contents;
    }

    & .grid-title {
      order: 1;
      width: 100%;
    }

    & .p-item-title {
      font-size: 20px;
    }

    & .grid-gallery {
      order: 2;
      width: 100%;
    }

    & .grid-action {
      order: 3;
      width: 100%;

      & .p-price {
        gap: 17px;
      }
    }

    & .grid-details {
      order: 4;
      width: 100%;
    }

    & .left,
    & .right {
      width: 100%;
    }

    & .right {
      position: relative;
      top: 0;
      max-height: none;
    }

    & .section01 {
      padding-bottom: 30px;

      & .block01 {
        flex-direction: column;
        border-radius: 20px;
        padding: 5px 20px 15px;
      }

      & .wrap01 {
        margin-bottom: 20px;
      }

      & .wrap02 {
        width: 100%;
      }

      & .wrap02 + .wrap02 {
        margin-top: 30px;
      }

      & .wrap03 {
        margin-top: 10px;
      }

      & .title {
        font-size: 20px;
        margin-bottom: 12.5px;
      }

      & .text04 {
        font-size: 13px;
        line-height: 1.4;
      }
    }

    & .section02 {
      padding: 7.5px 0 30px;
      margin-bottom: 30px;

      & .item01 {
        &:not(:last-child) {
          margin-bottom: 20px;
        }
      }

      & .heading01 {
        font-size: 14px;
        margin-bottom: 10px;
      }

      & .text01 {
        font-size: 12px;
      }

      & .img01 {
        margin-bottom: 10px;
      }
    }

    & .section03 {
      padding: 7.5px 0 30px;

      & .list01 {
        gap: 15px;
      }

      & .item01 {
        width: calc((100% - 15px) / 2);
      }

      & .wrap01 {
        margin-bottom: 5px;
      }

      & .heading01 {
        font-size: 12px;
        margin-bottom: 0;
        letter-spacing: 0;
      }

      & .text01 {
        font-size: 12px;
        letter-spacing: 0;

        & .big {
          font-size: 16px;
        }
      }
    }

    & .form {
      max-height: none;
      width: 100%;
      border-radius: 20px;
      padding: 5px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

      & .block01 {
        border-radius: 15px;
        padding: 25px 15px;

        & .p-form-label {
          font-size: 12px;
          font-weight: 700;
          color: #01a273;
          text-align: center;
        }
      }

      & .title {
        font-size: 20px;
        margin-top: 0;
        margin-bottom: 25px;
      }
    }

    & .c-subTitle {
      font-size: 16px;
      margin-bottom: 12.5px;
    }
  }

  .content_pd {
    padding: 0 8px 10px 8px !important;
  }
}





.p-overview {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 0 40px;
  width: 100%;
  margin-bottom: 40px;

  >img {
    width: 45%;
    height: 340px;
    filter: brightness(90%);
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .p-overview__content {
    padding: 10px 0;
    flex: 1;

    .p-overview__slug {
      font-size: 14px;
      line-height: 1.2em;
      font-weight: 700;
      color: #01a273;
      margin-bottom: 8px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }

    .p-overview__title {
      font-size: 26px;
      line-height: 1.2em;
      font-weight: 700;
    }

    .p-overview__text {
      font-size: 16px;
      line-height: 1.5;
      margin: 20px 0 20px;
      color: #737373;
    }

    .p-overview__points {
      width: 110%;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;

      .p-overview__point {
        width: 240px;

        >div {
          width: fit-content;
          display: flex;
          padding: 3px 8px;
          justify-content: center;
          align-items: center;
          gap: 0 8px;
          font-size: 16px;
          background-color: #f5f5f5;
          color: #737373;
          border-radius: 25px;
          font-weight: bold;

          >img {
            width: 18px;
            height: auto;
          }
        }
      }
    }
  }
}

@media(max-width: 768px) {
  .p-overview {
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin-bottom: -10px;

    >img {
      width: 100%;
      height: 260px;
      filter: brightness(80%);
    }

    .p-overview__content {
      padding: 10px 20px;
      z-index: 1;
      width: 100%;
      margin-top: -45px;
      position: relative;

      .p-overview__slug {
        font-size: 12px;
        line-height: 1.2em;
        font-weight: 700;
        color: #f5f5f5;
        margin-bottom: 0;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        position: absolute;
        top: -12px;
        left: 20px;
      }

      .p-overview__title {
        font-size: 18px;
        font-weight: 700;
        color: #f5f5f5;
      }

      .p-overview__text {
        font-size: 13px;
        margin: 25px 0 15px;
      }

      .p-overview__points {
        gap: 8px;

        .p-overview__point {
          width: 45%;

          >div {
            width: fit-content;
            display: flex;
            padding: 3px 8px;
            justify-content: center;
            align-items: center;
            gap: 0 5px;
            font-size: 13px;
            background-color: #f5f5f5;
            color: #737373;
            border-radius: 25px;
            font-weight: bold;

            >img {
              width: 14px;
              height: auto;
            }
          }
        }
      }
    }
  }
}



/* sidebar */
.p-items .sidebar {
  width: calc(20.5% - 10px);
  font-size: 14px;
}

.p-items .sidebar p {
  background: #f6f6f6;
  color: #01a372;
  padding: 20px 0;
  text-align: center;
  border-top: solid 1px #01a372;
  position: relative;
}

.p-items .sidebar p::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 10px solid #f6f6f6;
}

.p-items .sidebar ul {
  padding: 0;
}

.p-items .sidebar a {
  color: #111;
  text-decoration: none;
}

.p-items .sidebar li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 20px 20px;
  border-bottom: dotted 1px #01a372;
  -webkit-transition: 0.25s;
  transition: 0.25s;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.p-items .sidebar li::after {
  content: ">";
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 20px;
  height: 20px;
  background: #01a372;
  color: #fff;
  border-radius: 10px;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.p-items .sidebar li:hover {
  background: #ebf5f0;
}

.p-category-body {
  width: 100%;

  h2 {
    font-size: 20px;
    font-weight: 700;
    color: #545454;
    border-bottom: 1px solid #01a273;
    padding-bottom: 8px;
    margin-top: 25px;
    margin-bottom: 0;
  }
}

@media(max-width: 768px) {
  .p-category-body {
    h2 {
      font-size: 18px;
    }
  }
}

@media(min-width: 768px) {
  .p-category-body {
    width: calc(79.5% - 10px);

    h2 {
      margin-top: 0;
      margin-bottom: 25px;
    }

    & .p-price {
      & .p-heading01 {
        font-size: 12px;
      }

      & .p-text01 {
        font-size: 12px;

        & .big {
          font-size: 18px;
        }
      }

      & .p-text02 {
        font-size: 10px;
      }
    }
  }
}

.p-category-body__heading {
  border-bottom: 1px solid #01a273;
  font-size: 20px;
  font-weight: 700;
  padding-bottom: 4px;
}

@media(min-width: 768px) {
  .p-category-body__heading {
    font-size: 22px;
    padding-bottom: 7px;
  }
}

.p-item__product-item-link.sp_only {
  opacity: 0;
  visibility: hidden;
  transform: translateY(100%);
  transition: opacity .25s ease, visibility 0s .25s, transform .25s ease;
}

@media(max-width: 768px) {
  .p-item__product-item-link.sp_only {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity .25s ease, visibility 0s 0s, transform .25s ease;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #fff;
    padding: 10px 16px;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);

    &.hidden {
      opacity: 0;
      visibility: hidden;
      transform: translateY(100%);
      transition: opacity .25s ease, visibility 0s .25s, transform .25s ease;
    }

    #js-floating-cta.p-btn01 {
      width: 100%;
      max-width: none;
      box-sizing: border-box;
      background: #ffd167;
      color: #2a2a2a;
      border: none;
      font-size: 15px;
      font-weight: bold;
      text-align: center;
      display: block;
      padding: 20px 10px;
      border-radius: 30px;
      text-decoration: none;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      transition: all 0.2s ease;

      &:active {
        transform: scale(0.98);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
      }
    }

  }

  /* メインボタンもスマホではサイズ調整 */
  #js-main-cta.p-btn01 {
    font-size: 16px !important;
    padding: 20px 10px !important;
  }
}

.link01.is-disabled {
  background-color: #999;
  cursor: not-allowed;
}

.p-item {

  .mySwiper2,
  .mySwiper {
    width: 100%;
    margin: 0 auto;
  }

  .mySwiper {
    width: 60%;
    margin-left: 0;
    box-sizing: border-box;
    padding: 10px 0;
  }

  .swiper-wrapper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;

    >img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
  }

  .mySwiper2 .swiper-slide,
  .mySwiper .swiper-slide {
    aspect-ratio: 77 / 50;
  }

  .mySwiper .swiper-slide {
    width: 25%;
    height: auto;
    opacity: 0.6;
    cursor: pointer;
    transition: opacity .3s;
  }

  .mySwiper .swiper-slide-thumb-active,
  .mySwiper .swiper-slide:hover {
    opacity: 1;
  }

  .swiper-button-prev,
  .swiper-button-next {
    width: 30px;
    height: 30px;
    background-color: rgb(1, 162, 115);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: none;
    z-index: 10;
  }

  .swiper-button-prev::after,
  .swiper-button-next::after {
    content: '';
    font-size: 1rem;
    color: #ffffff;
    font-family: inherit;
  }

  .swiper-button-prev::after {
    content: '＜';
  }

  .swiper-button-next::after {
    content: '＞';
  }

  .swiper-button-prev {
    left: 10px;
  }

  .swiper-button-next {
    right: 10px;
  }
}

@media(max-width: 768px) {
  .p-item {
    .mySwiper {
      width: 100%;
    }
  }
}

/* SALEバッジ（共通） */
.p-price {
  position: relative;
}

.p-price--sale {
  margin-top: 48px;
}

.p-sale-badge-wrap--common {
  position: absolute;
  top: -48px;
  left: 5px;
  z-index: 10;
}

@media (max-width: 768px) {
  .p-price--sale {
    margin-top: 37px;
  }

  .p-sale-badge-wrap--common {
    top: -37px;
  }
}

/* 一覧用のSALEバッジ（プレミアムデザイン） */
.p-sale-badge--list {
  display: inline-block;
  background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
  color: #ffffff;
  font-weight: 800;
  font-size: 11px;
  padding: 4px 12px;
  letter-spacing: 0.08em;
  border-radius: 99px;
  box-shadow: 0 2px 4px rgba(255, 71, 87, 0.3);
  position: relative;
  overflow: hidden;
  z-index: 1;
}

/* 光沢が流れるアニメーション */
.p-sale-badge--list::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -60%;
  width: 20%;
  height: 200%;
  background: rgba(255, 255, 255, 0.3);
  transform: rotate(30deg);
  animation: shine 3s infinite;
}

@keyframes shine {
  0% {
    left: -60%;
  }

  20% {
    left: 120%;
  }

  100% {
    left: 120%;
  }
}

@media (max-width: 768px) {
  .p-sale-badge--list {
    font-size: 9px;
    padding: 3px 10px;
    box-shadow: 0 1px 3px rgba(255, 71, 87, 0.2);
  }
}

.p-sale-badge--common {
  display: inline-block;
  background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
  color: #ffffff;
  font-weight: 800;
  padding: 6px 16px;
  border-radius: 99px;
  font-size: 14px;
  letter-spacing: 0.05em;
  box-shadow: 0 3px 6px rgba(255, 71, 87, 0.3);
  position: relative;
  overflow: hidden;
  z-index: 1;
  animation: pulse 2s infinite;
}

/* 共通バッジ用の光沢アニメーション */
.p-sale-badge--common::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -60%;
  width: 20%;
  height: 200%;
  background: rgba(255, 255, 255, 0.3);
  transform: rotate(30deg);
  animation: shine 3s infinite;
}

@media (max-width: 768px) {
  .p-sale-badge--common {
    font-size: 11px;
    padding: 4px 12px;
    box-shadow: 0 2px 4px rgba(255, 71, 87, 0.2);
  }
}

/* 元の価格 */
.p-text-original-price {
  color: #999999;
  font-size: 18px;
  margin-top: -4px;
  margin-bottom: 0;
  letter-spacing: -0.02em;
}

@media (max-width: 768px) {
  .p-text-original-price {
    font-size: 13px;
  }
}

.p-text-original-price .strikethrough {
  text-decoration: none;
  position: relative;
  display: inline-block;
  letter-spacing: -0.02em;
}

.p-text-original-price .strikethrough::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: currentColor;
  transform: translateY(-50%);
}

.p-text-original-price--list {
  margin-top: 0;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .p-text-original-price--list {
    margin-top: 0;
  }
}

/* セール価格表示コンテナ（一覧用） */
.p-price-flex-container {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 0;
  margin-bottom: 10px;
}

.p-price-flex-container--popular .p-text-original-price,
.p-price-flex-container--popular .p-item__card-title_popular_plan {
  line-height: 1;
  /* 行高さによる上下の余白を最小化 */
}

/* 人気商品セクション等のカード用余白 */
.p-price-flex-container--popular {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
}

.p-price-flex-container--popular .p-text-original-price--list,
.p-price-flex-container--popular .p-item__card-title_popular_plan {
  margin-top: 0 !important;
}

.p-text-sale-price--list {
  margin: 0;
}

@media (max-width: 768px) {
  .p-price-flex-container--popular {
    margin-left: 5px !important;
    margin-top: 8px !important;
  }

  .p-price-flex-container {
    margin-top: 5px;
    margin-bottom: 0px;
    gap: 5px;
  }
}

/* セール価格 */
.p-text-sale-price span.big {
  color: #ff4757 !important;
  font-weight: bold;
  letter-spacing: -0.02em;
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.05);
  }

  100% {
    transform: scale(1);
  }
}

@media(max-width: 768px) {
  .p-price-note {
    font-size: 11px;
    margin-bottom: 15px;
  }
}

/* --- Stylish Stock Indicator --- */
.p-item-stock {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f6f6f6;
  padding: 10px 24px;
  border-radius: 6px;
  color: #545454;
  font-weight: 500;
  margin-bottom: 15px;
}

.p-item-stock__label {
  font-size: 13px;
  margin-right: 8px;
}

.p-item-stock__count {
  font-size: 20px;
  margin: 0 4px;
  color: #01a273;
  font-weight: 700;
  line-height: 1;
}

.p-item-stock__unit {
  font-size: 13px;
}

/* 在庫あり（5台以上）= 淡いグリーン地＋チェック（デザインD） */
.p-item-stock--available {
  background: #e6f5f0;
}

.p-item-stock__check {
  color: #01a273;
  margin-right: 7px;
  flex-shrink: 0;
}

.p-item-stock__available {
  font-size: 16px;
  font-weight: 700;
  color: #0b7a59;
}

/* カテゴリーページの在庫あり表記（チェックのみ緑・文字は他カードと同色） */
.p-item__stock-line {
  font-size: 14px;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 5px;
}

.p-item__stock-check {
  color: #01a273;
  flex-shrink: 0;
}

.p-item__stock-available {
  font-weight: 400;
}

/* ============================================================
 * Purchase Modal — body直下に移動するためトップレベルで定義
 * ============================================================ */
.p-purchase-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.p-purchase-modal.is-show {
  opacity: 1;
  pointer-events: auto;
}

.p-purchase-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(2px);
}

.p-purchase-modal__content {
  position: relative;
  background: #fff;
  width: 90%;
  max-width: 450px;
  padding: 40px 30px 30px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  transform: translateY(20px);
  transition: transform 0.3s ease;
}

.p-purchase-modal.is-show .p-purchase-modal__content {
  transform: translateY(0);
}

.p-purchase-modal__close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  color: #aaa;
  cursor: pointer;
  padding: 5px;
}

.p-purchase-modal__close:hover {
  color: #333;
}

.p-purchase-calc {
  background: #f8fbf9;
  border: 1px dashed #01a273;
  border-radius: 12px;
  padding: 18px;
}

.p-purchase-calc__title {
  font-size: 13px;
  font-weight: 700;
  color: #01a273;
  margin-bottom: 12px;
  text-align: center;
}

.p-purchase-calc__formula {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 14px;
  color: #333;
}

.p-purchase-calc__part {
  background: #fff;
  padding: 4px 12px;
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  font-weight: 600;
}

.p-purchase-calc__break {
  width: 100%;
  height: 0;
}

.p-purchase-calc__operator {
  font-weight: 700;
  color: #888;
}

.p-purchase-calc__result {
  background: #01a273;
  color: #fff;
  padding: 4px 12px;
  border-radius: 4px;
  font-weight: 700;
}

@media (max-width: 480px) {
  .p-purchase-calc__formula {
    font-size: 11px;
    gap: 5px;
  }

  .p-purchase-calc__part,
  .p-purchase-calc__result {
    padding: 4px 8px;
  }
}

/* ==========================================
   single-item.php インラインスタイル移行
   ========================================== */

/* 価格テーブルの下マージン */
.p-price {
  margin-bottom: 10px;
}

/* セール価格ラッパー */
.p-price-wrapper {
  grid-area: price;
  text-align: right;
}

/* 価格注記（※全プラン税込価格） */
.p-price-note {
  margin-bottom: 15px;
}

/* CTAエリア */
.p-item-cta {
  margin-bottom: 30px;
  text-align: center;
  width: 100%;
}

/* 在庫切れ表示 */
.sold-out {
  padding: 20px;
  background: #eee;
  font-weight: bold;
  color: #666;
  border-radius: 4px;
}

/* メインCTAボタン */
#js-main-cta {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  background: #ffd167;
  color: #2a2a2a;
  border: none;
  font-size: 1.1rem;
  font-weight: bold;
  text-align: center;
  display: block;
  padding: 18px 10px;
  border-radius: 30px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transition: all 0.2s ease;
}

/* レンタルガイドセクション（ボーダー・パディングリセット） */
.section01--guide {
  padding: 0;
  margin-top: 30px;
  border-bottom: none;
}

/* ギャラリーセクション */
.p-item .section01--gallery {
  border-bottom: none;
  padding-bottom: 5px;
}

/* 仕様・詳細セクション */
.item-metaArea {
  margin-top: 5px;
}

/* 購入モーダル：注意書き */
.p-purchase-calc__note {
  font-size: 11px;
  color: #777;
  margin-top: 15px;
  text-align: center;
}

/* レンタルガイドラッパーの幅（.p-item .section01 .wrap02 { width:45% } より詳細度を上げて上書き） */
.p-item .block-rental-guide .wrap02 {
  width: 100%;
}

/* 配送エリア注記（small） */
.p-rental-guide__val small {
  font-size: 10px;
  margin-left: 5px;
}

/* 価格単位スパン（0.75em） */
.p-price-unit {
  font-size: 0.75em;
}

/* 商品カード：サムネイルラッパー */
.p-item__card-img_popular {
  position: relative;
}

/* セールバッジ */
.p-sale-badge--list {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 5;
}

/* レビューセクション */
.p-review-single {
  margin-top: 40px;
}

.p-review-single .c-subTitle {
  margin-bottom: 24px;
}