@charset "UTF-8";

.e-mainLead {
  margin-bottom: 50px;
  a {
    color: var(--blue);
  }
}
@media screen and (min-width: 768px) {
  .e-mainLead {
    a {
      &:hover {
        text-decoration: underline;
      }
    }
  }
}

/*--------------------------------------------------*/

/* content01

/*--------------------------------------------------*/
.b-section {
  .b-content {
    display: flex;
    dt {
      width: 30px;
      flex-shrink: 0;
    }
    dd {
      flex-grow: 1;
      overflow-x: auto;
      .inner {
        width: 2340px;
      }
    }
  }
}

/*--------------------------------------------------*/

/* discontinueds

/*--------------------------------------------------*/
.b-discontinueds {
  .b-item {
    padding-bottom: 30px;
    &:not(:first-of-type) {
      padding-top: 30px;
      border-top: 1px solid var(--line-t);
    }
    .b-img.m-wide {
      width: 280px;
      flex-shrink: 0;
    }
    .b-txts {
      width: 100%;
    }
    .e-brand {
      display: block;
      font-family: var(--fontEN);
      font-size: min(3.5vw,14px);
      letter-spacing: .1em;
      font-weight: 300;
    }
    .e-product {
      display: block;
      font-size: min(5vw,20px);
      line-height: 1.5;
      font-weight: 600;
    }
    .b-modalBtn {
      flex-shrink: 0;
      background: #fff;
      color: var(--txt);
      font-weight: 500;
      border: 1px solid var(--txt);
      border-radius: var(--r);
      filter: var(--drop);
      position: relative;
      &::after {
        content: "";
        display: block;
        aspect-ratio: 1/1;
        width: 1.55em;
        background: url(../images/icon-search-p.svg) center center / contain no-repeat;
        position: absolute;
        right: .1em;
        top: 50%;
        transform: translateY(-45%);
      }
    }
    .b-itemContent {
      dl {
        &+dl {
          margin-top: 20px;
        }
        dt {
          display: inline-block;
          background: var(--bg);
          padding: .25em .8em;
          margin-bottom: 10px;
        }
        dd {
          display: block;
          li {
            display: block;
            padding-left: 1.2em;
            position: relative;
            &::before {
              content: "・";
              position: absolute;
              left: 0;
              top: 0;
            }
            a {
              text-decoration: underline;
            }
          }
        }
      }
    }
  }
}
@media screen and (max-width: 767px) {
  .b-discontinueds {
    .b-item {
      .b-img.m-wide {
        display: none;
      }
      .b-modalBtn {
        width: min(100%,200px);
        padding: .05em 1.8em .2em .8em;
        margin-top: 15px;
      }
      .b-itemHead {
        display: flex;
        gap: 15px;
        margin-bottom: 15px;
        .b-img {
          width: min(38.75vw,155px);
        }
      }
    }
  }
}
@media screen and (min-width: 768px) {
  .b-discontinueds {
    .b-item {
      display: flex;
      gap: 15px;
      .b-img.m-small {
        display: none;
      }
      .b-modalBtn {
        padding: .3em 1.8em .4em .8em;
        transition: var(--transition);
        &:hover {
          background: var(--txt);
          color: #fff;
        }
      }
      .b-smallBox {
        display: flex;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 15px;
        .b-modalBtn {
          margin-right: 0;
          margin-left: auto;
        }
      }
      .b-itemContent {
        a {
          transition: var(--transition);
        }
        dl {
          dd {
            a {
              &:hover {
                color: var(--blue);
                text-decoration: none;
              }
            }
          }
        }
      }
    }
  }
}