@charset "UTF-8";
@layer component {
  /* ---------------------------------------------
    *  広告ライブラリーTOP
    --------------------------------------------- */
  /* .p-archive-carousel
    --------------------------------------------- */
  .p-archive-carousel {
    opacity: 0;
    transition: opacity 0.6s 0.7s;
    margin-top: calc(8 * var(--base-unit));
  }
  .p-archive-carousel:has(.splide.is-initialized) {
    opacity: 1;
  }
  @media screen and (max-width: 767px) {
    .p-archive-carousel {
      margin-top: calc(4 * var(--base-unit));
    }
  }
  .p-archive-carousel__ttl {
    font-size: calc(3.2 * var(--base-unit));
    font-size: min(32px, 1.6666666667vw);
    line-height: 1.5625;
  }
  @media screen and (max-width: 767px) {
    .p-archive-carousel__ttl {
      font-size: calc(2 * var(--base-unit));
    }
  }
  .p-archive-carousel__txt {
    margin-top: calc(2 * var(--base-unit));
    font-size: min(16px, 0.8333333333vw);
    line-height: 1.8;
  }
  @media screen and (max-width: 767px) {
    .p-archive-carousel__txt {
      font-size: calc(1.5 * var(--base-unit));
    }
  }
  @media screen and (max-width: 767px) {
    .p-archive-carousel__txt-wrap {
      aspect-ratio: 335/306 !important;
    }
  }
  .p-archive-carousel__txt-inner {
    position: relative;
    height: 100%;
  }
  .p-archive-carousel__txt-inner::after {
    position: absolute;
    content: "";
    display: block;
    aspect-ratio: 1;
    width: calc(35 / 606 * 100%);
    background: url("https://www.mitsubishicorp.com/assets_r24/images/cmn-mark_arrow_3.svg") no-repeat
      center/contain;
    bottom: 0;
    right: 0;
  }
  @media screen and (max-width: 767px) {
    .p-archive-carousel__txt-inner::after {
      width: calc(2 * var(--base-unit));
    }
  }
  .p-archive-carousel .c-carousel1__image {
    aspect-ratio: 793/442;
  }
  .p-archive-carousel .c-carousel1__image.c-carousel1__image--bd {
    border:1px solid #999;
  }
  .p-archive-carousel .c-carousel1__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
  @media screen and (max-width: 1199px) {
    .p-btn03__list--2 {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }
  @media screen and (max-width: 767px) {
    .p-btn03__list--2 {
      grid-template-columns: 1fr !important;
    }
  }
  .p-panel01__txt--2 {
    font-size: min(20px, 1.0416666667vw) !important;
  }
  @media screen and (max-width: 767px) {
    .p-panel01__txt--2 {
      font-size: calc(1.8 * var(--base-unit)) !important;
    }
  }
  .p-panel01__img--2 img {
    -o-object-fit: cover !important;
    object-fit: cover !important;
    width: 100%;
    aspect-ratio: 16/9 !important;
  }
  @media screen and (min-width: 768px) {
    .p-archive-top-sec__btn-area--hide-pc {
      display: none;
    }
  }

  /* ---------------------------------------------
    *  広告ライブラリー下層
    --------------------------------------------- */
  .p-about-archive-panel {
    margin: calc(8 * var(--base-unit)) auto 0;
    width: var(--width-contents);
  }
  @media screen and (max-width: 768px) {
    .p-about-archive-panel {
      margin-top: calc(4 * var(--base-unit));
    }
  }
  .p-about-archive-panel__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    -moz-column-gap: calc(2.4 * var(--base-unit));
    column-gap: calc(2.4 * var(--base-unit));
  }
  @media screen and (max-width: 1199px) {
    .p-about-archive-panel__list {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__list {
      grid-template-columns: repeat(1, 1fr);
    }
  }
  @media print, screen and (min-width: 768px) {
    .p-about-archive-panel__item {
      display: grid;
      grid-template-rows: subgrid;
      grid-row: span 5;
      gap: 0;
    }
    .p-about-archive-panel__item:nth-of-type(n + 4) {
      margin-top: calc(7.4 * var(--base-unit));
    }
  }
  @media print, screen and (min-width: 768px) and (max-width: 1199px) {
    .p-about-archive-panel__item:nth-of-type(n + 3) {
      margin-top: calc(7.4 * var(--base-unit));
    }
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__item:nth-of-type(n + 2) {
      margin-top: calc(5 * var(--base-unit));
    }
  }
  .p-about-archive-panel__img-wrap--bd {
    border:1px solid #d5d5d5;
  }
  .p-about-archive-panel__img {
    width: 100%;
    height: auto;
  }
  .p-about-archive-panel__ttl {
    margin-top: calc(2 * var(--base-unit));
    font-size: calc(2 * var(--base-unit));
    letter-spacing: 0.1em;
    line-height: 1.6;
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__ttl {
      margin-top: calc(1 * var(--base-unit));
      font-size: calc(1.8 * var(--base-unit));
    }
  }
  @media print, screen and (min-width: 768px) {
    .p-about-archive-panel__txt-wrap {
      min-height: calc(2.5 * var(--base-unit));
    }
  }
  .p-about-archive-panel__txt {
    margin-top: calc(0.2 * var(--base-unit));
    font-size: calc(1.4 * var(--base-unit));
    letter-spacing: 0.03em;
    line-height: 1.7857142857;
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__txt {
      font-size: calc(1.5 * var(--base-unit));
    }
  }
  .p-about-archive-panel__btn-wrap {
    min-height: calc(5 * var(--base-unit));
    margin-top: calc(1.6 * var(--base-unit));
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -moz-column-gap: calc(1.2 * var(--base-unit));
    column-gap: calc(1.2 * var(--base-unit));
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__btn-wrap {
      min-height: calc(5.4 * var(--base-unit));
      -moz-column-gap: calc(1 * var(--base-unit));
      column-gap: calc(1 * var(--base-unit));
    }
  }
  .p-about-archive-panel button.p-about-archive-panel__btn {
    margin: 0;
    box-shadow: none;
    border-radius: 0;
    text-indent: 0.01px;
    text-overflow: "";
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    touch-action: manipulation;
    cursor: pointer;
  }
  .p-about-archive-panel__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: calc(0.4 * var(--base-unit)) 0.5em;
    color: #000;
    font-size: calc(1.6 * var(--base-unit));
    letter-spacing: 0.07em;
    line-height: 1.25;
    font-family: var(--mc--str--of-font-family-name--basic);
    background-color: #bebebe;
    border-color: #bebebe;
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__btn {
      min-height: calc(4.4 * var(--base-unit));
      font-size: calc(1.7 * var(--base-unit));
    }
  }
  .p-about-archive-panel__btn::before {
    content: "";
    display: block;
  }
  .p-about-archive-panel__btn--web {
    -moz-column-gap: calc(0.8 * var(--base-unit));
    column-gap: calc(0.8 * var(--base-unit));
  }
  .p-about-archive-panel__btn--web::before {
    width: calc(2.5 * var(--base-unit));
    height: calc(1.6 * var(--base-unit));
    background: url("https://www.mitsubishicorp.com/jp/en/about/ad_library/assets_r24/images/icon_btn-1.svg")
      no-repeat center/contain;
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__btn--web::before {
      width: calc(2 * var(--base-unit));
      height: calc(2 * var(--base-unit));
    }
  }
  .p-about-archive-panel__btn--movie {
    -moz-column-gap: calc(1.1 * var(--base-unit));
    column-gap: calc(1.1 * var(--base-unit));
  }
  .p-about-archive-panel__btn--movie::before {
    width: calc(2 * var(--base-unit));
    height: calc(2 * var(--base-unit));
    background: url("https://www.mitsubishicorp.com/jp/en/about/ad_library/assets_r24/images/icon-movie.svg")
      no-repeat center/contain;
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel__btn--movie::before {
      width: calc(2 * var(--base-unit));
      height: calc(2 * var(--base-unit));
    }
  }
  .p-about-archive-panel button.p-about-archive-panel__btn,
  .p-about-archive-panel__btn[href] {
    background-color: #fff;
    border: 1px solid #000;
  }
  @media screen and (min-width: 768px) {
    .p-about-archive-panel button.p-about-archive-panel__btn,
    .p-about-archive-panel__btn[href] {
      transition: background-color 0.3s ease 0s, color 0.3s ease 0s,
        border-color 0.3s ease 0s;
    }
  }
  @media screen and (min-width: 768px) {
    .p-about-archive-panel button.p-about-archive-panel__btn::before,
    .p-about-archive-panel__btn[href]::before {
      transition: filter 0.3s ease 0s;
    }
  }
  .p-about-archive-panel button.p-about-archive-panel__btn:hover,
  .p-about-archive-panel__btn[href]:hover {
    border-color: #a22041;
    background: #a22041;
    color: #fff;
  }
  .p-about-archive-panel button.p-about-archive-panel__btn:hover::before,
  .p-about-archive-panel__btn[href]:hover::before {
    filter: brightness(0) invert(1);
  }
  .p-about-archive-panel .p-link01 {
    margin-top: calc(1.6 * var(--base-unit));
  }
  @media screen and (max-width: 767px) {
    .p-about-archive-panel .p-link01 {
      margin-top: calc(2.3 * var(--base-unit));
      font-size: calc(1.5 * var(--base-unit));
    }
  }
  .p-panel01__list--archive {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    -moz-column-gap: calc(2.4 * var(--base-unit));
    column-gap: calc(2.4 * var(--base-unit));
  }
  @media screen and (max-width: 1199px) {
    .p-panel01__list--archive {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }
  @media screen and (max-width: 767px) {
    .p-panel01__list--archive {
      grid-template-columns: repeat(1, 1fr) !important;
    }
  }
  .p-panel01__img--archive {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    aspect-ratio: 384/214 !important;
    place-content: inherit !important;
  }
  .p-panel01__img--archive img {
    -o-object-fit: contain;
    object-fit: contain;
    transition: 0.3s ease 0s;
    display: block;
    width: 100%;
    height: auto;
  }
}
.p-about-archive-panel__btn-wrap-transparent {
  display: none;
}