.pl-Controller {
  width: 100%; }
  @media screen and (min-width: 1001px) {
    .pl-Controller {
      height: 235px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller {
      height: 29vw; } }
  @media screen and (max-width: 480px) {
    .pl-Controller {
      height: 37vw; } }

.pl-Controller_Container {
  width: 100%;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-justify-content: space-between;
          justify-content: space-between; }

.pl-Controller_Reservation {
  background-color: #ff7f7f;
  background-image: url(../img/head-book.png);
  background-repeat: no-repeat; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_Reservation {
      width: 49%;
      height: 60px;
      border-radius: 4px;
      background-size: 120px;
      background-position: center;
      margin-bottom: 10px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_Reservation {
      width: 49%;
      height: 6vw;
      border-radius: 0.5vw;
      background-size: 12vw;
      background-position: center;
      margin-bottom: 1vw; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_Reservation {
      width: 100%;
      height: 8vw;
      border-radius: 1vw;
      background-size: 12vw;
      background-position: center;
      margin-bottom: 1vw; } }

.pl-Controller_Camera {
  background-color: #ff7f7f;
  background-repeat: no-repeat; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_Camera {
      background-image: url(../img/btn_camera_pc.png);
      width: 100%;
      height: 60px;
      border-radius: 4px;
      background-size: 160px;
      background-position: center;
      margin-bottom: 10px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_Camera {
      background-image: url(../img/btn_camera_tab.png);
      width: 100%;
      height: 6vw;
      border-radius: 0.5vw;
      background-size: 14vw;
      background-position: center;
      margin-bottom: 1vw; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_Camera {
      background-image: url(../img/btn_camera_sp.png);
      width: 100%;
      height: 8vw;
      border-radius: 1vw;
      background-size: 16vw;
      background-position: center;
      margin-bottom: 1vw; } }

.pl-Controller_Play {
  background-image: url(../img/kira.png), url(../img/kira.png);
  background-repeat: no-repeat;
  background-color: #999;
  width: 100%;
  display: -webkit-flex;
  display: flex; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_Play {
      height: 165px;
      padding: 10px;
      border-radius: 4px;
      background-position: 2% 2%, 98% 98%;
      background-size: 20px; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_Play {
      height: 22.5vw;
      padding: 1vw;
      border-radius: 0.5vw;
      background-position: 2% 2%, 98% 98%;
      background-size: 2vw; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_Play {
      height: 21vw;
      padding: 1vw;
      border-radius: 0.5vw;
      background-position: 2% 2%, 98% 98%;
      background-size: 2vw; } }

.pl-Controller_PlayWheel {
  background-repeat: no-repeat;
  background-position: center; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayWheel {
      background-image: url(../img/btn_gacha_pc_gray.png);
      width: 100%;
      background-size: contain; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayWheel {
      background-image: url(../img/btn_gacha_tab_gray.png);
      width: 100%;
      background-size: 80%; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayWheel {
      background-image: url(../img/btn_gacha_sp_gray_a.png);
      width: 100%;
      background-size: 80%; } }

.pl-Controller_PlayWheelGacha {
  background-repeat: no-repeat;
  background-position: center; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayWheelGacha {
      background-image: url(../img/btn_gacha_pc.png);
      width: 100%;
      background-size: contain; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayWheelGacha {
      background-image: url(../img/btn_gacha_tab.png);
      width: 100%;
      background-size: 80%; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayWheelGacha {
      background-image: url(../img/btn_gacha_sp_a.png);
      width: 100%;
      background-size: 80%; } }

.pl-Controller_PlayWheelStart {
  background-repeat: no-repeat;
  background-position: center; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayWheelStart {
      background-image: url(../img/btn_start_pc.png);
      width: 100%;
      background-size: contain; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayWheelStart {
      background-image: url(../img/btn_start_tab.png);
      width: 100%;
      background-size: 80%; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayWheelStart {
      background-image: url(../img/btn_start_sp_a.png);
      width: 100%;
      background-size: 80%; } }

.pl-Controller_PlayWheelMawasu {
  background-repeat: no-repeat;
  background-position: center; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayWheelMawasu {
      background-image: url(../img/btn_spin_pc.png);
      width: 100%;
      background-size: contain; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayWheelMawasu {
      background-image: url(../img/btn_spin_tab.png);
      width: 100%;
      background-size: 80%; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayWheelMawasu {
      background-image: url(../img/btn_spin_sp_a.png);
      width: 100%;
      background-size: 80%; } }

.pl-Controller_PlayWheelSpin {
  background-repeat: no-repeat;
  background-image: url(../img/head-play-dial.png);
  background-position: center; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayWheelSpin {
      width: 100%;
      background-size: contain; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayWheelSpin {
      width: 100%;
      background-size: 80%; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayWheelSpin {
      width: 100%;
      background-size: 80%; } }

.pl-Controller_PlayTitle {
  background-image: url(../img/head-mawasu.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; }
  @media screen and (min-width: 1001px) {
    .pl-Controller_PlayTitle {
      width: 100%; } }
  @media screen and (min-width: 481px) and (max-width: 1000px) {
    .pl-Controller_PlayTitle {
      width: 100%;
      background-size: 4vw; } }
  @media screen and (max-width: 480px) {
    .pl-Controller_PlayTitle {
      width: 100%;
      background-size: 4vw; } }

.pl-Controller_Reservation-hover,
.pl-Controller_Play-hover,
.pl-Controller_Camera-hover {
  transition: 0.2s;
  opacity: 0.7;
  cursor: pointer; }

.pl-blink_bg {
  -webkit-animation: pl-blink_bg-keyframe 1.5s ease-in-out infinite;
          animation: pl-blink_bg-keyframe 1.5s ease-in-out infinite; }

@-webkit-keyframes pl-blink_bg-keyframe {
  0% {
    background-color: #3ac986; }
  50% {
    background-color: #ffd43a; }
  100% {
    background-color: #3ac986; } }

@keyframes pl-blink_bg-keyframe {
  0% {
    background-color: #3ac986; }
  50% {
    background-color: #ffd43a; }
  100% {
    background-color: #3ac986; } }
.pl-spin_bg {
  -webkit-animation: pl-spin_bg-keyframe 1.5s ease-in infinite;
          animation: pl-spin_bg-keyframe 1.5s ease-in infinite;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden; }

@-webkit-keyframes pl-spin_bg-keyframe {
  0% {
    background-color: #3ac986; }
  90% {
    background-color: #3ac986; }
  100% {
    background-color: #3ac986; } }

@keyframes pl-spin_bg-keyframe {
  0% {
    background-color: #3ac986; }
  90% {
    background-color: #3ac986; }
  100% {
    background-color: #3ac986; } }
.pl-spin {
  -webkit-animation: pl-spin-keyframe 1.5s linear 1;
          animation: pl-spin-keyframe 1.5s linear 1; }

@-webkit-keyframes pl-spin-keyframe {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes pl-spin-keyframe {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
