@media screen and (min-width: 1001px) {
  .pl-Layout {
    width: 800px;
    margin: 0 auto; } }
@media screen and (min-width: 481px) and (max-width: 1000px) {
  .pl-Layout {
    width: 100%;
    padding: 2.5vw; } }
@media screen and (max-width: 480px) {
  .pl-Layout {
    width: 100%;
    padding: 2vw; } }

.pl-Layout_Top {
  width: 100%; }
  @media screen and (min-width: 481px) {
    .pl-Layout_Top {
      display: -webkit-flex;
      display: flex; } }
  @media screen and (max-width: 480px) {
    .pl-Layout_Top {
      display: -webkit-flex;
      display: flex; } }

.pl-Layout_TopLeft {
  height: 100%; }
  @media screen and (min-width: 481px) {
    .pl-Layout_TopLeft {
      width: 60%; } }
  @media screen and (max-width: 480px) {
    .pl-Layout_TopLeft {
      width: 70%; } }

@media screen and (min-width: 481px) {
  .pl-Layout_TopRight {
    width: 40%;
    padding: 10px; } }
@media screen and (max-width: 480px) {
  .pl-Layout_TopRight {
    width: 30%;
    padding: 2vw; } }

.pl-Layout_Bottom {
  width: 100%; }

.pl-Dialog_Container {
  background: rgba(255, 255, 255, 0.9);
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 1000;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-align-items: center;
          align-items: center; }

.pl-Dialog {
  border-style: solid;
  border-color: #ff7f7f;
  background-color: #ff7f7f; }
  @media screen and (min-width: 1001px) {
    .pl-Dialog {
      width: 300px;
      border-radius: 4px;
      margin-bottom: 16px;
      border-width: 3px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Dialog {
      border-radius: 0.5vw;
      margin-bottom: 2.5vw;
      border-width: 0.4vw; } }
  @media screen and (max-width: 480px) {
    .pl-Dialog {
      border-radius: 1vw;
      margin-bottom: 2vw;
      border-width: 0.7vw; } }

.pl-Dialog_Body {
  background-color: white;
  text-align: center; }
  @media screen and (min-width: 1001px) {
    .pl-Dialog_Body {
      padding: 16px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Dialog_Body {
      padding: 2.5vw; } }
  @media screen and (max-width: 480px) {
    .pl-Dialog_Body {
      padding: 3vw; } }

.pl-Dialog_Body p:nth-child(2) {
  margin: 2em; }

.pl-Dialog_ButtonContainer {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
          justify-content: center;
  margin: 1em; }

.pl-Dialog_PointButton {
  background-image: url(./img/btn_play_point.png);
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  width: 10em;
  height: 3em;
  text-align: center;
  margin: 0 1em;
  padding: 0.2em 0; }

.pl-Dialog_NoButton {
  width: 10em;
  text-align: center;
  margin: 0 1em;
  padding: 0.2em 0; }