@charset "utf-8";

/*****************************************/
/* SP */
/*****************************************/
@media screen and (max-width: 959px) {
  /* main */
  .theater_wrapper {
    background: url("../img/theater/bg-sp.png");
    background-size: cover;
    padding-bottom: 60px;
  }
  .main {
    margin-top: 20px;
    padding-bottom: 0;
  }
  .movie_wrapper {
    width: 100%;
  }
  .movie_player {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    height: 0;
    padding-top: 56.25%;
  }
  .movie_player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 3px solid #fdc61b;
    box-sizing: border-box;
  }
  #commingsoon {
    background: gray;
    border: 3px solid #fdc61b;
    box-sizing: border-box;
  }
  #movie_title {
    text-align: center;
    height: 75px;
    margin-bottom: 10px !important;
    padding: 0 !important;
    overflow: hidden;
  }
  #movie_text {
    height: 114px;
    margin: 0 !important;
    overflow: hidden;
  }
  .movie_detail {
    margin: 0 14px 14px;
  }
  .bottom_theater {
    height: 350px;
    width: 100%;
    background: url("../img/theater/bottom_theater-sp.jpg") repeat-x;
    background-size: contain;
  }

  /* スライダー */
  .movie_thum {
    margin: 0 14px !important;
    padding-top: 26px;
  }
  .thum_player {
    margin-bottom: 14px;
  }
  .thum_player img {
    margin: 0 auto;
    width: 94%;
    max-width: 214px;
  }
  .thum_text {
    margin: 0 0 0 3% !important;
    font-size: 0.75rem;
    width: 94%;
    height: 84px;
    overflow: hidden;
  }

  /* slick update */
  .slick-prev {
    left: 5% !important;
  }
  .slick-next {
    right: 5% !important;
  }
  .slick-prev ,
  .slick-next {
    width: 44px !important;
    height: 44px !important;
    top: auto !important;
    bottom: -20% !important;
    -webkit-transform: translate(0, 0%) !important;
    -ms-transform: translate(0, 0%) !important;
    transform: translate(0, 0%) !important;
  }
  .slick-prev:before,
  .slick-next:before {
    content: "" !important;
    display: block !important;
    font-family: inherit !important;
    width: 44px !important;
    height: 44px !important;
  }
  .slick-prev:before {
    background: url("../img/theater/arrow_left.png") no-repeat center center;
    background-size: contain;
  }
  .slick-next:before {
    background: url("../img/theater/arrow_right.png") no-repeat center center;
    background-size: contain;
  }
  .slick-dots {
    width: 66% !important;
    left: 50% !important;
    bottom: -14% !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    -ms-transform: translateX(-50%) !important;
  }
  .slick-dots li {
    margin: 0 !important;
  }
  .slick-dots li button:before {
    font-family: inherit !important;
  }
  .slick-dots li button:before {
    font-size: 20px !important;
  }
  .slick-dots li.slick-active button:before {
    color: #fff !important;
  }
  .slick-current img {
    border: 3px solid #fdc61b;
    box-sizing: border-box;
  }
}
/*****************************************/
/* PC */
/*****************************************/
@media screen and (min-width: 960px) {
  /* main */
  #contents {
    background-color: #2c0e0b;
  }
  .theater_wrapper {
    background: url("../img/theater/bg.png") top center no-repeat;
    background-size: cover;
    background-position-y: -116px;
  }
  .main {
    margin-top: 80px;
    padding-bottom: 80px;
  }
  .movie_wrapper {
    margin: 0 auto;
    width: 100%;
    max-width: 1080px;
  }
  .movie_player {
    position: relative;
    margin-bottom: 32px;
    width: 100%;
    height: 0;
    padding-top: 56.25%;
  }
  .movie_player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 6px solid #fdc61b;
    box-sizing: border-box;
  }
  #commingsoon {
    background: gray;
    border: 6px solid #fdc61b;
    box-sizing: border-box;
  }
  #movie_title {
    font-size: 26px !important;
    height: 80px;
    overflow: hidden;
    padding: 0 !important;
    margin-bottom: 12px !important;
  }
  #movie_text {
    font-size: 16px;
    margin: 0 0 30px !important;
    height: 56px;
    overflow: hidden;
  }
  #movie_title span,
  #movie_text {
    text-align: center;
  }
  .movie_detail {
    margin: 0;
  }
  .bottom_theater {
    height: 400px;
    width: 100%;
    background: url("../img/theater/bottom_theater.png") repeat-x;
    background-size: contain;
  }

  /* スライダー */
  .movie_thum {
    margin: 0 !important;
    padding-top: 40px;
  }
  .thum_player {
    margin-bottom: 20px;
  }
  .thum_player img {
    margin: 0 auto;
    width: 94%;
    max-width: 348px;
  }
  .thum_text {
    margin: 0 0 0 3% !important;
    font-size: 1.1rem;
    width: 94%;
    height: 120px;
    overflow: hidden;
  }

  /* slick update */
  .slick-prev {
    left: 20% !important;
  }
  .slick-next {
    right: 20% !important;
  }
  .slick-prev ,
  .slick-next {
    width: 58px !important;
    height: 65px !important;
    top: 100px !important;
    bottom: auto !important;
    -webkit-transform: translate(0, 0%) !important;
    -ms-transform: translate(0, 0%) !important;
    transform: translate(0, 0%) !important;
    z-index: 100;
  }
  .slick-prev:before,
  .slick-next:before {
    content: "" !important;
    display: block !important;
    font-family: inherit !important;
    width: 58px !important;
    height: 65px !important;
  }
  .slick-prev:before {
    background: url("../img/theater/arrow_left.png") no-repeat center center;
    background-size: contain;
  }
  .slick-next:before {
    background: url("../img/theater/arrow_right.png") no-repeat center center;
    background-size: contain;
  }
  .slick-dots {
    display: none !important;
  }
  .slick-current img {
    border: 6px solid #fdc61b;
    box-sizing: border-box;
  }
  .slick-slide img {
    max-height: 232px;
  }
}