/* ---------------------------------------------------------
performer_area
--------------------------------------------------------- */
.performer_area {
  margin: 0 0 .6rem 0;
}

@media screen and (max-width: 750px) {
  .performer_area {
    padding: 0 .62rem;
  }
}

.performer_area .bg {
  background: #fff;
}

@media screen and (min-width: 751px) {
  .performer_area .bg {
    margin: 0 0 0 auto;
    padding: .5rem .32rem .5rem 1.38rem;
    border-radius: .2rem 0 0 .2rem;
    width: calc(50% + 4.5rem);
  }
}

@media screen and (max-width: 750px) {
  .performer_area .bg {
    padding: .5rem;
    border-radius: .2rem;
  }
}

@media screen and (min-width: 751px) {
  .performer_area .inner {
    margin: 0 auto 0 0;
    max-width: 9.52rem;
  }
}

@media screen and (min-width: 751px) {
  .performer_area .summary_area {
    margin: 0 0 .5rem 0;
    padding: 0 0 .5rem 0;
    border-bottom: .02rem solid #bfbfbf;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

@media screen and (max-width: 750px) {
  .performer_area .summary_area {
    margin: 0 0 .7rem 0;
  }
}

.performer_area h2 {
  padding: .1rem 0 0 0;
  position: relative;
  font-weight: bold;
  font-size: .44rem;
}

@media screen and (min-width: 751px) {
  .performer_area h2 {
    width: 3.28rem;
  }
}

@media screen and (max-width: 750px) {
  .performer_area h2 {
    margin: 0 0 .12rem 0;
  }
}

.performer_area h2::before {
  position: absolute;
  top: 0;
  left: 0;
  width: .6rem;
  height: .05rem;
  content: '';
  background: #f3385b;
}

.performer_area .txt_area {
  line-height: 1.85;
}

@media screen and (min-width: 751px) {
  .performer_area .txt_area {
    width: calc(100% - 3.28rem);
    font-size: .16rem;
  }
}

@media screen and (max-width: 750px) {
  .performer_area .txt_area {
    font-size: .28rem;
  }
}

.performer_area .txt_area p {
  margin: 0 0 .3rem 0;
}

.performer_area .txt_area p:last-child {
  margin: 0;
}

@media screen and (min-width: 751px) {
  .performer_area .performer_list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
}

.performer_area .performer_list li:last-child {
  margin: 0;
}

@media screen and (min-width: 751px) {
  .performer_area .performer_list li {
    margin: 0 .32rem 0 0;
    width: calc(100% / 3);
    text-align: center;
  }
}

@media screen and (max-width: 750px) {
  .performer_area .performer_list li {
    margin: 0 0 .36rem 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .performer_area .performer_list li img {
    width: 2.97rem;
  }
  .performer_area .performer_list li .profile {
    width: calc(100% - 2.97rem);
  }
  .performer_area .performer_list li:nth-child(odd) .profile {
    margin: 0 0 0 .3rem;
  }
  .performer_area .performer_list li:nth-child(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
  .performer_area .performer_list li:nth-child(even) .profile {
    margin: 0 .3rem 0 0;
    text-align: right;
  }
}

@media screen and (min-width: 751px) {
  .performer_area .performer_list img {
    margin: 0 0 .2rem 0;
  }
}

.performer_area .performer_list .artist {
  margin: 0 0 .05rem 0;
  line-height: 1.3;
  font-size: .14rem;
}

@media screen and (max-width: 750px) {
  .performer_area .performer_list .artist {
    font-size: .24rem;
  }
}

.performer_area .performer_list .name {
  font-weight: bold;
  font-size: .18rem;
}

@media screen and (max-width: 750px) {
  .performer_area .performer_list .name {
    font-size: .28rem;
  }
}
/*# sourceMappingURL=top_performer.css.map */