@charset "utf-8";

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


í“Ãû


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


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

¥³¥ó¥Æ¥ó¥Ä

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

.topic_list {}

.topic_list ul {
 margin: 68px 0 0;
}

.topic_item {
 position: relative;
 justify-content: flex-start;
 align-items: center;
 flex-wrap: wrap;
 padding: 26px 24px;
}

.topic_item:not(:nth-last-of-type(1)) {
 border-bottom: 1px solid #BFBEBE;
}

.topic_date {
 width: 100px;
 font-size: 1.6rem;
}

.topic_cat {
 display: inline-block;
 width: 96px;
 text-align: center;
 margin-right: 16px;
 font-size: 1.4rem;
 line-height: 2;
 color: #fff;
 background-color: #70AAD6;
}

.topic_cat.¤ªÖª¤é¤» {
 background-color: #70AAD6;
}

.topic_cat.¥¤¥Ù¥ó¥È {
 background-color: #61BEBC;
}

.topic_item a {
 position: relative;
 display: block;
 width: calc(100% - 212px);
}

.topic_title {
 width: 100%;
 padding-right: 48px;
 font-size: 1.8rem;
 display: block;
}

.topic_title::after {
 content: "";
 position: absolute;
 top: calc(50% - 12px);
 right: 0px;
 display: inline-block;
 width: 24px;
 height: 24px;
 background-image: url(/graduate/human-m/diversity/_image/common/icon-arrow.svg);
}


@media only screen and (max-width:640px) {
 .topic_list {
  width: 100%;
  padding-bottom: 128px;
 }

 .topic_item {
  padding: 32px 24px;
 }

 .topic_item:not(:nth-last-of-type(1)) {}

 .topic_date {
  width: 160px;
 }

 .topic_cat {
  width: 160px;
 }

 .topic_item a {
  width: calc(100%);
 }

 .topic_title {
  font-size: 1.6rem;
  padding: 16px 64px 0 0;
 }

 .topic_title::after {
  top: calc(50% - 16px);
  width: 32px;
  height: 32px;
 }

}

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

¥³¥ó¥Æ¥ó¥Ä

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


@media only screen and (max-width:640px) {}

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

¥³¥ó¥Æ¥ó¥Ä

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


@media only screen and (max-width:640px) {}

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

¥³¥ó¥Æ¥ó¥Ä

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


@media only screen and (max-width:640px) {}

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

¥³¥ó¥Æ¥ó¥Ä

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


@media only screen and (max-width:640px) {}

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

¥³¥ó¥Æ¥ó¥Ä

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


@media only screen and (max-width:640px) {}