@charset "utf-8";

.widget-nav-sidebar {
  position: fixed;
  top: 73px;
  right: 50%;
  margin-right: 540px;
  z-index: 101;
}

.widget-nav-sidebar-row {
  display: none;
  -webkit-transition: all .3s;
  transition: all .3s;
  position: fixed;
  top: 73px;
  left: 0;
  z-index: 12;
  padding: 13px 10px;
  text-align: center;
  border: 1px solid #e4e4e4;
  border: 1px solid var(--color-line-1);
  border-radius: 5px;
  background-color: #fff;
  background-color: var(--color-fill-1);
  border-left: 0;
  -moz-border-radius-left: 0;
  cursor: pointer;
}

.we-icon-slidebar-row {
  display: inline-block;
  width: 8px;
  height: 14px;
  background: url(../../../theme/images/common/ico-slidebar-row.png) no-repeat center top;
  vertical-align: middle;
  background-size: 100% auto;
}

.widget-nav-sidebar .nav-sidebar-list {
  border-radius: 4px;
  background-color: #fff;
  background-color: var(--color-fill-1);
  border: 1px solid #e4e4e4;
  border: 1px solid var(--color-line-1);
  padding: 10px 0;
  margin-right: 0;
  right: 0;
  position: absolute;
  -webkit-transition-property: width, height;
  transition-property: width, height;
  -webkit-transition-duration: .3s;
          transition-duration: .3s;
}

.widget-nav-sidebar .sidebar-item-tit {
  text-align: center;
  cursor: pointer;
  padding-top: 9px;
  font-size: 0;
}

