.pl-PlayInfo_Container {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-justify-content: space-between;
          justify-content: space-between; }

.pl-PlayInfo_Undispatched {
  background-color: #ff7f7f;
  width: 100%;
  overflow: hidden;
  border-style: solid;
  border-color: #ff7f7f; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_Undispatched {
      display: -webkit-flex;
      display: flex;
      border-radius: 4px;
      margin-bottom: 10px;
      border-width: 3px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_Undispatched {
      display: -webkit-flex;
      display: flex;
      border-radius: 0.5vw;
      margin-bottom: 1vw;
      border-width: 0.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_Undispatched {
      border-radius: 1vw;
      margin-bottom: 1vw;
      border-width: 0.7vw; } }

.pl-PlayInfo_UndispatchedTitle {
  color: transparent;
  background-image: url(../img/head-undis.png), url(../img/kira.png);
  background-color: #ff7f7f;
  background-repeat: no-repeat; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_UndispatchedTitle {
      width: 50%;
      background-size: 120px, 20px;
      background-position: center, 90% 90%; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_UndispatchedTitle {
      width: 50%;
      background-size: 12vw, 2vw;
      background-position: center, 98% 98%; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_UndispatchedTitle {
      width: 100%;
      height: 6vw;
      background-size: 22vw, 0vw;
      background-position: center, 98% 98%; } }

.pl-PlayInfo_UndispatchedBody {
  background-color: white;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: space-around;
          justify-content: space-around; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_UndispatchedBody {
      width: 50%; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_UndispatchedBody {
      width: 50%; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_UndispatchedBody {
      width: 100%;
      padding: 2vw 0; } }

.pl-PlayInfo_UndispatchedNumber {
  width: 80%;
  display: -webkit-flex;
  display: flex; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_UndispatchedNumber {
      -webkit-align-items: baseline;
                  -ms-grid-row-align: baseline;
              align-items: baseline; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_UndispatchedNumber {
      -webkit-align-items: baseline;
                  -ms-grid-row-align: baseline;
              align-items: baseline; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_UndispatchedNumber {
      -webkit-align-items: center;
                  -ms-grid-row-align: center;
              align-items: center; } }

.pl-PlayInfo_UndispatchedBunshi {
  color: black; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_UndispatchedBunshi {
      text-align: center;
      width: 67%;
      font-size: 50px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_UndispatchedBunshi {
      text-align: center;
      width: 67%;
      font-size: 5vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_UndispatchedBunshi {
      text-align: right;
      width: 50%;
      font-size: 5.4vw;
      font-weight: bold; } }

@media screen and (min-width: 1001px) {
  .pl-PlayInfo_UndispatchedBunbo {
    width: 33%;
    letter-spacing: 3px; } }
@media screen and (min-width: 481px) and (max-width: 1000px) {
  .pl-PlayInfo_UndispatchedBunbo {
    width: 33%;
    letter-spacing: 0.1vw;
    font-size: 2vw; } }
@media screen and (max-width: 480px) {
  .pl-PlayInfo_UndispatchedBunbo {
    width: 50%;
    font-size: 5.4vw;
    letter-spacing: 0; } }

.pl-PlayInfo_UndispatchedButtonContainer {
  width: 50%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-align-items: center;
          align-items: center; }

.pl-PlayInfo_UndispatchedButton {
  background-color: white;
  border-radius: 50%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-align-items: center;
          align-items: center; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_UndispatchedButton {
      width: 50px;
      height: 50px;
      border-width: 4px;
      font-size: 0.8em; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_UndispatchedButton {
      width: 5vw;
      height: 5vw;
      border-width: 0.5vw;
      font-size: 1.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_UndispatchedButton {
      width: 10vw;
      height: 10vw;
      border-width: 1vw;
      font-size: 2.6vw; } }

.pl-PlayInfo_UndispatchedButton-hover {
  background-color: #ff7f7f; }

.pl-PlayInfo_TodaysCapsule {
  background-color: #ff7f7f;
  border-style: solid;
  border-color: #ff7f7f;
  width: 100%;
  overflow: hidden;
  display: -webkit-flex;
  display: flex; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_TodaysCapsule {
      border-radius: 4px;
      margin-bottom: 10px;
      border-width: 3px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_TodaysCapsule {
      border-radius: 0.5vw;
      margin-bottom: 1vw;
      border-width: 0.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_TodaysCapsule {
      border-radius: 1vw;
      margin-bottom: 1vw;
      border-width: 0.7vw; } }

.pl-PlayInfo_TodaysCapsuleTitle {
  background-color: #ff7f7f;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 1px;
  color: transparent; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_TodaysCapsuleTitle {
      width: 50%;
      height: 40px;
      background-image: url(../img/head-today.png);
      background-size: 130px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_TodaysCapsuleTitle {
      width: 50%;
      height: 4vw;
      background-image: url(../img/head-today.png);
      background-size: 14vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_TodaysCapsuleTitle {
      width: 70%;
      height: 6vw;
      background-image: url(../img/head-today-sp.png);
      background-size: 14vw; } }

.pl-PlayInfo_TodaysCapsuleBody {
  background-color: white;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-align-items: center;
          align-items: center;
  color: black; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_TodaysCapsuleBody {
      width: 50%;
      font-size: 24px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_TodaysCapsuleBody {
      width: 50%;
      font-size: 3vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_TodaysCapsuleBody {
      width: 30%;
      font-size: 3vw; } }

.pl-PlayInfo_Cost {
  background-color: yellow;
  background-color: #ff7f7f;
  border-style: solid;
  border-color: #ff7f7f;
  overflow: hidden;
  -webkit-align-items: center;
              -ms-grid-row-align: center;
          align-items: center; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_Cost {
      width: 49%;
      border-radius: 4px;
      margin-bottom: 10px;
      border-width: 3px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_Cost {
      width: 49%;
      border-radius: 0.5vw;
      margin-bottom: 1vw;
      border-width: 0.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_Cost {
      display: -webkit-flex;
      display: flex;
      width: 100%;
      border-radius: 1vw;
      margin-bottom: 1vw;
      border-width: 0.7vw; } }

.pl-PlayInfo_CostTitle {
  background-repeat: no-repeat;
  font-size: 1px;
  color: transparent; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_CostTitle {
      width: 100%;
      height: 30px;
      background-image: url(../img/head-1play.png), url(../img/kira.png);
      background-position: 12%, 98% 50%;
      background-size: 60px, 20px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_CostTitle {
      width: 100%;
      height: 4vw;
      background-image: url(../img/head-1play.png), url(../img/kira.png);
      background-position: 10%, 98% 50%;
      background-size: 8vw, 3vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_CostTitle {
      width: 50%;
      height: 4vw;
      background-image: url(../img/head-1play.png);
      background-position: center;
      background-size: 9vw; } }

.pl-PlayInfo_CostBody {
  background-color: white;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
          align-items: center;
  color: black; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_CostBody {
      -webkit-justify-content: flex-end;
              justify-content: flex-end;
      padding-right: 0.5em;
      height: 2em;
      width: 100%; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_CostBody {
      -webkit-justify-content: flex-end;
              justify-content: flex-end;
      padding-right: 0.5vw;
      height: 5vw;
      width: 100%; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_CostBody {
      -webkit-justify-content: space-around;
              justify-content: space-around;
      font-size: 3vw;
      width: 50%; } }

@media screen and (min-width: 481px) and (max-width: 1000px) {
  .pl-PlayInfo_CostNumber {
    font-size: 2vw; } }

.pl-PlayInfo_Point {
  background-color: magenta;
  background-color: #ff7f7f;
  border-style: solid;
  border-color: #ff7f7f;
  overflow: hidden;
  -webkit-align-items: center;
              -ms-grid-row-align: center;
          align-items: center; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_Point {
      width: 49%;
      border-radius: 4px;
      margin-bottom: 10px;
      border-width: 3px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_Point {
      width: 49%;
      border-radius: 0.5vw;
      margin-bottom: 1vw;
      border-width: 0.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_Point {
      width: 100%;
      border-radius: 1vw;
      margin-bottom: 1vw;
      border-width: 0.7vw; } }

.pl-PlayInfo_PointTitle {
  background-repeat: no-repeat;
  font-size: 1px;
  color: transparent; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_PointTitle {
      width: 100%;
      height: 30px;
      background-image: url(../img/head-point.png), url(../img/kira.png);
      background-position: 12%, 98% 50%;
      background-size: 80px, 20px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_PointTitle {
      width: 100%;
      height: 4vw;
      background-image: url(../img/head-point.png), url(../img/kira.png);
      background-position: 10%, 98% 50%;
      background-size: 10vw, 3vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_PointTitle {
      width: 100%;
      height: 6vw;
      background-image: url(../img/head-point.png);
      background-position: center;
      background-size: 18vw; } }

.pl-PlayInfo_PointBody {
  background-color: white;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
          align-items: center;
  color: black;
  width: 100%; }
  @media screen and (min-width: 1001px) {
    .pl-PlayInfo_PointBody {
      -webkit-justify-content: flex-end;
              justify-content: flex-end;
      padding-right: 0.5em;
      height: 2em; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-PlayInfo_PointBody {
      -webkit-justify-content: flex-end;
              justify-content: flex-end;
      padding-right: 0.5vw;
      height: 5vw; } }
  @media screen and (max-width: 480px) {
    .pl-PlayInfo_PointBody {
      -webkit-justify-content: space-around;
              justify-content: space-around;
      font-size: 3vw; } }

@media screen and (min-width: 481px) and (max-width: 1000px) {
  .pl-PlayInfo_PointNumber {
    font-size: 2vw; } }
