@charset "UTF-8";
@-webkit-keyframes top_visual {
  0% {
    top: 50%;
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    top: 0%;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@-o-keyframes top_visual {
  0% {
    top: 50%;
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    top: 0%;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@-moz-keyframes top_visual {
  0% {
    top: 50%;
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    top: 0%;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@keyframes top_visual {
  0% {
    top: 50%;
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    top: 0%;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@-webkit-keyframes alpha_blur {
  0% {
    opacity: 1;
    -webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
  }
}
@-o-keyframes alpha_blur {
  0% {
    opacity: 1;
    -webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
  }
}
@-moz-keyframes alpha_blur {
  0% {
    opacity: 1;
    -webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
  }
}
@keyframes alpha_blur {
  0% {
    opacity: 1;
    -webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
  }
}
@-webkit-keyframes down_image {
  0% {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-o-keyframes down_image {
  0% {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-moz-keyframes down_image {
  0% {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes down_image {
  0% {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes top_alpha {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes top_alpha {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes top_alpha {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes top_alpha {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.load .news_area, .load .intro_area, .load .staff_area, .load .movie_area, .load .link_area {
  opacity: 0;
}
.load .global_menu {
  opacity: 0;
}
.load .header_top {
  opacity: 0;
  -webkit-animation: top_alpha 1.4s ease-in forwards;
  -moz-animation: top_alpha 1.4s ease-in forwards;
  -o-animation: top_alpha 1.4s ease-in forwards;
  animation: top_alpha 1.4s ease-in forwards;
}

.main_area .catch1, .main_area .catch2, .main_area h1, .main_area .top_onair, .main_area .kv {
  opacity: 0;
}
@media only screen and (min-width: 751px) {
  .main_area.open .kv {
    -webkit-transform: translateY(-60%);
    -moz-transform: translateY(-60%);
    -ms-transform: translateY(-60%);
    -o-transform: translateY(-60%);
    transform: translateY(-60%);
    -webkit-animation: top_alpha 0.8s ease-in forwards, down_image 1.6s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.6s forwards;
    -moz-animation: top_alpha 0.8s ease-in forwards, down_image 1.6s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.6s forwards;
    -o-animation: top_alpha 0.8s ease-in forwards, down_image 1.6s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.6s forwards;
    animation: top_alpha 0.8s ease-in forwards, down_image 1.6s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.6s forwards;
  }
  .main_area.open .catch1, .main_area.open .catch2 {
    -webkit-animation: alpha_blur 1.3s ease-out 3s forwards;
    -moz-animation: alpha_blur 1.3s ease-out 3s forwards;
    -o-animation: alpha_blur 1.3s ease-out 3s forwards;
    animation: alpha_blur 1.3s ease-out 3s forwards;
  }
  .main_area.open h1, .main_area.open .top_onair {
    -webkit-animation: top_alpha 1.3s ease-out 3s forwards;
    -moz-animation: top_alpha 1.3s ease-out 3s forwards;
    -o-animation: top_alpha 1.3s ease-out 3s forwards;
    animation: top_alpha 1.3s ease-out 3s forwards;
  }
}
@media only screen and (max-width: 750px) {
  .main_area.open .kv {
    -webkit-animation: top_alpha 0.8s ease-in forwards;
    -moz-animation: top_alpha 0.8s ease-in forwards;
    -o-animation: top_alpha 0.8s ease-in forwards;
    animation: top_alpha 0.8s ease-in forwards;
  }
  .main_area.open .catch1, .main_area.open .catch2 {
    -webkit-animation: alpha_blur 1.3s ease-out 1.2s forwards;
    -moz-animation: alpha_blur 1.3s ease-out 1.2s forwards;
    -o-animation: alpha_blur 1.3s ease-out 1.2s forwards;
    animation: alpha_blur 1.3s ease-out 1.2s forwards;
  }
  .main_area.open h1, .main_area.open .top_onair {
    -webkit-animation: top_alpha 1.3s ease-out 1.2s forwards;
    -moz-animation: top_alpha 1.3s ease-out 1.2s forwards;
    -o-animation: top_alpha 1.3s ease-out 1.2s forwards;
    animation: top_alpha 1.3s ease-out 1.2s forwards;
  }
}
.main_area.soon .kv {
  -webkit-animation: top_alpha 0.8s ease-in forwards;
  -moz-animation: top_alpha 0.8s ease-in forwards;
  -o-animation: top_alpha 0.8s ease-in forwards;
  animation: top_alpha 0.8s ease-in forwards;
}
.main_area.soon .catch1, .main_area.soon .catch2 {
  -webkit-animation: alpha_blur 0.8s ease-out forwards;
  -moz-animation: alpha_blur 0.8s ease-out forwards;
  -o-animation: alpha_blur 0.8s ease-out forwards;
  animation: alpha_blur 0.8s ease-out forwards;
}
.main_area.soon h1, .main_area.soon .top_onair {
  -webkit-animation: top_alpha 0.8s ease-out forwards;
  -moz-animation: top_alpha 0.8s ease-out forwards;
  -o-animation: top_alpha 0.8s ease-out forwards;
  animation: top_alpha 0.8s ease-out forwards;
}

/*******************************************/
.main_area {
  position: relative;
}
.main_area h1 {
  position: absolute;
  width: 100%;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .main_area {
    margin: 0 auto 157px;
    top: 110px;
  }
  .main_area .kv img {
    width: 100%;
  }
  .main_area .catch1, .main_area .catch2 {
    position: fixed;
    top: 30px;
    text-align: center;
  }
  .main_area .catch1.stop, .main_area .catch2.stop {
    position: absolute;
  }
  .main_area .catch1.start, .main_area .catch2.start {
    position: absolute;
    top: 30px;
  }
  .main_area .catch1 {
    right: 60px;
    width: 128px;
    width: 10%;
    max-width: 128px;
  }
  .main_area .catch2 {
    left: 60px;
    width: 90px;
    width: 7.03%;
    max-width: 90px;
  }
  .main_area h1 {
    bottom: 13%;
  }
  .main_area h1 img {
    width: 400px;
    width: 31.25%;
    max-width: 400px;
  }
  .main_area .top_onair {
    text-align: center;
    width: 58%;
    position: absolute;
    bottom: 80px;
    left: 50%;
    margin-left: -28%;
  }
}
@media only screen and (max-width: 750px) {
  .main_area {
    margin-bottom: 112px;
    top: 70px;
  }
  .main_area .catch1, .main_area .catch2 {
    position: absolute;
    top: 6.8vw;
  }
  .main_area .catch1 {
    right: 3vw;
    width: 128px;
    width: 17.06%;
    max-width: 128px;
  }
  .main_area .catch2 {
    left: 3vw;
    width: 90px;
    width: 12%;
    max-width: 90px;
  }
  .main_area h1 {
    bottom: 11%;
  }
  .main_area h1 img {
    width: 48%;
  }
  .main_area .top_onair {
    width: 544px;
    width: 72.53%;
    max-width: 544px;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

.link_area {
  text-align: center;
}
.link_area p:last-child {
  margin-bottom: 0;
}
@media only screen and (min-width: 751px) {
  .link_area {
    margin-bottom: 100px;
  }
  .link_area a {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    cursor: pointer;
  }
  .link_area a:hover {
    opacity: 0.6;
  }
  .link_area p {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 750px) {
  .link_area {
    width: 80vw;
    margin: 0 auto 12vw;
  }
  .link_area p {
    margin-bottom: 4vw;
  }
}

.news_area {
  position: relative;
}
.news_area:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 300px;
  background: url("../img/common/bg/bg_black_repeat_down.png") repeat-x center top;
  z-index: 0;
}
.news_area h2 {
  text-align: center;
}
.news_area ul {
  border-top: 1px solid #474747;
  position: relative;
  z-index: 3;
}
.news_area ul li {
  border-bottom: 1px solid #474747;
  background: url("../img/common/bullet_news.png") no-repeat left top;
  font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, sans-serif;
  position: relative;
}
.news_area ul li .date {
  color: #c30017;
}
.news_area ul li .title {
  line-height: 1.4;
}
.news_area ul li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: block;
}
@media only screen and (min-width: 751px) {
  .news_area:after {
    bottom: -240px;
  }
  .news_area h2 {
    margin-bottom: 60px;
  }
  .news_area h2 img {
    width: auto;
    height: 210px;
  }
  .news_area ul {
    width: 900px;
    margin: auto;
  }
  .news_area ul li {
    padding: 30px 25px;
    -webkit-background-size: 14px;
    -o-background-size: 14px;
    background-size: 14px;
    background-position: left 32px;
  }
  .news_area ul li .date {
    font-size: 14px;
    margin-bottom: 10px;
  }
}
@media only screen and (max-width: 750px) {
  .news_area:after {
    height: 180px;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    bottom: -100px;
  }
  .news_area h2 {
    width: 425px;
    width: 56.66%;
    max-width: 425px;
    margin: 0 auto 8%;
  }
  .news_area ul {
    margin: 0 5%;
  }
  .news_area ul li {
    padding: 6% 5%;
    background-position: left 30%;
    -webkit-background-size: 8px;
    -o-background-size: 8px;
    background-size: 8px;
  }
  .news_area ul li .date {
    font-size: 10px;
    margin-bottom: 6px;
  }
  .news_area ul li .title {
    font-size: 13px;
  }
}

.intro_area {
  background: url("../img/common/bg/bg_repeat_blue.jpg");
}
.intro_area h2 {
  text-align: center;
}
.intro_area .intro_text, .intro_area .story_text {
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .intro_area {
    padding-top: 340px;
    padding-bottom: 340px;
  }
  .intro_area h2 {
    margin-bottom: 60px;
  }
  .intro_area h2 img {
    width: auto;
    height: 210px;
  }
  .intro_area .intro_text .cap, .intro_area .story_text .cap {
    margin-bottom: 40px;
  }
  .intro_area .intro_text .intro_text, .intro_area .story_text .intro_text {
    line-height: 2.8;
    font-size: 22px;
  }
  .intro_area .intro_text {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 750px) {
  .intro_area {
    padding: 160px 0;
  }
  .intro_area h2 {
    width: 660px;
    width: 88%;
    max-width: 660px;
    margin: 0 auto 8%;
  }
  .intro_area .intro_text {
    font-size: 12px;
    line-height: 2.8;
    margin-bottom: 10vw;
  }
  .intro_area .intro_text .cap {
    margin-bottom: 4vw;
  }
}

.staff_area {
  position: relative;
}
.staff_area:before, .staff_area:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 300px;
  z-index: 0;
}
.staff_area:before {
  background: url("../img/common/bg/bg_black_repeat_top.png") repeat-x center bottom;
}
.staff_area:after {
  background: url("../img/common/bg/bg_black_repeat_down.png") repeat-x center top;
}
.staff_area h2 {
  position: relative;
  z-index: 3;
  text-align: center;
}
.staff_area .staff_cap {
  background: url("../img/common/tab_base_w.png") no-repeat center;
  -webkit-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
  text-align: center;
  color: #000;
}
.staff_area .staff_list, .staff_area .cast_list {
  position: relative;
  z-index: 3;
  text-align: center;
}
.staff_area .staff_list ul, .staff_area .cast_list ul {
  letter-spacing: -.4em;
}
.staff_area .staff_list li, .staff_area .cast_list li {
  letter-spacing: 0.1em;
  display: inline-block;
}
.staff_area .staff_list li .role, .staff_area .cast_list li .role {
  color: #c30017;
}
@media only screen and (min-width: 751px) {
  .staff_area:before {
    top: -240px;
  }
  .staff_area:after {
    bottom: -240px;
  }
  .staff_area h2 {
    margin-bottom: 60px;
  }
  .staff_area h2 img {
    width: auto;
    height: 210px;
  }
  .staff_area .staff_cap {
    width: 212px;
    height: 62px;
    line-height: 62px;
    margin: 0 auto 60px;
  }
  .staff_area ul li {
    margin: 0 35px 30px;
  }
  .staff_area ul li .role {
    font-size: 12px;
    margin-bottom: 10px;
  }
  .staff_area ul li .name {
    font-size: 22px;
  }
  .staff_area ul li .name span {
    font-size: 16px;
  }
  .staff_area .staff_list {
    margin-bottom: 80px;
  }
}
@media only screen and (max-width: 750px) {
  .staff_area:after {
    height: 180px;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    bottom: -100px;
  }
  .staff_area:before {
    height: 180px;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    top: -100px;
  }
  .staff_area h2 {
    width: 245px;
    width: 32.66%;
    max-width: 245px;
    margin: 0 auto 8%;
  }
  .staff_area .staff_cap {
    width: 40%;
    padding: 16px 0;
    margin: 0 auto 7%;
    font-size: 13px;
  }
  .staff_area li {
    margin: 0 12px 20px;
  }
  .staff_area li .role {
    font-size: 10px;
    margin-bottom: 6px;
  }
  .staff_area li .name {
    font-size: 12px;
  }
  .staff_area li .name span {
    font-size: 10px;
  }
  .staff_area .staff_list {
    margin-bottom: 14%;
  }
  .staff_area .cast_list ul {
    margin: 0 14%;
  }
}

.movie_area {
  background: url("../img/common/bg/bg_repeat_red.jpg");
}
.movie_area h2 {
  text-align: center;
}
.movie_area .movie_list {
  position: relative;
}
.movie_area .movie_list .thumb {
  position: relative;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.movie_area .movie_list .thumb:after {
  content: "";
  display: block;
  position: absolute;
  background: url("../img/common/btn_play.png") no-repeat center rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
}
.movie_area .movie_list .move_wrap {
  float: left;
}
.movie_area .movie_list .slick-prev, .movie_area .movie_list .slick-next {
  background: no-repeat;
  border: none;
  position: absolute;
  z-index: 5;
  color: #FFF;
  bottom: 0;
  left: 50%;
  font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, sans-serif;
}
.movie_area .movie_list .slick-next {
  background-image: url("../img/common/arrow_next.png");
  background-position: right center;
}
.movie_area .movie_list .slick-prev {
  background-image: url("../img/common/arrow_prev.png");
  background-position: left center;
}
@media only screen and (min-width: 751px) {
  .movie_area {
    padding: 340px 0 180px;
    overflow: hidden;
  }
  .movie_area h2 {
    margin-bottom: 60px;
  }
  .movie_area h2 img {
    width: auto;
    height: 210px;
  }
  .movie_area .movie_list {
    position: relative;
    width: 1050px;
    margin: auto;
    padding-bottom: 40px;
  }
  .movie_area .movie_list .move_wrap {
    width: 500px;
    margin-right: 50px;
  }
  .movie_area .movie_list .move_wrap .thumb {
    height: 284px;
    margin-bottom: 20px;
    cursor: pointer;
  }
  .movie_area .movie_list .move_wrap .thumb:after {
    -webkit-background-size: 80px;
    -o-background-size: 80px;
    background-size: 80px;
  }
  .movie_area .movie_list .move_wrap .thumb:hover:after {
    background-color: transparent;
  }
  .movie_area .movie_list .move_wrap .m_ttl {
    font-size: 14px;
  }
  .movie_area .movie_list .slick-prev, .movie_area .movie_list .slick-next {
    width: 70px;
    height: 20px;
    font-size: 14px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    cursor: pointer;
  }
  .movie_area .movie_list .slick-prev:hover, .movie_area .movie_list .slick-next:hover {
    opacity: 0.6;
  }
  .movie_area .movie_list .slick-prev {
    margin-left: -100px;
  }
  .movie_area .movie_list .slick-next {
    margin-left: 30px;
  }
}
@media only screen and (max-width: 750px) {
  .movie_area {
    padding: 160px 0 80px;
  }
  .movie_area h2 {
    width: 425px;
    width: 56.66%;
    max-width: 425px;
    margin: 0 auto 8%;
  }
  .movie_area .movie_list {
    padding-bottom: 40px;
  }
  .movie_area .movie_list .move_wrap {
    width: 300px;
    margin-right: 30px;
  }
  .movie_area .movie_list .move_wrap .thumb {
    height: 180px;
    margin-bottom: 10px;
  }
  .movie_area .movie_list .move_wrap .thumb:after {
    -webkit-background-size: 50px;
    -o-background-size: 50px;
    background-size: 50px;
  }
  .movie_area .movie_list .move_wrap .m_ttl {
    font-size: 13px;
    line-height: 1.4;
  }
  .movie_area .movie_list .slick-prev, .movie_area .movie_list .slick-next {
    width: 6em;
    height: 20px;
    font-size: 12px;
  }
  .movie_area .movie_list .slick-prev {
    margin-left: -8em;
  }
  .movie_area .movie_list .slick-next {
    margin-left: 2em;
  }
}

.floatcontents .btn_moviepage {
  position: absolute;
  background: url("../img/common/tab_base_long_w.png") no-repeat center;
  -webkit-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
}
.floatcontents .btn_moviepage a {
  display: block;
  color: #000;
  text-decoration: none;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .floatcontents .btn_moviepage {
    width: 340px;
    margin: auto;
    height: 77px;
    line-height: 77px;
    left: 50%;
    top: 50%;
    margin-top: 240px;
    margin-left: -170px;
  }
}
@media only screen and (max-width: 750px) {
  .floatcontents .btn_moviepage {
    width: 80%;
    left: 10%;
    top: 50%;
    margin-top: 40%;
  }
  .floatcontents .btn_moviepage a {
    font-size: 14px;
    padding: 20px 0;
  }
}

.float2020 .images {
  position: absolute;
}
.float2020 .images .catch {
  position: absolute;
  width: 100%;
  text-align: center;
  line-height: 1.4;
  color: #000;
}
.float2020 .images .chara_voice p {
  position: absolute;
  cursor: pointer;
}
.float2020 .images .chara_voice .zennitsu {
  width: 20%;
  height: 45%;
  bottom: 7%;
  left: 0;
}
.float2020 .images .chara_voice .inosuke {
  width: 20%;
  left: 20%;
  height: 45%;
  bottom: 7%;
}
.float2020 .images .chara_voice .rengoku {
  width: 20%;
  left: 40%;
  bottom: 7%;
  height: 66%;
}
.float2020 .images .chara_voice .neduko {
  width: 20%;
  left: 60%;
  bottom: 9%;
  height: 56%;
}
.float2020 .images .chara_voice .tanjiro {
  width: 20%;
  left: 76%;
  top: 9%;
  height: 50%;
}
@media only screen and (min-width: 751px) {
  .float2020 {
    position: fixed;
  }
  .float2020 .close {
    width: 30px;
    height: 30px;
    position: absolute;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    cursor: pointer;
    top: 20px;
    right: 20px;
  }
  .float2020 .close:hover {
    opacity: 0.6;
  }
  .float2020 .images {
    width: 65%;
    max-width: 1200px;
    text-align: center;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .float2020 .images .catch {
    top: 15px;
    font-size: 18px;
  }
}
@media only screen and (max-width: 750px) {
  .float2020 {
    position: fixed;
  }
  .float2020 .images {
    top: 20%;
  }
  .float2020 .images .catch {
    color: #FFF;
    top: -3em;
    font-size: 12px;
  }
  .float2020 .close {
    width: 30px;
    height: 30px;
    left: 50%;
    top: 50%;
    margin: 23% 0 0 -15px;
  }
}

.bc_play {
  position: fixed;
  height: 0;
  overflow: hidden;
  top: -100%;
}