.widget-nav-sidebar .sidebar-item-tit .icon-nav {
  margin: 0 auto 2px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item {
  position: relative;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:after {
  content: "";
  width: 20px;
  height: 100%;
  display: block;
  position: absolute;
  right: -20px;
  top: 0;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .sidebar-item-tit {
  background-color: #f4f4f4;
  background-color: var(--color-fill-2);
}

.widget-nav-sidebar .nav-sidebar-item--focus .item-txt {
  color: #f69c00;
  color: var(--color-text1);
}

.widget-nav-sidebar .nav-sidebar-item--focus .icon-nav-WeChatCode {
  display: block;
  width: 16px;
  height: 16px;
  background-image: url(../../images/common/nav-app-spr.png);
  background-position: -16px -0px;
  background-size: 32px 16px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item.nav-sidebar-item--focus:hover .sidebar-item-tit,
.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item.nav-sidebar-item--focus.cur .sidebar-item-tit {
  background-color: #ff8f00;
  background-color: var(--color-fill1-3);
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item.nav-sidebar-item--focus:hover .icon-nav-WeChatCode,
.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item.nav-sidebar-item--focus.cur .icon-nav-WeChatCode {
  background-position: -0px -0px;
}

.widget-nav-sidebar .nav-sidebar-item--focus:hover .item-txt,
.widget-nav-sidebar .nav-sidebar-item--focus.cur .item-txt {
  color: #fff;
  color: var(--color-text0-1);
}

.nav-sidebar-item--focus:hover .svg-sidebar--app > path,
.nav-sidebar-item--focus.cur .svg-sidebar--app > path {
  fill: #fff;
  fill: var(--color-text0-1);
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item.cur .tui-tips {
  display: block;
}

.widget-nav-sidebar .item-txt {
  color: #333;
  color: var(--color-text-live-title);
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
  height: 16px;
  line-height: 16px;
  display: inline-block;
  text-overflow: ellipsis;
  padding: 0 3px;
}

.widget-nav-sidebar .tui-tips .sort {
  width: 290px;
  padding: 0;
  margin-top: 6px;
  margin-bottom: 20px;
}

.widget-nav-sidebar .tui-tips .sort .sort-tit {
  font-size: 16px;
  font-weight: normal;
  color: #757575;
  color: var(--color-text-2);
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item .tui-tips {
  left: 124%;
  display: none;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:hover .tui-tips {
  display: block;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(2) .tui-tips {
  top: 125%;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(2) .tui-tips:after {
  top: 35%;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(4) .tui-tips {
  top: 50%;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(4) .tui-tips:after {
  top: 50%;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(4) .tui-tips.tui-tips--WeChat {
  top: 50%;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:nth-of-type(4) .tui-tips.tui-tips--WeChat:after {
  top: 50%;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-all {
  background-position: -2px -26px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-classify {
  background-position: -2px -74px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-down {
  background-position: -2px -122px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-recomm {
  background-position: -2px -170px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-schedule {
  background-position: -2px -266px;
}

.widget-nav-sidebar .nav-sidebar-list .nav-sidebar-item:hover .icon-nav-WeChatCode {
  background-position: -2px -218px;
}

.widget-nav-sidebar .nav-sidebar-item2 .tui-tips {
  padding: 15px;
}

.widget-recomm-tag {
  padding: 10px 19px;
  width: 260px;
}

.widget-recomm-tag .tag-game {
  word-break: keep-all;
  color: #757575;
  color: var(--color-text-2);
  font-size: 12px;
  line-height: 27px;
  margin-right: 20px;
}

.widget-recomm-tag .tag-game:hover,
.widget-recomm-tag .tag-game.cur {
  color: #f69c00;
  color: var(--color-text1);
}

.bg-change-down {
  visibility: hidden;
}

/*二维码*/
.WeChat-box {
  text-align: center;
}

.WeChat-box-figure {
  display: block;
  width: 108px;
  height: 108px;
  margin-bottom: 4px;
}

.WeChat-box-tit {
  color: #3c3c3c;
  color: var(--color-text-1);
  font-size: 12px;
  text-align: center;
  line-height: 1.5;
  margin-bottom: 4px;
}

.widget-sidebar-tag .dropbox-menu {
  position: static;
  border: none;
  background-color: transparent;
  top: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.WeChat-box-close {
  color: #757575;
  color: var(--color-text-2);
  cursor: pointer;
}

.WeChat-box-close.disabled {
  color: #bfbfbf;
  color: var(--color-text-3);
  cursor: default;
}

.widget-nav-sidebar .nav-sidebar-list > .nav-sidebar-item:hover .tui-tips.widget-sidebar-tag {
  top: 0;
  -webkit-transform: none;
          transform: none;
}

.widget-sidebar-tag.tui-tips.right.center:after {
  top: 25px;
  margin-top: 0;
}

.widget-recomm-tag {
  padding: 10px 19px 10px 0;
  width: 280px;
}

@media screen and (max-width: 1150px) {
  .widget-nav-sidebar {
    opacity: 0;
    -webkit-transform: translate(-100px, 0);
            transform: translate(-100px, 0);
  }
  .widget-nav-sidebar-row {
    display: block;
  }
}

@media screen and (min-width: 1150px) and (max-width: 1279px) {
  .widget-nav-sidebar {
    margin-right: 510px;
  }
}

.widget-nav-sidebar.active {
  opacity: 1;
  position: fixed;
  top: 73px;
  left: 62px;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

/*@media screen and (max-width: 1400px) {*/
.widget-nav-sidebar .nav-sidebar-list {
  width: 62px;
  max-height: 362px;
}

.widget-nav-sidebar .sidebar-item-tit {
  height: 57px;
}

.bg-screen {
  display: none;
}

.widget-qrlink.bg-change-down {
  width: 62px;
  height: 62px;
  max-height: 0;
  -webkit-transition: all .3s;
  transition: all .3s;
  visibility: hidden;
  top: 230px;
  right: 0;
  position: absolute;
  opacity: 0;
}

.widget-qrlink.bg-change-down h3,
.widget-qrlink.bg-change-down .qr-box,
.widget-qrlink.bg-change-down img {
  width: 0;
  height: 0;
  visibility: hidden;
  -webkit-transition: all .3s;
  transition: all .3s;
  overflow: hidden;
}

.widget-qrlink.bg-change-down .qr-box {
  width: 0;
  height: 0;
  display: none;
}

/*}*/
.widget-nav-sidebar--single .nav-sidebar-list {
  padding: 0;
}

.widget-nav-sidebar--single.widget-nav-sidebar .sidebar-item-tit {
  padding-top: 12px;
}

.icon-nav-broadcast {
  background-image: url(../../images/widget/nav-broadcast-sprite.png);
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 19px;
  background-position: -1px -1px;
  margin-bottom: 4px;
}

.nav-sidebar-item:hover .icon-nav-broadcast {
  background-position: -1px -22px;
}

.nav-sidebar-item .we-tooltips--tipsselect {
  display: none;
  left: 62px;
  top: 50%;
  padding: 9px 0;
}

.nav-sidebar-item:hover .we-tooltips--tipsselect {
  display: block;
}

.widget-nav-sidebar .we-toast {
  background: #fff;
  background: var(--color-fill-1);
  border: 1px solid #bfbfbf;
  border: 1px solid var(--color-line-3);
  -webkit-box-shadow: 0 3px 7px -3px rgba(0, 0, 0, 0.2), 0 4px 8px -4px rgba(0, 0, 0, 0.2);
          box-shadow: 0 3px 7px -3px rgba(0, 0, 0, 0.2), 0 4px 8px -4px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: var(--shadow-3);
          box-shadow: var(--shadow-3);
}

.widget-nav-sidebar .we-alert h3 {
  color: #3c3c3c;
  color: var(--color-text-1);
}
