* {
  margin: 0;
  padding: 0;
}
body {
  margin: 0;
  padding: 0;
}

.content {
  width: 6.73rem;
  margin: 0 auto;
  overflow: hidden;
  font-family: Calibri;
}

.product-box {
  width: 100%;
  display: flex;
  box-sizing: border-box;
  padding-top: 0.61rem;
}
.pro-logo {
  width: 1.17rem;
  height: 1.17rem;
}
.pro-name-box {
  margin-left: 0.4rem;
  padding: 0;
}
.pro-name-box div {
  line-height: 1;
}
.pro-name1 {
  font-size: 0.43rem;
  color: #1a1b1e;
  line-height: 0.19rem;
  margin-bottom: 0.1rem;
}
.pro-name2 {
  font-size: 0.32rem;
  color: #0a8860;
  margin-bottom: 0.1rem;
}
.pro-name3 {
  font-size: 0.22rem;
  color: #878787;
}
.pro-score-box {
  display: flex;
  margin-top: 1rem;
  align-items: center;
  margin-bottom: 0.71rem;
}
.score-box {
  font-size: 0.26rem;
}
.border-r {
  height: 0.39rem;
  width: 1px;
  background: #ebebeb;
  margin: 0 0.38rem;
}
.score-title {
  margin-bottom: 0.2rem;
}
.score-title img {
  width: 0.18rem;
  height: 0.17rem;
}
.score-bottom {
  font-size: 0.22rem;
  color: #878787;
}
.score-bottom img {
  width: 0.17rem;
  height: 0.17rem;
}
.down-box {
  font-size: 0.26rem;
}
.grading-box {
  font-size: 0.22rem;
  text-align: center;
}
.grading-title-img {
  width: 0.26rem;
  height: 0.27rem;
}
.down-btn {
  width: 100%;
  height: 0.59rem;
  background: #01875f;
  border-radius: 0.14rem;
  font-size: 0.26rem;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
.app-store-btn {
  width: 100%;
  height: 0.59rem;
  background: #fff;
  border-radius: 0.14rem;
  font-size: 0.26rem;
  color: #01875f;
  border: 1px solid #e0e0e0;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  margin-top: 0.19rem;
  font-weight: bold;
  margin-bottom: 0.36rem;
}
.share-box {
  display: flex;
}
.share-left,
.share-right {
  display: flex;
}
.share-left {
  margin-left: 1.59rem;
  margin-right: 0.59rem;
}
.share-left img {
  width: 0.3rem;
  height: 0.31rem;
  margin-right: 0.19rem;
}
.share-box span {
  font-size: 0.26rem;
  font-weight: bold;
  color: #01875f;
}
.share-right img {
  width: 0.22rem;
  height: 0.3rem;
  margin-right: 0.21rem;
}
.my-swiper {
  margin-top: 1rem;
  margin-bottom: 0.37rem;
  width: 100%;
  height: 3.43rem;
  position: relative;
}
.swiper-slide {
  height: 3.43rem;
}
.my-swiper .swiper-slide1 {
  width: 4.04rem;
  background-image: url('../img/lb1.png');
  background-size: 100% 100%;
}

.my-swiper .swiper-slide2 {
  width: 1.96rem;
  background-image: url('../img/lb2.png');
  background-size: 100% 100%;
}

.my-swiper .swiper-slide3 {
  background-image: url('../img/lb3.png');
  background-size: 100% 100%;
  width: 1.95rem;
}

.my-swiper .swiper-slide4 {
  background-image: url('../img/lb4.png');
  background-size: 100% 100%;
  width: 1.95rem;
}
.my-swiper .swiper-slide5 {
  background-image: url('../img/lb5.png');
  background-size: 100% 100%;
  width: 1.95rem;
}
.my-swiper .swiper-slide6 {
  background-image: url('../img/lb6.png');
  background-size: 100% 100%;
  width: 4.04rem;
}

@keyframes scaleDraw {
  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
  0% {
    transform: scale(1); /* 开始 为原始大小*/
  }
  25% {
    transform: scale(1.05); /*放大1.1倍*/
  }
  50% {
    transform: scale(1);
  }
  75% {
    transform: scale(1.05);
  }
}
.about-game-title,
.rate-title {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}
.about-game-title p,
.rate-title p {
  font-size: 0.32rem;
  color: #3d3e41;
}
.about-game-title img,
.rate-title img {
  width: 0.22rem;
  height: 0.2rem;
}
.about-game-text {
  font-size: 0.26rem;
  color: #64686d;
  margin-bottom: 0.4rem;
}
.update-title {
  font-size: 0.32rem;
  color: #3d3e41;
  margin-bottom: 0.16rem;
}
.update-text {
  font-size: 0.26rem;
  color: #64686d;
  margin-bottom: 0.4rem;
}
.game-type-box {
  display: flex;
  margin-bottom: 0.5rem;
}
.game-type-btn {
  width: 1.27rem;
  height: 0.52rem;
  border: 1px solid #dcdee2;
  border-radius: 0.26rem;
  font-size: 0.27rem;
  color: #64686d;
  margin-right: 0.19rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rate-bottom {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}
.rate-bottom p {
  font-size: 0.22rem;
  margin-right: 0.1rem;
  color: #878787;
}
.rate-bottom img {
  width: 0.17rem;
  height: 0.17rem;
}
.device-type-box {
  display: flex;
  margin-bottom: 0.5rem;
}
.device-type-btn {
  height: 0.32rem;
  padding: 0.12rem 0.3rem;
  border: 1px rgb(218, 220, 224) solid;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.15rem;
  border-radius: 0.32rem;
}
.device-type-btn img {
  margin-right: 0.1rem;
}
.device-type-btn1 img {
  width: 0.16rem;
  height: 0.25rem;
}
.device-type-btn2 img {
  width: 0.21rem;
  height: 0.25rem;
}
.device-type-btn3 img {
  width: 0.28rem;
  height: 0.19rem;
}
.device-type-btn span {
  font-size: 0.3rem;
}
.device-type-btn-active {
  background: #e6f3ef;
  color: #056449;
  border: none;
}
.rate-detail-box {
  display: flex;
  margin-bottom: 0.5rem;
}
.rate-detail-left {
  margin-right: 0.52rem;
}
.rate-num {
  font-size: 1.02rem;
}
.rate-img {
  display: flex;
  margin-bottom: 0.3rem;
}
.rate-img img {
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.03rem;
}
.rate-text {
  font-size: 0.22rem;
}
.rate-item {
  font-size: 0.22rem;
  display: flex;
  align-items: center;
}
.rate-item span {
  margin-right: 0.1rem;
}
.progress {
  position: relative;
  height: 0.2rem;
  width: 4rem;
  border-radius: 0.2rem;
  background: #e8eaed;
}
.progress:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: #01875f;
  border-radius: 0.2rem;
}
.progress1:before {
  width: 75%;
}
.progress2:before {
  width: 10%;
}
.progress3:before {
  width: 8%;
}
.progress4:before {
  width: 5%;
}
.progress5:before {
  width: 6%;
}
.comment-item {
  margin-bottom: 0.4rem;
}
.flex {
  display: flex;
  align-items: center;
}
.comment-title {
  position: relative;
  margin-bottom: 0.45rem;
}
.comment-title-left {
  justify-content: center;
  width: 0.51rem;
  height: 0.51rem;
  background-color: #7b1fa2;
  color: #fff;
  font-size: 0.32rem;
  border-radius: 0.51rem;
  margin-right: 0.44rem;
}
.bc-2 {
  background-color: #c21959;
}
.bc-3 {
  background-color: #0098a7;
}
.comment-title-center {
  font-size: 0.28rem;
  color: #444548;
}
.comment-title img {
  width: 0.07rem;
  height: 0.27rem;
  position: absolute;
  right: 0;
  top: calc(50% - 0.135rem);
}
.comment-time {
  margin-bottom: 0.3rem;
}
.comment-time-left {
  margin-right: 0.12rem;
}
.comment-time-left img {
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.03rem;
}
.comment-time-right {
  font-size: 0.26rem;
  color: #878787;
}
.comment-text {
  font-size: 0.28rem;
  color: #72757a;
  margin-bottom: 0.2rem;
}
.comment-text p:nth-child(2n) {
  margin-top: 0.2rem;
}
.comment-reply-box {
  background-color: rgb(248, 249, 250);
  border-radius: 2px;
  width: 90%;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0.24rem 0.32rem;
}
.comment-reply-title {
  justify-content: space-between;
  margin-bottom: 0.2rem;
}
.comment-reply-title-left {
  font-size: 0.32rem;
  color: rgb(32, 33, 36);
}
.comment-reply-title-right {
  font-size: 0.28rem;
  color: rgb(95, 99, 104);
}
.comment-reply-text {
  font-size: 0.3rem;
  color: rgb(95, 99, 104);
}
.help-msg-box{
  margin-bottom: 0.5rem;
}
.help-text{
  font-size: 0.3rem;
  color: rgb(95,99,104);
  margin-right: 0.3rem;
}
.help-btn{
  border: 1px solid rgb(218,220,224);
  font-size: 0.34rem;
  height: 0.3rem;
  margin-left: 0.2rem;
  justify-content: center;
  border-radius: 0.3rem;
  color: rgb(95,99,104);;
  padding: 0.1rem 0.24rem;
  font-weight: bold;
}
.app-support-box{
  margin-bottom: 0.4rem;
  justify-content: space-between;
}
.app-support-text{
  font-size: 0.4rem;
  color: #37383A;
  font-weight: bold;
}
.app-support-box img{
  width: 0.4rem;
  height: 0.4rem;
}
.flag-box{
  margin-bottom: 0.5rem;
}
.flag-box img{
  margin-right: 0.2rem;
}
.flag-text {
  font-size: 0.36rem;
  font-weight: bold;
  color: #242528;
}
.bb{
  border-bottom: 1px solid #E8EAED;
  margin-bottom: 36px;
  margin-bottom: 0.6rem;
}
.game-msg-text{
  font-size: 0.3rem;
  margin-bottom: 0.4rem;
}
.game-msg-box{
  margin-bottom: 0.5rem;
}
.game-msg-img1{
  width: 1.72rem;
  height: 0.56rem;
}
.game-msg-img2{
  width: 1.72rem;
  height: 1.22rem;
}
.game-msg-img3{
  width: 1.72rem;
  height: 0.86rem;
}
.game-msg-img4{
  width: 0.56rem;
  height: 0.56rem;
}
.privacy{
  font-size: 0.3rem;
  justify-content: center;
  margin-bottom: 0.4rem;
}
.privacy a{
  text-decoration: none; /* 去除默认的下划线 */
  color: #000;    /* 去除默认的颜色和点击后变化的颜色 */ 
}
.region-box{
  margin-bottom: 0.6rem;
}
.region-box img{
  width: 0.48rem;
  height: 0.36rem;
  margin-right: 0.2rem;
}
.region-text{
  font-size: 0.3rem;
  color: rgb(95,99,104);
}