


.main .part {
  box-sizing: border-box;
  width: 1200px;
  margin: 0 auto;
  margin-bottom: 40px
}

.common_title {
  width: 100%;
  overflow: hidden;
  position: relative
}

.common_title h2 {
  float: left;
  font-size: 22px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #333333
}

.common_title a {
  display: block;
  float: right;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  margin-top: 5px;
  padding-right: 11px;
  box-sizing: border-box;
  position: relative
}

.common_title a::after {
  content: '';
  background: url(../images/look_all.png);
  width: 4px;
  height: 8px;
  position: absolute;
  right: 0;
  top: 6px
}

.hiden {
  display: none!important
}

body {
  background-color: #f6f6f6;
  overflow-x: hidden
}

.row1 {
  background-color: #fff;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 6px;
  overflow: hidden
}

.row1 .swiper_link {
  overflow: hidden
}

.row1 .swiper_box {
  width: 750px;
  height: 320px;
  border-radius: 6px;
  float: left
}

.row1 .swiper_box .box {
  width: 750px;
  height: 320px;
  border-radius: 6px;
  overflow: hidden;
  position: relative
}

.row1 .swiper_box .box img {
  width: 750px;
  height: 320px;
  border-radius: 6px;
  transition: all 0.5s
}

.row1 .swiper_box .box .bg_black {
  position: absolute;
  bottom: 0;
  width: 750px;
  height: 120px;
  background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));
  border-radius: 6px
}

.row1 .swiper_box .box p {
  width: 560px;
  font-size: 18px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  box-sizing: border-box;
  padding: 0 10px;
  position: absolute;
  bottom: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.row1 .swiper_box .swiper-pagination {
  bottom: 17px;
  text-align: right;
  padding-right: 20px;
  box-sizing: border-box
}

.row1 .swiper_box .swiper-pagination-bullet {
  width: 20px;
  height: 6px;
  background: #E1E1E1;
  opacity: 0.6;
  border-radius: 0
}

.row1 .swiper_box .swiper-pagination-bullet-active {
  background: #FFF2EB;
  opacity: 1
}

.row1 .link_box {
  width: 390px;
  float: right;
  border-radius: 6px;
  overflow: hidden
}

.row1 .link_box a {
  display: block;
  width: 194px;
  height: 62px;
  background: #F9F9F9;
  margin-bottom: 2px;
  float: left;
  line-height: 62px;
  box-sizing: border-box;
  padding-left: 70px;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #222222;
  position: relative
}

.row1 .link_box a:hover {
  background: #3d7eff;
  cursor: pointer
}

.row1 .link_box a:nth-child(2n-1) {
  margin-right: 2px
}

.row1 .link_box a:nth-last-child(1),.row1 .link_box a:nth-last-child(2) {
  margin-bottom: 0
}

.row1 .link_box a:nth-child(1)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_1.png);
  position: absolute;
  width: 16px;
  height: 18px;
  top: 22px;
  left: 40px
}

.row1 .link_box a:nth-child(2)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_2.png);
  position: absolute;
  width: 16px;
  height: 14px;
  top: 24px;
  left: 40px
}

.row1 .link_box a:nth-child(3)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_3.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .link_box a:nth-child(4)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_4.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .link_box a:nth-child(5)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_5.png);
  position: absolute;
  width: 16px;
  height: 18px;
  top: 22px;
  left: 40px
}

.row1 .link_box a:nth-child(6)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_6.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .link_box a:nth-child(7)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_7.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .link_box a:nth-child(8)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_2.png);
  position: absolute;
  width: 16px;
  height: 18px;
  top: 22px;
  left: 40px
}

