article {
  background-color: #fff;
}

@media screen and (min-width: 768px) {
  .un_showcase {
    height: auto!important;
  }

  .top-msg .un_showcase_ttl img{
     width: calc(230 / var(--base) * 100vw) !important;
  }

  .top-msg .un_showcase_copy {
     font-size: calc(38 / var(--base) * 100vw) !important;
  }

  .un_showcase_ttl {
    color: #2d2f31;
    font-family: "YuGothic", "Yu Gothic", sans-serif;
    padding-left: 0px !important;
  }

  .un_message_txt {
    /* font-family: "YuGothic", "Yu Gothic", sans-serif; */
    text-align: left;
    font-size: calc(18 / var(--base) * 100vw);
    line-height: 2.5;
  }

  .un_message {
    padding: calc(60 / var(--base) * 100vw) calc(180 / var(--base) * 100vw) !important;
  }

  .un_message_name {
    text-align: end;
    gap: 10px;
  }

  .un_message_name .role {
    display: inline-block;
    margin-right: -9px;
    margin-bottom: calc(15 / var(--base) * 100vw);
  }
}

@media screen and (max-width: 767px) {
  body .un_showcase_ttl img.en {
    width: calc(262 / var(--base-sp) * 100vw) !important;
    max-width: none !important;
    min-width: 0 !important;
    filter: brightness(7);
  }

  .un_showcase_ttl {
    color: #fff;
  }

  .un_message_txt {
    /* font-family: "YuGothic", "Yu Gothic", sans-serif; */
    margin: 0 auto calc(34 / var(--base-sp) * 100vw) !important;
    font-size: clamp(0px, calc(15 / var(--base-sp) * 100vw), 15px) !important;
    line-height: 2.2;
  }

  .un_message_name {
    text-align: left;
    padding-left: 55%;
  }

  .un_message_name .role {
    display: inline-block;
    font-size: calc(10 / var(--base-sp) * 100vw);
    margin-bottom: calc(12 / var(--base-sp) * 100vw) !important;
  }

  .un_message_name img.name {
    width: calc(128 / var(--base-sp) * 100vw) !important;
  }

}