@charset "utf-8";

/* ========================================================== */
/* ニュースバー */
/* ========================================================== */
#news_bar {
  position: relative;
  width: clamp(325px, 96%, 718px);
  margin: 0 auto;

  & .news_title {
    display: flex;
    justify-content: center;
    align-items: baseline;
    border-bottom: solid 1px #d6d6d6;

    & p {
      margin-bottom: 0;
    }

    & p:nth-child(2) {
      font-size: 1.5rem;
      font-weight: bold;
    }

    & a {
      font-size: 0.875rem;

    }
  }

  & .news_bar_list {
    height: 7rem;
    overflow-y: auto;
    margin: 0.5rem 0 0;
    padding: 0;
    line-height: 1;

    &::-webkit-scrollbar {
      background-color: #f5f5f5;
    }

    &::-webkit-scrollbar-thumb {
      background-color: #3faf49;
    }

    & a {
      & div {
        display: flex;
        align-items: center;

        & .news_bar_icon_e_PC,
        .news_bar_icon_e_SP {
          width: 10rem;
          text-align: center;
          color: white;
          font-size: 0.875rem;
          background-color: #eb8878;
          border-radius: 0.125rem;
          margin-right: 0.5rem;
        }

        & .news_bar_icon_e_SP {
          display: none;
          width: 2rem;
          margin-right: 0.25rem;
        }

        & .news_bar_icon_p_PC,
        .news_bar_icon_p_SP {
          width: 10rem;
          text-align: center;
          color: white;
          font-size: 0.875rem;
          background-color: #ff9e00;
          border-radius: 0.125rem;
          margin-right: 0.5rem;
        }

        & .news_bar_icon_p_SP {
          display: none;
          width: 2rem;
          margin-right: 0.25rem;
        }
      }
    }
  }
}

@media screen and (max-width: 575px) {
  #news_bar {
    & .news_bar_list {
      height: 8.5rem;

      & a {
        & div {

          & .news_bar_icon_e_PC,
          .news_bar_icon_p_PC {
            display: none;
          }

          & .news_bar_icon_e_SP,
          .news_bar_icon_p_SP {
            display: block;
          }
        }
      }
    }
  }
}