.row1 .link_box a:nth-child(9)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_9.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .link_box a:nth-child(10)::before {
  content: '';
  background: url(//js1.18183.com/pc/download/download2021/pc/images/link_icon_10.png);
  position: absolute;
  width: 16px;
  height: 16px;
  top: 23px;
  left: 40px
}

.row1 .day_rec {
  margin-top: 40px
}

.common_title .tab {
  overflow: hidden;
  float: left;
  margin-left: 30px;
  padding-top: 2px
}

.common_title .tab li {
  width: 72px;
  height: 25px;
  background: #F9F9F9;
  border-radius: 2px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  text-align: center;
  line-height: 25px;
  float: left;
  cursor: pointer
}

.common_title .tab li+li {
  margin-left: 10px
}

.common_title .tab li.active {
  color: #fff;
  background: #FF5353
}

.day_rec .tab_data {
  margin-top: 20px
}

.day_rec .tab_data li {
  width: 100%;
  height: 263px
}

.day_rec .tab_data li a {
  display: block;
  width: 170px;
  background: #F9F9F9;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 30px 25px;
  float: left
}

.day_rec .tab_data li a:hover {
  background-color: #fff;
  box-shadow: 0px 0px 12px 0px #ECECEC
}

.day_rec .tab_data li a+a {
  margin-left: 28px
}

.day_rec .tab_data li a img {
  width: 120px;
  height: 120px;
  border-radius: 26px;
  position: relative;
  transition: all 0.5s
}

.day_rec .tab_data li a:hover img {
  transform: translateY(-4px)
}

.day_rec .tab_data li a .name {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  text-align: center;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 10px
}

.day_rec .tab_data li a .type {
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  text-align: center;
  margin-top: 6px
}

.day_rec .tab_data li a .score {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #3d7eff;
  text-align: center;
  margin-top: 10px
}

.new_game {
  margin-top: 40px;
  overflow: hidden
}

.new_game .left {
  width: 240px;
  float: left
}

.new_game .right {
  width: 900px;
  float: right;
  overflow: hidden
}

.new_game .left .games {
  margin-top: 20px;
  width: 100%;
  border-top: 1px dashed #EAEAEA
}

.new_game .left .games .game {
  height: 46px;
  border-bottom: 1px dashed #EAEAEA;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  display: block
}

.new_game .left .games .game i {
  display: block;
  width: 18px;
  height: 18px;
  background: #D8D8D8;
  border-radius: 2px 6px 2px 2px;
  text-align: center;
  line-height: 18px;
  float: left;
  margin-top: 14px;
  margin-right: 10px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF
}

.new_game .left .games .game:nth-child(1) i {
  background-color: #E93F43
}

.new_game .left .games .game:nth-child(2) i {
  background-color: #FF881E
}

.new_game .left .games .game:nth-child(3) i {
  background-color: #FFBE23
}

.new_game .left .games .game p {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 46px;
  width: 140px;
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.new_game .left .games .game .btn {
  width: 68px;
  height: 26px;
  background: #FFFFFF;
  border: 1px solid #FF5353;
  border-radius: 2px;
  text-align: center;
  line-height: 24px;
  box-sizing: border-box;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FF5353;
  float: right;
  margin-top: 10px
}

.new_game .left .games .game:hover .btn {
  background-color: #FF5353;
  color: #fff
}

.new_game .right .game {
  width: 210px;
  float: left
}

.new_game .right .game+.game {
  margin-left: 20px
}

.new_game .right .game img {
  width: 210px;
  height: 292px;
  border-radius: 6px
}

.new_game .right .game p {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  text-align: center;
  width: 100%;
  margin-top: 10px
}

.new_game .right .game .btn {
  width: 170px;
  height: 36px;
  background: #FF5353;
  border-radius: 2px;
  display: block;
  line-height: 36px;
  text-align: center;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  margin: 0 auto;
  margin-top: 10px
}

.new_game .right .game:hover .btn {
  background: #F13535
}

.hot_game {
  width: 100%;
  background: #fff;
  padding: 20px;
  overflow: hidden;
  box-sizing: border-box;
  margin-top: 20px
}

.hot_game .left {
  width: 240px;
  float: left
}

.hot_game .left .games {
  margin-top: 20px;
  border-top: 1px dashed #EAEAEA
}

.hot_game .left .games .game {
  padding: 20px 0;
  border-bottom: 1px dashed #EAEAEA;
  transition: all 0.5s
}

.hot_game .left .games .game .up {
  overflow: hidden
}

.hot_game .left .games .game .up .no {
  display: block;
  width: 18px;
  height: 18px;
  background: #D8D8D8;
  border-radius: 2px 6px 2px 2px;
  text-align: center;
  line-height: 18px;
  float: left;
  margin-right: 10px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF
}

.hot_game .left .games .game:nth-child(1) .up .no {
  background-color: #E93F43
}

.hot_game .left .games .game:nth-child(2) .up .no {
  background-color: #FF881E
}

.hot_game .left .games .game:nth-child(3) .up .no {
  background-color: #FFBE23
}

.hot_game .left .games .game .up p {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  float: left;
  width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.hot_game .left .games .game .up .name2 {
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  float: right;
  margin-right: 10px
}

.hot_game .left .games .game .up .to_up {
  background: url(//js1.18183.com/pc/download/download2021/pc/images/to_up.png);
  width: 8px;
  height: 10px;
  display: block;
  float: right;
  margin-top: 3px
}

.hot_game .left .games .game .down {
  overflow: hidden;
  padding-top: 0px;
  height: 0px;
  transition: all 0.5s
}

.hot_game .left .games .game .down img {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  margin-left: 26px;
  float: left
}

.hot_game .left .games .game .down p {
  line-height: 46px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  float: left;
  margin-left: 8px
}

.hot_game .left .games .game .down .btn {
  display: block;
  width: 68px;
  height: 26px;
  background: #FF5353;
  border-radius: 2px;
  line-height: 26px;
  text-align: center;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  float: right;
  margin-top: 10px
}

.hot_game .left .games .game.active {
  padding: 14px 0 10px 0
}

.hot_game .left .games .game.active .down {
  padding-top: 10px;
  height: 46px
}

.hot_game .right {
  width: 900px;
  float: right
}

.hot_game .right .tab {
  overflow: hidden
}

.hot_game .right .tab li {
  width: 80px;
  height: 30px;
  background: #F9F9F9;
  border-radius: 2px;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  text-align: center;
  line-height: 25px;
  float: left;
  cursor: pointer
}

.hot_game .right .tab li+li {
  margin-left: 10px
}

.hot_game .right .tab li.active {
  background: #FF5353;
  color: #fff
}

.hot_game .right .tab_content li .game {
  width: 210px;
  height: 160px;
  border-radius: 6px;
  float: left;
  margin-right: 20px;
  margin-top: 20px
}

.hot_game .right .tab_content li .game:nth-child(4n) {
  margin-right: 0
}

.hot_game .right .tab_content li .game .img {
  width: 210px;
  height: 120px;
  border-radius: 6px 6px 0px 0px;
  overflow: hidden
}

.hot_game .right .tab_content li .game .img img {
  width: 210px;
  height: 120px;
  border-radius: 6px 6px 0px 0px
}

.hot_game .right .tab_content li .game .name {
  width: 210px;
  height: 40px;
  background: #F9F9F9;
  border-radius: 0px 0px 6px 6px;
  box-sizing: border-box;
  padding: 8px 12px
}

.hot_game .right .tab_content li .game .name p {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  float: left;
  line-height: 24px;
  width: 110px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap
}

.hot_game .right .tab_content li .game .name .btn {
  width: 72px;
  height: 24px;
  background: #FF5353;
  border-radius: 2px;
  float: right;
  text-align: center;
  line-height: 24px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF
}

.hot_game .right .tab_content li .game:hover .name .btn {
  background: #F13535
}

.row3 {
  /* margin-top: 20px; */
  background-color: #fff;
  box-sizing: border-box;
  padding:0 20px;
  border-radius: 6px
}

.row3 .edition {
  height: 263px;
  width: 100%;
  margin-top: 20px;
  /* margin-bottom: 40px */
}

.row3 .edition a {
  display: block;
  width: 170px;
  background: #F9F9F9;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 30px 25px;
  float: left
}

.row3 .edition a:hover {
  background-color: #fff;
  box-shadow: 0px 0px 12px 0px #ECECEC
}

.row3 .edition a+a {
  margin-left: 28px
}

.row3 .edition a img {
  width: 120px;
  height: 120px;
  border-radius: 26px;
  position: relative;
  transition: all 0.5s
}

.row3 .edition a:hover img {
  transform: translateY(-4px)
}

.row3 .edition a .name {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  text-align: center;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 10px
}

.row3 .edition a .type {
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  text-align: center;
  margin-top: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.row3 .edition a .score {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #3d7eff;
  text-align: center;
  margin-top: 10px
}

.selected_topic {
  background-color: #fff;
  /* margin-top: 20px; */
  padding: 30px 20px;
  border-radius: 6px
}

.selected_topic .content {
  overflow: hidden
}

.selected_topic .content a {
  display: block;
  width: 170px;
  float: left;
  margin-right: 28px;
  margin-top: 20px
}

.selected_topic .content a:nth-child(6n) {
  margin-right: 0
}

.selected_topic .content a .img {
  width: 170px;
  height: 96px;
  border-radius: 6px;
  overflow: hidden
}

.selected_topic .content a .img img {
  width: 170px;
  height: 96px;
  border-radius: 6px;
  transition: all 0.5s
}

.selected_topic .content a:hover .img img {
  transform: scale(1.1)
}

.selected_topic .content a .name {
  width: 100%;
  box-sizing: border-box;
  padding: 0 5px;
  text-align: center;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  margin-top: 6px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}

.selected_topic .content a .dec {
  width: 100%;
  box-sizing: border-box;
  padding: 0 5px;
  text-align: center;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  margin-top: 6px
}

.sel_article {
  background-color: #fff;
  /* margin-top: 20px; */
  padding: 30px 20px;
  border-radius: 6px
}

.sel_article .content {
  margin-top: 20px;
  overflow: hidden
}

.sel_article .content .article {
  display: block;
  width: 368px;
  float: left
}

.sel_article .content .article+.article {
  margin-left: 28px
}

.sel_article .content .article .img {
  width: 368px;
  height: 206px;
  border-radius: 6px;
  overflow: hidden
}

.sel_article .content .article .img img {
  width: 368px;
  height: 206px;
  border-radius: 6px;
  transition: all 0.5s
}

.sel_article .content .article:hover .img img {
  transform: scale(1.1)
}

.sel_article .content .article h2 {
  width: 100%;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 20px;
  margin-top: 10px
}

.sel_article .content .article p {
  width: 100%;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
  margin-top: 10px
}

.row_doubleCol {
  margin-top: 20px;
  overflow: hidden
}

.row_doubleCol .rank_24h {
  background-color: #fff;
  padding: 20px;
  box-sizing: border-box;
  width: 784px;
  float: left;
  border-radius: 6px
}

.row_doubleCol .common_title h2 {
  line-height: 36px
}

.row_doubleCol .common_title a {
  margin-top: 7px
}

.common_title .selected {
  width: 200px;
  height: 36px;
  background: #F9F9F9;
  border-radius: 36px;
  float: left;
  overflow: hidden;
  position: relative;
  margin-left: 20px
}

.common_title .selected li {
  width: 100px;
  height: 36px;
  text-align: center;
  line-height: 36px;
  float: left;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #666666;
  position: relative;
  z-index: 2
}

.common_title .selected li.active {
  color: #fff
}

.common_title .selected .bg_move {
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 36px;
  background: #FF5353;
  border-radius: 18px;
  z-index: 1;
  transition: left 0.3s
}

.rank_24h .rank_swiper .swiper {
  width: 100%;
  height: 215px
}

.rank_24h .rank_swiper .swiper .box {
  width: 100%;
  overflow: hidden
}

.rank_24h .rank_swiper .swiper .box a {
  display: block;
  height: 68px;
  width: 171px;
  float: left;
  margin-right: 20px;
  margin-top: 20px;
  position: relative
}

.rank_24h .rank_swiper .swiper .box a:nth-child(4n) {
  margin-right: 0
}

.rank_24h .rank_swiper .swiper .box a img {
  width: 68px;
  height: 68px;
  border-radius: 16px;
  position: relative;
  float: left
}

.rank_24h .rank_swiper .swiper .box a:hover img {
  top: -2px
}

.rank_24h .rank_swiper .swiper .box a p {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  margin-left: 10px;
  width: 93px;
  float: left;
  line-height: 64px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.rank_24h .rank_swiper .swiper .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  background: #E5E5E5;
  opacity: 1
}

.rank_24h .rank_swiper .swiper .swiper-pagination-bullet-active {
  width: 24px;
  height: 8px;
  background: #FF5353;
  border-radius: 4px
}

.row_doubleCol .news {
  background-color: #fff;
  padding: 20px;
  box-sizing: border-box;
  width: 396px;
  float: right;
  border-radius: 6px
}

.row_doubleCol .news .list a {
  width: 100%;
  display: block;
  margin-top: 22px
}

.row_doubleCol .news .list a p {
  width: 100%;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.row_doubleCol .news .list a:hover p {
  color: #FF5353
}

.row_doubleCol .news .list a .info {
  overflow: hidden;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  margin-top: 15px
}

.row_doubleCol .news .list a .info i {
  float: left;
  padding-left: 20px;
  position: relative
}

.row_doubleCol .news .list a .info span {
  float: right
}

.row_doubleCol .news .list a .info i::before {
  content: '';
  width: 14px;
  height: 10px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/browse.png);
  position: absolute;
  top: 4px;
  left: 0
}

.comment {
  margin-top: 20px
}

.comment .title h2 {
  font-size: 32px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FF5353;
  text-align: center
}

.comment .title p {
  width: 170px;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
  margin: 0 auto;
  margin-top: 10px;
  text-align: center;
  background-color: #f6f6f6;
  position: relative;
  z-index: 10
}

.comment .title .line {
  width: 100%;
  height: 1px;
  background: #E7E7E7;
  position: relative;
  z-index: -1;
  top: -9px
}

.comment .content {
  margin-top: 20px
}

.comment .content .box-list {
  width: 384px;
  float: left;
  margin-top: 20px;
  background-color: #fff;
  box-sizing: border-box;
  padding: 30px 20px;
  border-radius: 6px
}

.comment .content .box-list .game {
  overflow: hidden
}

.comment .content .box-list .game img {
  width: 68px;
  height: 68px;
  border-radius: 14px;
  float: left
}

.comment .content .box-list .game .info {
  float: left;
  margin-left: 20px;
  padding: 8px 0
}

.comment .content .box-list .game .info h2 {
  font-size: 16px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333
}

.comment .content .box-list .game .info .star {
  position: relative;
  width: 102px;
  margin-top: 10px
}

.comment .content .box-list .game .info .star .star_get {
  display: block;
  width: 102px;
  height: 17px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/star_get.png) no-repeat;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  object-fit: cover
}

.comment .content .box-list .game .info .star .star_lose {
  width: 102px;
  height: 17px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/star_lose.png) no-repeat;
  object-fit: cover;
  display: block
}

.comment .content .box-list .game .info .star .num {
  position: absolute;
  top: 1px;
  left: 115px;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FF5353
}

.comment .content .box-list .say {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 26px;
  box-sizing: border-box;
  padding: 0 40px;
  margin: 20px 0;
  position: relative
}

.comment .content .box-list .say::before {
  content: '';
  width: 22px;
  height: 18px;
  position: absolute;
  top: 0;
  left: 0;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/say_start.png)
}

.comment .content .box-list .say::after {
  content: '';
  width: 22px;
  height: 18px;
  position: absolute;
  bottom: 0;
  right: 0;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/say_end.png)
}

.comment .content .box-list .play_down {
  overflow: hidden
}

.comment .content .box-list .play_down .player {
  float: left
}

.comment .content .box-list .play_down .player img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  float: left
}

