* {
  margin: 0;
  padding: 0;
  font-family: "游明朝 Medium", serif;
}
/* body */
body {
  font-size: 15px;
  background: #000000;
  color: #ffffff;
  min-height: 100vh;
}
@media screen and (max-width: 480px) {
  body {
    font-size: 13px;
  }
}
/* a */
a {
  color: #fd8b54;
}
a:hover {
  color: #e35535;
}
/* footer */
footer {
  border-top: 1px solid #e5e5e5;
  padding: 14px 0 17px;
  margin: 0;
  text-align: center;
  background: #000000;
}
footer img {
  height: 35px;
}
/* page top */
#page_top {
  position: fixed;
  bottom: 17px;
  right: 25px;
  font-size: 40px;
  display: none;
}
#page_top a {
  display: block;
  width: 50px;
  padding: 5px 0;
  text-decoration: none;
  background: transparent;
  text-align: center;
  color: #B5B5B5;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  border: 6px solid #B5B5B5;
  user-select: none;
}
#page_top a:hover {
  color: #999999;
  border: 6px solid #999999;
}
@media screen and (max-width: 1200px) {
  #page_top {
    bottom: 5px;
    right: 5px;
    font-size: 36px;
  }
  #page_top a {
    width: 43px;
    padding: 4px 0;
  }
}
/* body-scroll */
body#scroll {
  overflow: hidden;
  position: fixed;
}
body#scroll.scroll {
  animation-name: body-scroll-animation;
  animation-duration: 5s;
  animation-fill-mode: forwards;
}
/* body-scroll-animation */
@keyframes body-scroll-animation {
  0% {
    overflow: hidden;
    position: fixed;
  }
  100% {
    overflow: visible;
    position: static;
  }
}
/* loading */
#loading {
  position: fixed;
  height: 100svh;
  width: 100%;
  background: #000000;
  z-index: 99;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
