.tp-Info_Container {
  display: -webkit-flex;
  display: flex; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Container {
      margin-left: auto;
      padding: 0.8em 0;
      width: 45vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Container {
      margin: 2.5vw;
      width: 95vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Container {
      margin: 2.5vw;
      width: 95vw; } }

.tp-Info_Container_New {
  display: -webkit-flex;
  display: flex; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Container_New {
      margin-left: auto;
      padding: 0.8em 0 0 0;
      width: 45vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Container_New {
      margin: 2.5vw;
      width: 95vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Container_New {
      margin: 2.5vw;
      width: 95vw; } }

.tp-Info_Icon {
  background: url(./img/info-icon.png) no-repeat;
  background-size: contain; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Icon {
      margin-right: 0.5vw;
      width: 9.5vw;
      height: 9.5vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Icon {
      margin-right: 1vw;
      width: 21.5vw;
      height: 21.5vw;
      border-radius: 1vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Icon {
      margin-right: 1vw;
      width: 21.5vw;
      height: 21.5vw;
      border-radius: 1vw; } }

.tp-Info_Guide {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 80%;
  background-color: #5ed774;
  cursor: pointer; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Guide {
      background-image: url(./img/img_top_guide_pc.png);
      margin-right: 0.5vw;
      width: 50%;
      height: 9.5vw;
      border-radius: 4px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Guide {
      background-image: url(./img/img_top_guide_tab.png);
      margin-right: 1vw;
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Guide {
      background-image: url(./img/img_top_guide_sp.png);
      margin-right: 1vw;
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }

.tp-Info_Point {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 80%;
  background-color: #ffb848;
  cursor: pointer; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Point {
      background-image: url(./img/img_top_point_pc.png);
      margin-right: 0.5vw;
      width: 50%;
      height: 9.5vw;
      border-radius: 4px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Point {
      background-image: url(./img/img_top_point_tab.png);
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Point {
      background-image: url(./img/img_top_point_sp.png);
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }

.tp-Info_Login {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 80%;
  background-color: #3ac986;
  cursor: pointer; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Login {
      background-image: url(./img/img_top_login_pc.png);
      margin-right: 0.5vw;
      width: 50%;
      height: 9.5vw;
      border-radius: 4px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Login {
      background-image: url(./img/img_top_login_tab.png);
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Login {
      background-image: url(./img/img_top_login_sp.png);
      width: 50%;
      height: 21.5vw;
      border-radius: 1vw; } }

.tp-Info_Guide-hover,
.tp-Info_Point-hover,
.tp-Info_Login-hover {
  opacity: 0.4;
  transition: 0.2s ease; }

.tp-Info_Body {
  background: white; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Body {
      border-radius: 4px;
      -webkit-flex-grow: 1;
              flex-grow: 1;
      margin-right: 0.5vw;
      height: 9.5vw;
      border: 1px solid #ff7f7f; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Body {
      border-radius: 1vw;
      width: 72.5vw;
      border: 0.4vw solid #ff7f7f; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Body {
      border-radius: 1vw;
      width: 72.5vw;
      border: 0.6vw solid #ff7f7f; } }

.tp-Info_Title {
  background-color: #ff7f7f;
  background-image: url(img/info-kira.png), url(img/info-head.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 98% 0%, 2% 0%;
  color: transparent;
  font-size: 0.5vw;
  padding: 0.5vw 0 0.5vw 0.5vw;
  vertical-align: middle; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Title {
      height: 2vw;
      margin-bottom: 0.5vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Title {
      border-radius: 0.5vw 0.5vw 0 0;
      height: 4vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Title {
      border-radius: 0.5vw 0.5vw 0 0;
      height: 4vw; } }

@media screen and (min-width: 1001px) {
  .tp-Info_List {
    margin: 0.5vw 0;
    font-size: 1.2vw;
    overflow: hidden;
    height: 6.5vw; } }
@media screen and (min-width: 481px) and (max-width: 1000px) {
  .tp-Info_List {
    font-size: 0vw;
    margin: 2.5vw;
    height: 11.8vw;
    position: relative; } }
@media screen and (max-width: 480px) {
  .tp-Info_List {
    font-size: 0vw;
    margin: 2vw;
    height: 12.3vw;
    position: relative; } }

.tp-Info_List {
  position: relative; }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_List ul {
      width: 60vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_List ul {
      width: 50vw; } }

@media screen and (max-width: 480px) {
  .tp-Info_List li:nth-child(4) {
    display: none; } }

.tp-Info_Item {
  color: #444;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; }
  @media screen and (min-width: 1001px) {
    .tp-Info_Item {
      margin: 0 0 0.3vw 1vw;
      width: 28vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_Item {
      font-size: 2.5vw;
      height: 2.95vw;
      line-height: 2.95vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_Item {
      font-size: 2.8vw;
      height: 4.1vw;
      line-height: 4.1vw; } }

.tp-Info_ItemDate {
  display: inline; }

.tp-Info_ItemText {
  display: inline;
  transition: all 0.2s ease; }
  .tp-Info_ItemText a {
    color: #444;
    transition: opacity 0.2s ease; }
  @media screen and (min-width: 1001px) {
    .tp-Info_ItemText {
      margin-left: 2vw; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_ItemText {
      margin-left: 4vw;
      margin-right: 6vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_ItemText {
      margin-left: 4vw;
      margin-right: 6vw; } }

.tp-Info_ItemText-hover a {
  opacity: 0.4;
  transition: opacity 0.2s ease; }

.tp-Info_More {
  border-radius: 50%;
  position: absolute;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-align-items: center;
          align-items: center; }
  @media screen and (min-width: 1001px) {
    .tp-Info_More {
      bottom: 15%;
      left: 83%;
      width: 4em;
      height: 4em; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .tp-Info_More {
      bottom: 5%;
      left: 92%;
      width: 6.4vw;
      height: 6.4vw;
      font-size: 1.6vw; } }
  @media screen and (max-width: 480px) {
    .tp-Info_More {
      bottom: 5%;
      left: 83%;
      width: 10.4vw;
      height: 10.4vw;
      font-size: 2.4vw; } }