.comment .content .box-list .play_down .player .name {
  font-size: 14px;
  font-family: PingFang SC;
  font-weight: 500;
  color: #999999;
  line-height: 28px;
  float: left;
  margin-left: 10px
}

.comment .content .box-list .play_down .btn {
  float: right;
  width: 68px;
  height: 28px;
  background: #FFFFFF;
  border: 1px solid #FF5353;
  border-radius: 4px;
  line-height: 28px;
  text-align: center;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FF5353
}

.friendly_wrap {
  height: 114px;
  margin-top: 40px;
  padding: 10px;
  overflow: hidden;
  background: #fff
}

.friendly_wrap h4 {
  float: left;
  width: 110px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  font-size: 17px;
  font-family: OPPOSans;
  font-weight: bold;
  color: #FFFFFF;
  background: linear-gradient(90deg,#FF5353,#FF6C6C)
}

.friendly_swiper {
  float: left;
  width: 1020px;
  height: 90px;
  overflow: hidden;
  position: relative;
  margin: 12px 0 12px 30px;
  border-radius: 6px
}

.friendly_swiper li {
  width: 100%;
  height: 114px;
  overflow: hidden;
  font-size: 0
}

.friendly_swiper li p {
  width: 890px;
  height: 90px;
  padding: 12px 12px 12px 28px
}

.friendly_swiper a {
  display: inline-block;
  *display: inline;
  *zoom:1;width: 175px;
  height: 31px;
  line-height: 31px;
  font-size: 12px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #707070
}

.friendly_swiper i {
  display: inline-block;
  *display: inline;
  *zoom:1;width: 5px;
  height: 5px;
  background: #939393;
  border-radius: 100%;
  vertical-align: middle;
  margin-right: 10px
}

.friendly_swiper a:hover {
  color: #FF5353
}

.friendly_swiper a:hover i {
  background: #f7a934
}

.friendly_swiper .btnWrap {
  position: absolute;
  z-index: 5;
  right: 0;
  top: 0;
  width: 30px;
  height: 80px;
  padding: 5px 24px
}

.friendly_swiper .prevBtn,.friendly_swiper .prevBtn {
  float: left;
  position: static;
  width: 30px;
  height: 30px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/prev_btn.png);
  margin: 5px 0
}