#loading.fade {
  animation-name: loading-fade-animation;
  animation-duration: 2s;
  animation-fill-mode: forwards;
}
#loading img {
  pointer-events: none;
  user-select: none;
}
/* loading-fade-animation */
@keyframes loading-fade-animation {
  0% {
    opacity: 1;
    visibility: visible;
  }
  70% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
/* top */
#top {
  height: 100svh;
  width: 100%;
  background: url(bg.png) no-repeat center;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
#top img {
  width: calc(100% - 10px);
  max-width: 800px;
  pointer-events: none;
  user-select: none;
}
#top span.datetime {
  position: absolute;
  color: #ffffff;
  font-size: 50px;
  bottom: 10svh;
}
@media screen and (max-width: 600px) {
  #top span.datetime {
    font-size: 40px;
  }
}
@media screen and (max-width: 400px) {
  #top span.datetime {
    font-size: 30px;
  }
}
#top span.red {
  color: #ff0000;
}
/* contents thebeyond */
.contents.thebeyond {
  background: #ffffff;
  color: #000000;
}
.contents.thebeyond .contents_element .contents_title:before {
  background-image: url("icon_black.png");
}
.contents.thebeyond .contents_element .contents_title:after {
  border-bottom: solid 1px #000000;
}
.contents.thebeyond .contents_element .remarks {
  border: 2px solid #fc4e19;
  width: calc(100% - 4px);
  max-width: 800px;
  margin: 10px auto 0;
  color: #000000;
  background: #ffffff;
}
.contents.thebeyond .contents_element .remarks .remarks_text {
  display: inline-block;
  width: calc(100% - 14px);
  margin: 7px;
  text-align: center;
}
.contents.thebeyond .contents_element .remarks .remarks_text h1 {
  margin: 0;
  font-size: 24px;
}
.contents.thebeyond .contents_element .remarks .remarks_text p {
  margin: 0;
  font-size: 20px;
}
.contents.thebeyond .contents_element .remarks a.remarks_link {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #fc4e19;
  margin: 7px auto;
  padding: 7px 0;
  width: calc(100% - 20px);
  text-decoration: none;
  font-size: 20px;
  color: #000000;
  background: #ffffff;
  box-shadow: 0 0 10px #ff5e21;
}
.contents.thebeyond .contents_element .remarks a.remarks_link:hover {
  background: #d6d6d6;
}
@media screen and (max-width: 600px) {
  .contents.thebeyond .contents_element .remarks .remarks_text h1 {
    font-size: 20px;
  }
  .contents.thebeyond .contents_element .remarks .remarks_text p {
    font-size: 16px;
  }
  .contents.thebeyond .contents_element .remarks a.remarks_link {
    font-size: 18px;
  }
}
/* menu */
.menu {
  width: 100%;
  padding: 60px 0;
  background: #000000;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
}
.menu .menu_element {
  margin: 25px 0;
}
.menu .menu_element a {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  user-select: none;
}
.menu .menu_element a:hover {
  color: #df4b29;
}
.menu .menu_element a span.menu_title {
  font-size: 55px;
  line-height: 55px;
}
.menu .menu_element a span.menu_title span.small {
  font-size: 28px;
  vertical-align: middle;
}
.menu .menu_element a span.menu_sub {
  font-size: 25px;
  line-height: 25px;
}
.menu .separator {
  width: 50px;
  height: 1px;
  background: #535353;
}
@media screen and (max-width: 600px) {
  .menu .menu_element {
    margin: 20px 0;
  }
  .menu .menu_element a span.menu_title {
    font-size: 48px;
    line-height: 48px;
  }
  .menu .menu_element a span.menu_title span.small {
    font-size: 24px;
    vertical-align: middle;
  }
  .menu .menu_element a span.menu_sub {
    font-size: 22px;
    line-height: 22px;
  }
  .menu .separator {
    width: 45px;
  }
}
@media screen and (max-width: 480px) {
  .menu .menu_element {
    margin: 15px 0;
  }
  .menu .menu_element a span.menu_title {
    font-size: 40px;
    line-height: 40px;
  }
  .menu .menu_element a span.menu_title span.small {
    font-size: 20px;
    vertical-align: middle;
  }
  .menu .menu_element a span.menu_sub {
    font-size: 20px;
    line-height: 20px;
  }
  .menu .separator {
    width: 40px;
  }
}
/* title */
#title {
  position: relative;
  width: 100%;
  text-align: center;
  padding: 35px 0 0;
  background: url(bg.png) no-repeat center;
  background-size: cover;
  box-shadow: inset 0 50px 40px -40px #7d7d7d;
}
#title.lastboss {
  background: url(bg_lastboss.png) no-repeat center;
  background-size: cover;
  box-shadow: inset 0 50px 40px -40px #a53535;
}
#title:before {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: inset 0 -65px 50px -35px #000000;
}
@media screen and (max-width: 600px) {
  #title {
    padding: 30px 0 0;
  }
}
#title a {
  position: relative;
  display: inline-block;
  width: calc(100% - 10px);
  max-width: 300px;
  user-select: none;
}
#title a img {
  display: block;
  width: 100%;
  pointer-events: none;
  user-select: none;
}
/* contents */
.contents {
  padding: 15px 0 10px;
  width: 100%;
  background: #000000;
  text-align: center;
}
.contents .contents_element {
  display: inline-block;
  text-align: left;
  padding: 0 7px;
  width: calc(960px - 14px);
  border-bottom: 1px solid #999999;
}
.contents .contents_element:last-of-type {
  border-bottom: none;
}
@media screen and (max-width: 960px) {
  .contents .contents_element {
    width: calc(100% - 14px);
  }
}
.contents .contents_element p {
  margin: 0 40px 20px;
  font-size: 20px;
}
.contents .contents_element p.not_margin {
  margin: 0 40px;
}
.contents .contents_element p.jubeater {
  margin: 0 40px 30px;
  font-size: 16px;
}
.contents .contents_element h1 {
  margin: 10px 40px 3px;
  font-size: 24px;
}
.contents .contents_element h1.jubeater {
  margin: 15px 40px 20px;
  font-size: 26px;
}
.contents .contents_element h2.jubeater {
  margin: 10px 40px;
  font-size: 20px;
}
.contents .contents_element img {
  margin: 0 40px 10px;
  max-width: calc(100% - 82px);
}
.contents .contents_element img.border {
  border: 1px solid #999999;
}
.contents .contents_element ul {
  margin: 0 65px 15px;
}
.contents .contents_element ul.index {
  margin: 15px 65px 0;
}
@media screen and (max-width: 600px) {
  .contents .contents_element p {
    margin: 0 4px 15px;
    font-size: 16px;
  }
  .contents .contents_element p.not_margin {
    margin: 0 4px;
  }
  .contents .contents_element p.jubeater {
    margin: 0 4px 25px;
    font-size: 14px;
  }
  .contents .contents_element h1 {
    margin: 10px 4px 3px;
    font-size: 20px;
  }
  .contents .contents_element h1.jubeater {
    margin: 15px 4px 20px;
    font-size: 22px;
  }
  .contents .contents_element h2.jubeater {
    margin: 10px 4px;
    font-size: 18px;
  }
  .contents .contents_element img {
    margin: 0 4px 10px;
    max-width: calc(100% - 8px);
  }
  .contents .contents_element img.border {
    max-width: calc(100% - 8px - 2px);
  }
  .contents .contents_element ul {
    margin: 0 4px 15px 30px;
  }
  .contents .contents_element ul.index {
    margin: 15px 4px 0 30px;
  }
}
.contents .contents_element span.red {
  color: #ff0000;
}
.contents .contents_element span.yellow {
  color: #fff900;
}
.contents .contents_element span.blue {
  color: #6565f5;
}
.contents .contents_element span.bold {
  font-weight: bold;
}
.contents .contents_element span.light_blue {
  color: #60ddf3;
}
.contents .contents_element span.stage_a {
  color: #fffafa;
  text-shadow: 0 0 2px #ff9999, 0 0 8px #fd7373;
}
.contents .contents_element span.stage_a span.stage {
  color: #ff4848;
  text-shadow: 0 0 2px #ff9999, 0 0 8px #ffa7a7;
}
.contents .contents_element span.stage_b {
  color: #fffafa;
  text-shadow: 0 0 2px #8f8dff, 0 0 8px #676aff;
}
.contents .contents_element span.stage_b span.stage {
  color: #7982ff;
  text-shadow: 0 0 2px #8f8dff, 0 0 8px #676aff;
}
.contents .contents_element span.winners {
  color: #ff4848;
}
.contents .contents_element span.losers {
  color: #7982ff;
}
/* qualifiers */
.contents .contents_element .qualifiers {
  margin: 0 40px;
  width: calc(100% - 82px);
  max-width: 500px;
  border: 1px solid #cccccc;
}
@media screen and (max-width: 600px) {
  .contents .contents_element .qualifiers {
    margin: 0 4px;
    width: calc(100% - 8px);
  }
}
.contents .contents_element .qualifiers .qualifiers_row {
  display: flex;
  border-bottom: 1px solid #cccccc;
}
.contents .contents_element .qualifiers .qualifiers_row:last-of-type {
  border-bottom: none;
}
.contents .contents_element .qualifiers .qualifiers_row.lose {
  background: #492a2a;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_ranking {
  width: 20px;
  border-right: 1px solid #cccccc;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail {
  width: calc(100% - 20px - 1px);
  display: flex;
  flex-direction: column;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data {
  width: 100%;
  border-bottom: 1px dashed #858585;
  font-size: 13px;
  display: flex;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data:last-of-type {
  border-bottom: none;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data.team {
  border-bottom: 1px solid #cccccc;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data.team {
  font-size: 15px;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_label {
  display: flex;
  width: calc(100% - 90px - 5px - 5px);
  padding-left: 5px;
  word-break: break-all;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_label .qualifiers_stage {
  width: calc(100% - 90px);
  text-align: right;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_label .qualifiers_stage.a {
  color: #e96b6b;
  text-shadow: none;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_label .qualifiers_stage.b {
  color: #686ae9;
  text-shadow: none;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_label .qualifiers_user {
  width: 90px;
  text-align: right;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_score {
  width: 90px;
  text-align: right;
  padding-right: 5px;
}
.contents .contents_element .qualifiers .qualifiers_row .qualifiers_detail .qualifiers_data .qualifiers_score span.point {
  font-size: 11px;
}
/* main_result */
.contents .contents_element .main_result {
  margin: 0 40px;
  width: calc(100% - 82px);
  max-width: 500px;
  border: 1px solid #cccccc;
  margin-bottom: 12px;
}
@media screen and (max-width: 600px) {
  .contents .contents_element .main_result {
    margin: 0 4px 12px;
    width: calc(100% - 8px);
  }
}
.contents .contents_element .main_result .row {
  display: flex;
  border-bottom: 1px solid #cccccc;
  justify-content: center;
}
.contents .contents_element .main_result .row:last-of-type {
  border-bottom: none;
}
.contents .contents_element .main_result .row.round {
  background: #272727;
  font-size: 18px;
}
.contents .contents_element .main_result .row.lose {
  background: #492a2a;
}
.contents .contents_element .main_result .row .rank {
  width: 20px;
  border-right: 1px solid #cccccc;
  text-align: center;
}
.contents .contents_element .main_result .row .team_name {
  width: calc(100% - 21px - 5px - 95px);
  margin-left: 5px;
  border-right: 1px solid #cccccc;
}
.contents .contents_element .main_result .row .score {
  width: 90px;
  text-align: right;
  margin-right: 5px;
}
.contents .contents_element .main_result .row .score span.point {
  font-size: 11px;
}
/* thebeyond_result */
.contents .contents_element .thebeyond_result {
  margin: 0 40px;
  width: calc(100% - 82px);
  max-width: 500px;
  border-left: 1px solid #000000;
  overflow-x: auto;
  margin-bottom: 15px;
}
.contents .contents_element .thebeyond_result:last-of-type {
  margin-bottom: 0;
}
@media screen and (max-width: 600px) {
  .contents .contents_element .thebeyond_result {
    margin: 0 4px 12px;
    width: calc(100% - 8px);
  }
}
.contents .contents_element .thebeyond_result table {
  border: 1px solid #ffffff;
  border-collapse: collapse;
  border-spacing: 0;
  text-align: center;
}
.contents .contents_element .thebeyond_result table th,
.contents .contents_element .thebeyond_result table td {
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
  min-width: 24px;
  white-space: nowrap;
}
.contents .contents_element .thebeyond_result table .player_name {
  padding: 0 5px;
}
.contents .contents_element .thebeyond_result table .total {
  padding: 0 5px;
}
.contents .contents_element .thebeyond_result table .lose {
  background: #492a2a;
}
/* players */
.contents .contents_element .players {
  margin: 0 40px;
  width: calc(100% - 82px);
  max-width: 500px;
}
@media screen and (max-width: 600px) {
  .contents .contents_element .players {
    margin: 0 4px;
    width: calc(100% - 8px);
  }
}
.contents .contents_element .players .players_row {
  display: flex;
  margin-bottom: 25px;
  border: 1px solid #cccccc;
}
.contents .contents_element .players .players_row:last-of-type {
  margin-bottom: 0;
}
.contents .contents_element .players .players_row .players_ranking {
  width: 35px;
  border-right: 1px solid #cccccc;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contents .contents_element .players .players_row .players_detail {
  width: calc(100% - 35px - 1px);
  display: flex;
  flex-direction: column;
}
.contents .contents_element .players .players_row .players_detail .players_data {
  width: calc(100% - 5px);
  font-size: 13px;
  padding-left: 5px;
}
.contents .contents_element .players .players_row .players_detail .players_data.team {
  border-bottom: 1px solid #cccccc;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 17px;
}
.contents .contents_element .players .players_row .players_detail .players_data.player {
  display: flex;
}
.contents .contents_element .players .players_row .players_detail .players_data.player.\31 {
  border-bottom: 1px dashed #858585;
}
.contents .contents_element .players .players_row .players_detail .players_data.player.\32 {
  border-bottom: 1px solid #cccccc;
}
.contents .contents_element .players .players_row .players_detail .players_data.player .player_label {
  width: calc(50% - 5px - 1px);
  border-right: 1px dashed #cccccc;
}
.contents .contents_element .players .players_row .players_detail .players_data.player .player_value {
  width: calc(50% - 5px);
  padding-left: 5px;
}
/* photo */
.contents .contents_element .photo_wrapper {
  width: calc(100% - 80px);
  margin: 0 40px;
  display: flex;
}
@media screen and (max-width: 600px) {
  .contents .contents_element .photo_wrapper {
    margin: 0 4px;
    width: calc(100% - 8px);
  }
}
.contents .contents_element .photo_wrapper .photo {
  display: inline-block;
  width: calc(50% - 5px - 2px);
  border: 1px solid #999999;
  height: 0;
  padding-bottom: 28.1%;
  position: relative;
}
.contents .contents_element .photo_wrapper .photo:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition-duration: 0.5s;
}
@media screen and (max-width: 500px) {
  .contents .contents_element .photo_wrapper {
    flex-flow: column;
  }
  .contents .contents_element .photo_wrapper .photo {
    width: calc(100% - 2px);
    padding-bottom: 56.2%;
    margin: 0 0 10px !important;
  }
  .contents .contents_element .photo_wrapper .photo.four {
    margin-bottom: 0 !important;
  }
}
/* photo player1 */
.contents .contents_element .photo_wrapper.player1 .photo.one {
  margin-right: 5px;
  margin-bottom: 5px;
  background: url(jubeater/player1/photo1_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.one:after {
  background: url(jubeater/player1/photo1_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.one.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player1 .photo.two {
  margin-left: 5px;
  margin-bottom: 5px;
  background: url(jubeater/player1/photo2_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.two:after {
  background: url(jubeater/player1/photo2_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.two.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player1 .photo.three {
  margin-right: 5px;
  margin-top: 5px;
  background: url(jubeater/player1/photo3_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.three:after {
  background: url(jubeater/player1/photo3_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.three.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player1 .photo.four {
  margin-left: 5px;
  margin-top: 5px;
  background: url(jubeater/player1/photo4_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.four:after {
  background: url(jubeater/player1/photo4_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player1 .photo.four.color:after {
  opacity: 1;
}
/* photo player2 */
.contents .contents_element .photo_wrapper.player2 .photo.one {
  margin-right: 5px;
  margin-bottom: 5px;
  background: url(jubeater/player2/photo1_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.one:after {
  background: url(jubeater/player2/photo1_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.one.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player2 .photo.two {
  margin-left: 5px;
  margin-bottom: 5px;
  background: url(jubeater/player2/photo2_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.two:after {
  background: url(jubeater/player2/photo2_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.two.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player2 .photo.three {
  margin-right: 5px;
  margin-top: 5px;
  background: url(jubeater/player2/photo3_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.three:after {
  background: url(jubeater/player2/photo3_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.three.color:after {
  opacity: 1;
}
.contents .contents_element .photo_wrapper.player2 .photo.four {
  margin-left: 5px;
  margin-top: 5px;
  background: url(jubeater/player2/photo4_mono.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.four:after {
  background: url(jubeater/player2/photo4_color.jpg) no-repeat center;
  background-size: cover;
}
.contents .contents_element .photo_wrapper.player2 .photo.four.color:after {
  opacity: 1;
}
/* contents_title */
.contents .contents_element .contents_title {
  display: inline-block;
  width: calc(100% - 50px);
  height: 41px;
  line-height: 41px;
  margin: 5px 0;
  padding: 0 5px 0 45px;
  font-size: 24px;
  font-weight: bold;
  vertical-align: bottom;
  position: relative;
}
.contents .contents_element .contents_title.lastboss {
  color: #9f1919;
}
.contents .contents_element .contents_title:before {
  content: "";
  background-image: url("icon.png");
  background-size: contain;
  width: 34px;
  height: 34px;
  position: absolute;
  top: 1px;
  left: 0;
}
.contents .contents_element .contents_title.lastboss:before {
  background-image: url("icon_red.png");
}
@media screen and (max-width: 960px) {
  .contents .contents_element .contents_title:before {
    left: 5px;
  }
}
/* img rotate animation */
.contents .contents_element .contents_title.img_rotate:before {
  animation-name: img_rotate_animation;
  animation-duration: 2.5s;
  animation-fill-mode: forwards;
  transform: rotateY(0);
}
@keyframes img_rotate_animation {
  0% {
    transform: rotateY(0);
  }
  100% {
    transform: rotateY(720deg);
  }
}
.img_rotate_animation {
  transform: rotateY(0);
}
.contents .contents_element .contents_title:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-bottom: solid 1px #ffffff;
}
.contents .contents_element .contents_title.lastboss:after {
  border-bottom: solid 1px #9f1919;
}
/* under line aniamtion */
.contents .contents_title.under_line:after {
  animation-name: under_line_animation;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  width: 0;
}
@keyframes under_line_animation {
  0% {
    width: 0%;
  }
  20% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
.under_line_animation {
  width: 0;
}
/* music */
.music {
  width: calc(100% - 80px);
  max-width: 600px;
  border: 1px solid #7a7a7a;
  margin: 0 40px 20px;
}
.music div.music_element_wrapper {
  width: 100%;
  height: 220px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.music div.music_element_wrapper::-webkit-scrollbar {
  display: none;
}
.music div.music_label,
.music div.music_element_wrapper div.music_element {
  width: 100%;
  border-bottom: 1px solid #7a7a7a;
  font-size: 0;
}
.music div.music_label {
  display: table;
  border-bottom: 1px solid #7a7a7a;
  background: #363636;
}
.music div.music_element_wrapper div.music_element {
  display: table;
  border-bottom: 1px solid #3f3f3f;
}
.music div.music_element_wrapper div.music_element:last-of-type {
  border-bottom: none;
}
.music div.music_label div,
.music div.music_element_wrapper div.music_element div {
  display: table-cell;
  height: 100%;
  font-size: 16px;
  overflow-wrap: break-word;
  text-align: center;
  vertical-align: middle;
}
.music div.music_label div {
  border-right: 1px solid #7a7a7a;
  font-weight: bold;
}
.music div.music_element_wrapper div.music_element div {
  border-right: 1px dotted #3f3f3f;
}
.music div.music_label div:last-child,
.music div.music_element_wrapper div.music_element div:last-child {
  border-right: none;
}
.music div.music_label div.name,
.music div.music_element_wrapper div.music_element div.name {
  width: calc(100% - 61px - 60px - 5px);
  text-align: left;
  padding-left: 5px;
}
.music div.music_label div.diff,
.music div.music_element_wrapper div.music_element div.diff {
  width: 60px;
  padding: 0;
}
.music div.music_label div.diff.ext,
.music div.music_element_wrapper div.music_element div.diff.ext {
  color: #d10000;
}
.music div.music_label div.diff.adv,
.music div.music_element_wrapper div.music_element div.diff.adv {
  color: #e4c200;
}
.music div.music_label div.diff.bsc,
.music div.music_element_wrapper div.music_element div.diff.bsc {
  color: #00ca3d;
}
.music div.music_label div.lv,
.music div.music_element_wrapper div.music_element div.lv {
  width: 60px;
  padding: 0;
}
@media screen and (max-width: 600px) {
  .music {
    width: calc(100% - 8px);
    margin: 0 4px 15px;
  }
  .music div.music_label div,
  .music div.music_element_wrapper div.music_element div {
    font-size: 13px;
  }
  .music div.music_label div.name,
  .music div.music_element_wrapper div.music_element div.name {
    width: calc(100% - 41px - 40px - 5px);
    text-align: left;
    padding-left: 5px;
  }
  .music div.music_label div.diff,
  .music div.music_element_wrapper div.music_element div.diff {
    width: 40px;
  }
  .music div.music_label div.lv,
  .music div.music_element_wrapper div.music_element div.lv {
    width: 40px;
  }
}