.friendly_swiper .nextBtn {
  float: left;
  position: static;
  width: 30px;
  height: 30px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/next_btn.png);
  margin: 5px 0
}

.friendly_swiper .prevBtn:hover {
  float: left;
  position: static;
  width: 30px;
  height: 30px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/prev_btn_hover.png);
  margin: 5px 0
}

.friendly_swiper .nextBtn:hover {
  float: left;
  position: static;
  width: 30px;
  height: 30px;
  background: url(//js1.18183.com/pc/download/download2021/pc/images/next_btn_hover.png);
  margin: 5px 0
}

.friendly_swiper #links_box {
  position: absolute;
  top: 0;
  left: 0
}


.rec_1 {
  background-color: #fff;
  margin-top: 20px;
  padding: 30px 20px;
  border-radius: 6px
}

.rec_1 .common_title .rec_tab {
  overflow: hidden;
  float: left
}

.rec_1 .common_title .rec_tab li {
  float: left;
  font-size: 20px;
  font-family: Microsoft YaHei;
  color: #AFAFAF;
  float: left;
  cursor: pointer
}

.rec_1 .common_title .rec_tab li+li {
  margin-left: 30px
}

.rec_1 .common_title .rec_tab li.active {
  color: #333;
  font-weight: bold
}

.rec_1 .rec_tablist {
  margin-top: 20px
}

.rec_1 .rec_tablist .swiper-slide {
  width: 170px
}

.rec_1 .rec_tablist .swiper-slide+.swiper-slide {
  margin-left: 28px
}

.rec_1 .rec_tablist .swiper-slide img {
  width: 170px;
  height: 130px;
  border-radius: 5px
}

.rec_1 .rec_tablist .swiper-slide p {
  width: 100%;
  box-sizing: border-box;
  padding: 0 5px;
  text-align: center;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  margin-top: 6px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}

.video_part {
  background-color: #fff;
  margin-top: 20px;
  padding: 30px 20px;
  border-radius: 6px
}

.video_part .video_list {
  margin-top: 20px
}

.video_part .video_list .swiper-slide {
  width: 200px;
  height: 270px;
  position: relative;
  overflow: hidden
}

.video_part .video_list .swiper-slide+.swiper-slide {
  margin-left: 40px
}

.video_part .video_list .swiper-slide img {
  width: 200px;
  height: 270px;
  transition: all 0.5s
}

.video_part .video_list .swiper-slide:hover img {
  transform: scale(1.1)
}

.video_part .video_list .swiper-slide .black_bg {
  width: 100%;
  height: 70px;
  background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.9));
  position: absolute;
  bottom: 0
}

.video_part .video_list .swiper-slide p {
  width: 100%;
  box-sizing: border-box;
  padding: 0 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 16px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #fff;
  text-align: center;
  position: absolute;
  bottom: 5px
}

@media screen and (max-width: 1600px) {
  .select_com {
      display:none
  }

  .menu {
      display: none
  }
}

@media screen and (min-width: 1600px) {
  .menu {
      width:180px;
      background: #FFFFFF;
      border-radius: 6px;
      box-sizing: border-box;
      padding: 26px 10px;
      position: fixed;
      top: 150px;
      left: 50%;
      transform: translateX(-800px)
  }

  .menu .item {
      width: 160px;
      height: 46px;
      background-color: #fff;
      border-radius: 23px;
      padding-left: 55px;
      line-height: 46px;
      box-sizing: border-box;
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      color: #666666;
      position: relative;
      margin-top: 5px
  }

  .menu .item:hover {
      background: #FFF9F9;
      color: #FF5353;
      cursor: pointer
  }

  .menu .item.active {
      background: #FFF9F9;
      color: #FF5353;
      cursor: pointer
  }

  .menu .item .home_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/home.png)
  }

  .menu .item:hover .home_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/home_hover.png)
  }

  .menu .item.active .home_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/home_hover.png)
  }

  .menu .item .day_rec_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/day_rec.png)
  }

  .menu .item:hover .day_rec_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/day_rec_hover.png)
  }

  .menu .item.active .day_rec_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/day_rec_hover.png)
  }

  .menu .item .edition_icon {
      display: block;
      position: absolute;
      width: 24px;
      height: 20px;
      left: 20px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/edition.png)
  }

  .menu .item:hover .edition_icon {
      display: block;
      position: absolute;
      width: 24px;
      height: 20px;
      left: 20px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/edition_hover.png)
  }

  .menu .item.active .edition_icon {
      display: block;
      position: absolute;
      width: 24px;
      height: 20px;
      left: 20px;
      top: 13px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/edition_hover.png)
  }

  .menu .item .selected_topic_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/topic.png)
  }

  .menu .item:hover .selected_topic_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/topic_hover.png)
  }

  .menu .item.active .selected_topic_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/topic_hover.png)
  }

  .menu .item .comment_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/comment.png)
  }

  .menu .item:hover .comment_icon {
      display: block;
      position: absolute;
      width: 22px;
      height: 20px;
      left: 21px;
      top: 14px;
      background: url(//js1.18183.com/pc/download/download2021/pc/images/comment_hover.png)
  }

  .select_com {
      position: fixed;
      left: 50%;
      transform: translateX(-800px);
      bottom: 20px
  }

  .select_com .mian_S {
      width: 180px;
      height: 64px;
      background: #FFFFFF;
      border-radius: 6px;
      line-height: 64px;
      box-sizing: border-box;
      padding-left: 30px;
      position: relative
  }

  .select_com .mian_S::after {
      content: '';
      position: absolute;
      width: 10px;
      height: 6px;
      background: url(../images/open.png);
      top: 29px;
      right: 20px;
      transition: all 0.5s
  }

  .select_com .mian_S.active::after {
      content: '';
      position: absolute;
      width: 10px;
      height: 6px;
      background: url(../images/open.png);
      top: 29px;
      right: 20px;
      transform: rotate(180deg)
  }

  .select_com .new_link {
      width: 180px;
      background: #FFFFFF;
      border-radius: 6px;
      margin-bottom: 4px;
      box-sizing: border-box;
      height: 0;
      padding: 0;
      overflow: hidden;
      transition: all 0.5s
  }

  .select_com .new_link.active {
      height: 132px;
      padding: 12px 0
  }

  .select_com .new_link a {
      display: block;
      width: 180px;
      height: 54px;
      padding-left: 30px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      color: #666666;
      line-height: 54px;
      box-sizing: border-box;
      position: relative
  }

  .select_com .new_link a:hover {
      background: #FFF9F9;
      color: #FF5353
  }

  .select_com .new_link a:hover::after {
      content: '';
      position: absolute;
      width: 14px;
      height: 10px;
      background: url(../images/this.png);
      top: 22px;
      right: 20px
  }
}
