h1, h2, h3, h4, h5, h6, ul, li, dl, dt, dd, form, img, body, p {
  border-style: none;
  border-color: inherit;
  border-width: medium;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

body {
  font-size: 12px;
}

* {
  outline: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*浮动*/
.fl {
  float: left
}

.fr {
  float: right;
}

.cf {
  clear: both;
  height: 0;
  width: 0;
  overflow: hidden;
  display: block;
}

.hide {
  display: none;
}

.kill_display {
  display: none !important;
}

.hidden {
  visibility: hidden;
}

a {
  text-decoration: none;
  color: #626262;
  outline: none;
}

.show {
  display: block;
}

.oneline {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
;{}.page_foot {
	text-align: center;
	line-height: 3.8em;
    color: #666666;
    font-family: "微软雅黑";
}

.page_foot span, .page_foot a {
	color: #666666;
	padding: 0 8px;
};{}.nav_wrap {
    width: 100%;
    font-family: "microsoft yahei";
    min-height: 60px;
    background-color: #fff;
    transition-duration: 1s;
}

.nav_wrap .nav_bg {
    background: url("/images/nav/icon.png?v=2") no-repeat;
}

.nav_wrap .sub_wrap {
    width: 1200px;
}

.nav_wrap .nav_scroll {
    /*position: fixed;*/
    width: 100%;
    z-index: 999;
    background-color: #fff;
    top: 0;
    left: 0;
    min-height: 59px;
    /* border-bottom: 1px solid #eaeaea; */
}

.nav_wrap .nav_scroll .nav_listen {
    width: 100%;
    margin: 0 auto;
}

.nav_wrap .nav_scroll .nav_listen .poster_bg {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("/images/nav/poster_hover.png") no-repeat;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init {
    width: 100%;
    height: 0;
    line-height: 40px;
    text-align: center;
    background: url("/images/nav/listen_bg.png") repeat-x;
    transition-timing-function: ease;
    overflow: hidden;
    transition-duration: 1s;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init.show {
    height: 40px;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init .listen_actor {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
    position: relative;
    cursor: pointer;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init .listen_actor .listen_num {
    color: #ff6428;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init .listen_actor .listen_arrow {
    margin-left: 8px;
    display: inline-block;
    width: 14px;
    height: 9px;
    background-position: 0 -2px;
    cursor: pointer;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init .nav_close {
    position: absolute;
    right: -320px;
    top: 13px;
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url("/images/nav/del.png") no-repeat;
    background-position: 0 0;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_init .nav_close:hover {
    background-position: -24px 0;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list {
    width: 100%;
    margin: 0 auto;
    height: 243px;
    background: url("/images/nav/listen_list_bg.png") repeat-x;
    transition-duration: 1s;
    transition-timing-function: ease;
    overflow: hidden;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list.closed {
    height: 0;
    transition-duration: 1s;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding-top: 30px;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item {
    display: inline-block;
    margin-right: 20px;
    width: 150px;
    position: relative;
    overflow: hidden;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .poster_part {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: relative;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.listen_go {
    vertical-align: top;
    height: 150px;
    margin-right: 0;
    background: url("/images/nav/listen_go.jpg") no-repeat;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.listen_go:hover {
    background: url("/images/nav/listen_go_hover.jpg") no-repeat;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.listen_go:hover .listen_txt {
    opacity: 1;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.listen_go .listen_txt {
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 42px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 16px;
    z-index: 6;
    opacity: 0.6;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .poster {
    width: 100%;
    height: 100%;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .poster_cover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(/images/nav/poster_cover.png) no-repeat;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .online_count {
    background-position: 9px -337px;
    position: absolute;
    left: 0;
    padding-left: 28px;
    bottom: 5px;
    font-size: 12px;
    color: #fff;
    z-index: 10;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .nick_name {
    width: 100px;
    font-size: 14px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    z-index: 10;
    margin: 8px 0 0 10px;
    text-align: left;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item .video-play {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    margin-left: -22px;
    margin-top: -22px;
    width: 44px;
    height: 44px;
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    filter: alpha(opacity=0);
    background-image: url("/images/play_new.png");
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.actor:hover .poster_cover {
    display: none;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.actor:hover .poster_bg {
    display: inline-block;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.actor:hover .video-play {
    opacity: 1;
    -ms-filter: "alpha(opacity=100)";
    filter: alpha(opacity=100);
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_container .listen_item.actor:hover .poster {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    transition-duration: 0.5s;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_up {
    margin-top: 8px;
    display: inline-block;
    width: 26px;
    height: 15px;
    background-position: 0 -177px;
}

.nav_wrap .nav_scroll .nav_listen .nav_listen_list .nav_listen_list_main .listen_up:hover {
    background-position: -36px -177px;
}

.nav_wrap .nav_scroll .sub_wrap {
    margin: 0 auto;
    height: 65px;
    line-height: 65px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .logo {
    float: left;
    margin-right: 15px;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .logo img {
    height: 34px;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel {
    display: none;
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 15;
    background-color: #ffffff;
    /* -moz-box-shadow: 0 3px 9px #999999;
    -webkit-box-shadow: 0 3px 9px #999999;
    box-shadow: 0 3px 9px #999999; */
    border-top: 2px solid #FFD630;
    border-radius: 10px;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .nav_live_category {
    width: 270px;
    position: relative;
    border-top: 0;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .nav_live_category:after,
.nav_wrap .nav_scroll .sub_wrap .sild_panel .nav_live_category:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .nav_live_category:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 5px;
    margin-left: -5px;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .nav_live_category:before {
    border-color: rgba(255, 100, 40, 0);
    border-bottom-color: #FFD630;
    border-width: 8px;
    margin-left: -8px;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container {
    /* overflow: hidden; */
    line-height: 1em;
    padding: 5px 20px 20px 20px;
    /* border-radius: 10px; */
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1.5px solid #F1F2F4;
    box-sizing: border-box;
    border-top: 0;
    border-radius: 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container a {
    display: inline-block;
    margin-right: 10px;
    height: 30px;
    width: 70px;
    text-align: center;
    line-height: 30px;
    border-radius: 100px;
    font-size: 13px;
    color: #666666;
    font-weight: 400;
    margin-top: 10px;
    background-color: #F1F2F4;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container a.last {
    margin-right: 0;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container a.all {
    width: 100%;
    margin-top: 10px;
    color: #666666;
    background: #f1f2f4;
    border-radius: 100px;
}

.nav_wrap .nav_scroll .sub_wrap .sild_panel .container a:hover {
    background: #ffd630;
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .arrow {
    position: absolute;
    top: -7px;
    left: 47%;
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #eaeaea;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu {
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li {
    float: left;
    padding: 0 15px;
    position: relative;
    height: 65px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li.nav_square {
    margin-right: 11px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item {
    font-size: 16px;
    color: #333333;
    vertical-align: middle;
    transition: all .15s;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item::before {
    display: none;
    content: "";
    width: 16px;
    height: 3px;
    background: #ffd630;
    border-radius: 85px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -7px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.selected,
.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item:hover {
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.selected::before,
.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item:hover::before {
    display: block;
    background: #ffd630;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square {
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square:hover::before {
    background: #ffd630;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square i {
    position: absolute;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: -2px;
    display: inline-block;
    width: 9px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square i:after,
.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square i:before {
    position: absolute;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    pointer-events: none;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square i:after {
    border-color: rgba(255, 255, 255, 0);
    border-width: 3px;
    margin-left: -7px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square i:before {
    border-color: rgba(153, 153, 153, 0);
    border-width: 5px;
    margin-left: -9px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_down:after,
.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_down:before {
    top: 100%;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_down:after {
    border-top-color: #ffffff;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_down:before {
    border-top-color: #666666;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_up {
    display: none;
    top: 14px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_up:after,
.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_up:before {
    bottom: 100%;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_up:after {
    border-bottom-color: #ffffff;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li a.nav_item.square .arrow_up:before {
    border-bottom-color: #333333;
}

/* .nav_wrap .nav_scroll .sub_wrap .nav_menu li.nav_square:hover a.square {
    color: #ff6428;
    padding-bottom: 5px;
    border-bottom: 2px solid #ff6428;
} */

.nav_wrap .nav_scroll .sub_wrap .nav_menu li.nav_square:hover a.square .arrow_down {
    display: none;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li.nav_square:hover a.square .arrow_up {
    display: inline-block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_menu li.nav_square:hover .sild_panel {
    display: block;
}

.nav_wrap .nav_scroll .sub_wrap .search-input {
    position: relative;
    float: left;
    color: #fff;
    margin-left: 15px;
}

.nav_wrap .nav_scroll .sub_wrap .search-input input.search::-webkit-input-placeholder {
    color: #999999;
}

.nav_wrap .nav_scroll .sub_wrap .search-input input.search:-moz-placeholder {
    color: #999999;
}

.nav_wrap .nav_scroll .sub_wrap .search-input input.search::-moz-placeholder {
    color: #999999;
}

.nav_wrap .nav_scroll .sub_wrap .search-input input.search:-ms-placeholder {
    color: #999999;
}

.nav_wrap .nav_scroll .sub_wrap .search-input .search {
    margin: 0 0;
    padding: 0 15px 0 15px;
    width: 158px;
    height: 32px;
    border: none;
    border-radius: 30px;
    line-height: 32px;
    font-size: 13px;
    font-weight: 400;
    color: #333333;
    transition: all .3s;
    box-sizing: border-box;
    background-color: #F1F2F4;
}

.nav_wrap .nav_scroll .sub_wrap .search-input .search:focus {
    color: #333333;
    width: 180px;
}

.nav_wrap .nav_scroll .sub_wrap .search-input .search-icon {
    border: 0;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('/images/nav/newui/search_default.png');
    background-size: 100%;
    cursor: pointer;
}

.nav_wrap .nav_scroll .sub_wrap .search-input .search-icon:hover {
    background: url('/images/nav/newui/search_hover.png');
    background-size: 100%;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right {
    position: absolute;
    right: 0;
    top: 0;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item {
    float: left;
    padding: 0 10px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item a {
    font-size: 15px;
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item a:hover {
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item a.message {
    padding-left: 1px;
    padding-right: 1px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item a.message .num {
    color: #D38F21;
    font-size: 13px;
    font-weight: bold;
    margin-left: 3px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_item_last {
    padding-right: 0;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_line {
    color: #dedede;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel {
    display: none;
    position: absolute;
    right: 0;
    top: 60px;
    z-index: 15;
    width: 286px;
    border-top: 2px solid #FFD630;
    border-radius: 10px;
    background: #ffffff;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel:after,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel:before {
    bottom: 100%;
    left: 94%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel:after {
    border-color: rgba(255, 241, 233, 0);
    border-bottom-color: #ffffff;
    border-width: 5px;
    margin-left: -5px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel:before {
    border-color: rgba(255, 100, 40, 0);
    border-bottom-color: #FFD630;
    border-width: 8px;
    margin-left: -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container {
    font-size: 14px;
    /* overflow: hidden;  */
    /* border-radius: 10px; */
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1.5px solid #F1F2F4;
    box-sizing: border-box;
    border-top: 0;
    border-radius: 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .nick_name {
    position: relative;
    width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .nick_name .nickname {
    color: #333333;
    font-size: 15px;
    font-weight: 500;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name {
    height: 50px;
    line-height: 23px;
    position: relative;
    padding: 15px 20px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .charge {
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 100;
    text-align: center;
    color: #fff;
    width: 56px;
    height: 28px;
    line-height: 28px;
    background: #ffd630;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 500;
    color: #666666;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .charge:hover {
    background: #ffc738;
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 175px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name input.nickname {
    border: medium none;
    color: #666666;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    padding: 3px 8px;
    vertical-align: middle;
    width: 143px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .photo_img .avatar {
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .photo_img .avatar img {
    width: 50px;
    height: 50px;
    border: 0;
    display: block;
    border-radius: 50%
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .photo_img .avatar .stealth {
    position: absolute;
    left: 0;
    bottom: -10px;
    line-height: 19px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    width: 50px;
    height: 19px;
    background: linear-gradient(180deg, #e2e2e2, #9d9d9d 100%);
    border-radius: 5px;
    font-weight: 400;
    color: #333333;
    box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.25) inset;
    cursor: pointer;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .name .photo_img .avatar .stealth.set {
    background: linear-gradient(180deg, #ffe997, #f9d655 100%);
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_info_base {
    position: absolute;
    left: 80px;
    top: 20px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .treasure {
    position: relative;
    color: #666666;
    font-size: 13px;
    font-weight: 400;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .treasure .my_money {
    width: 150px;
    display: inline-block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .treasure .my_money .asset_value {
    color: #D38F21;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .treasure .pay {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list {
    position: relative;
    padding: 0 20px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list .user_bg {
    display: inline-block;
    width: 50px;
    height: 32px;
    background: url("/images/nav/newui/user_center_icon.png") no-repeat;
    background-size: 230px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li {
    display: inline-block;
    float: left;
    line-height: normal;
    width: 25%;
    height: 64px;
    text-align: center;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a {
    color: #333333;
    font-weight: 400;
    font-size: 12px;
    padding-top: 32px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a:hover {
    color: #D38F21;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a.nav_profile {
    background-position: 0 -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a.nav_prop {
    background-position: -60px -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a.nav_anchor {
    background-position: -120px -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li a.nav_setting {
    background-position: -180px -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list ul li.last {
    margin-right: 0;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container .user_panel_list:after {
    content: "";
    display: block;
    height: 0;
    clear: both;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container_bg.user_main {
    width: 100%;
    height: 82px;
    /* background: url("/images/nav/user_bg.png") no-repeat; */
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container_bg.user_mys {
    width: 100%;
    height: 82px;
    /* background: url("/images/nav/ismys_bg.png") no-repeat; */
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .container.have_stealth {
    /* background: url("/images/container_bg.png") no-repeat;
    background-size: 100% 100%; */
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .exit {
    display: block;
    /* width: 100%; */
    text-align: center;
    height: 55px;
    line-height: 55px;
    color: #666666;
    font-size: 14px;
    border-top: 1px solid #F1F2F4;
    font-weight: 400;
    margin: 0 20px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .user_info_panel .exit:hover {
    color: #D38F21;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down {
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 60px;
    z-index: 15;
    width: 180px;
    border-top: 2px solid #FFD630;
    background-color: #ffffff;
    text-align: center;
    line-height: normal;
    border-radius: 10px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down:after,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 5px;
    margin-left: -5px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down:before {
    border-color: rgba(255, 100, 40, 0);
    border-bottom-color: #FFD630;
    border-width: 8px;
    margin-left: -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .container {
    position: relative;
    width: 100%;
    padding-bottom: 10px;
    padding-top: 15px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .container::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1.5px solid #F1F2F4;
    box-sizing: border-box;
    border-top: 0;
    border-radius: 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .down_text {
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    color: #333333;
    line-height: 13px;
    margin: 0 auto 5px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_down {
    display: inline-block;
    width: 116px;
    margin: 0 auto;
    border-bottom: 1px solid #f1f2f4;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_down .poster {
    width: 115px;
    height: 115px;
    margin-bottom: 10px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_down img {
    width: 115px;
    height: 115px;
}

/* .nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_down .nav_txt {
    margin: 20px 0 16px;
    font-size: 12px;
    color: #292929;
} */

/* .nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_down:hover .nav_txt {
    color: #ff6428;
} */

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_daobo {
    width: 152px;
    margin: 0 auto;
    text-align: center;
    height: 33px;
    line-height: 33px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_daobo a {
    font-size: 13px;
    color: #666666;
    font-weight: 400;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item .nav_dialog_down .nav_daobo a:hover {
    color: #D38F21;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item:hover .user_info_panel {
    display: block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item:hover .nav_dialog_down {
    display: block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite {
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow {
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 60px;
    z-index: 15;
    width: 230px;
    background-color: #ffffff;
    border-top: 2px solid #FFD630;
    box-sizing: border-box;
    border-radius: 10px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history:after,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history:before,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow:after,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history:after,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 5px;
    margin-left: -5px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history:before,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow:before {
    border-color: rgba(255, 100, 40, 0);
    border-bottom-color: #FFD630;
    border-width: 8px;
    margin-left: -8px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul {
    padding: 14px 1.5px;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul::before,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1.5px solid #F1F2F4;
    box-sizing: border-box;
    border-top: 0;
    border-radius: 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li {
    width: 100%;
    position: relative;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.item,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.item {
    height: 40px;
    line-height: 40px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.item:hover,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.item:hover {
    background-color: #F1F2F4;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.more,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.more {
    text-align: center;
    line-height: normal;
    margin-top: 10px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.more a,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.more a {
    display: inline-block;
    text-align: center;
    font-size: 13px;
    color: #666666;
    background: #ffffff;
    font-weight: 400;
    width: 190px;
    height: 30px;
    line-height: 30px;
    border: 1.2px solid #ffd630;
    border-radius: 100px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.more a:hover,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.more a:hover {
    color: #333333;
    background: #FFD630;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li a.container,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li a.container {
    display: inline-block;
    padding: 0 20px;
    height: 40px;
    line-height: 40px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li a.container .h_poster,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li a.container .h_poster {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li a.container .nick_name,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li a.container .nick_name {
    position: absolute;
    left: 60px;
    top: 0;
    width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #666666;
    font-size: 13px;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li a.container .nick_name:hover,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li a.container .nick_name:hover {
    color: #666666;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li a.container .live_icon,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li a.container .live_icon {
    position: absolute;
    right: 20px;
    top: 12px;
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(/images/nav/newui/live_icon.png);
    background-size: 100%;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view .nav_history ul li.no_data,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite .nav_follow ul li.no_data {
    width: 100%;
    height: 60px;
    line-height: 60px;
    color: #999999;
    text-align: center;
    font-size: 13px;
    margin: 0;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_view:hover .nav_history,
.nav_wrap .nav_scroll .sub_wrap .nav_right ul li.nav_item.nav_favourite:hover .nav_follow {
    display: inline-block;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user {
    float: left;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .photo {
    width: 36px;
    border: 0;
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .nav_item_register {
    padding-right: 0;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .nav_item_register a {
    width: 68px;
    height: 32px;
    border: 1.5px solid #D9D9D9;
    border-radius: 20px;
    box-sizing: border-box;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    line-height: 32px;
    display: inline-block;
    vertical-align: middle;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .nav_item_register a:hover {
    border-color: #FFD630;
    background-color: #FFD630;
    color: #333333;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .nav_item_login a {
    width: 68px;
    height: 32px;
    background: #ffd630;
    border-radius: 20px;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    color: #333333;
    line-height: 32px;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.nav_wrap .nav_scroll .sub_wrap .nav_right ul .nav_user .nav_item_login a:hover {
    background: #FFC738;
    color: #333333;
}

@media (max-width: 1680px) {
    .nav_wrap .nav_scroll .sub_wrap {
        width: 1023px;
    }

    .nav_wrap .nav_scroll .sub_wrap .search-input .search-icon {
        right: 20px;
    }
}

@media (min-width: 1681px) {
    .nav_scroll .sub_wrap {
        width: 1221px;
    }
}

/* @media (max-width: 1440px) {
    .nav_scroll .sub_wrap {
        width: 1205px !important;

        .search-input {
            .search {
                width: 180px;
            }

            .search-icon {
                right: 20px;
            }
        }

        .nav_right ul li.nav_item {
            padding: 0 15px;
        }
    }
}

@media (min-width: 1440px) {
    .nav_scroll .sub_wrap {
        width: 1614px !important;
    }
} */;{}.play_card{
    padding-bottom: 1.4rem;
}
.type_nav{
    width: 4.8rem;
    height: 0.66rem;
    clear: both;
    overflow: hidden;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    margin: 0.2rem auto;
}
.play_card .type_nav li {
    float: left;
    width: 1.6rem;
    height: 0.66rem;
    text-align: center;
    line-height: 0.66rem;
    font-size: 0.26rem;
    font-weight: bold;
    color: #708dbe;
    background-size: 11rem;
    background-position: -2.8rem -0.26rem;
}
.type_nav li.active {
    color: #2e1706;
    background-position: -2.8rem -0.97rem;
}
.card_show {
    position: relative;
    width: 6.69rem;
    padding-bottom: 0.2rem;
    margin: 0.04rem auto 0;
    background-image: url(/activity/images/activity/ceremony_2018_s3/card_bg_m.png);
    background-size: 100% 100%;
}
.card_area {
    overflow: hidden;
    width: 6.4rem;
    margin: auto;
    text-align: center;
    padding-top: 0.22rem;
}
.chip_btn_item{
    display: block;
    /* float: left; */
    width: 1.48rem;
    height: 0.37rem;
    text-align: center;
    line-height: 0.37rem;
    color: #ffffff;
    font-size: 0.2rem;
    cursor: auto;
}
.card_detail{
    width: 1000rem;
}
.card_detail li{
    width: 1.44rem;
    float: left;
    margin: 0 0.08rem;
    position: relative;
}
.chip_btn_check{
    background-position: 0 -2.13rem;
    margin: 0.1rem auto;
}
.chip_btn_send{
    background-position: -3.06rem -2.13rem;
}
.active .chip_btn_send {
    background-position: -1.52rem -2.13rem;
}
.piece_chip {
    width: 1.44rem;
    height: 2.08rem;
    margin-bottom: 0.14rem;
}
.piece_chip .card_list_img{
    width:100%;
}
.piece_chip_num{
    position: absolute;
    top: -0.08rem;
    right: -0.08rem;
    width: 0.32rem;
    height: 0.32rem;
    line-height: 0.32rem;
    border-radius: 50%;
    font-size: 0.18rem;
    text-align: center;
    background: #e71700;
    display: none;
    color: #fff;
}
.active .piece_chip_num{
    display:block;
}
.honer_tab .tab_btn {
    position: absolute;
    display: block;
    width: 0.29rem;
    height: 0.48rem;
    bottom: 0.1rem;
}
.tab_prev {
    left: 1rem;
    background-position: -11.7rem -3.95rem;
}
.tab_next {
    right: 1rem;
    background-position: -12.24rem -3.96rem;
}
.circle_list {
    overflow: hidden;
    display: inline-block;
    margin-top: 20px;
}
.circle_list li {
    width: 0.4rem;
    height: 0.04rem;
    border-radius: 20px;
    background-color: #2d3e78;
    float: left;
    margin-left: 0.05rem;
}
.circle_list .active {
    background-color: #cfb16d;
}
.item_box .text_icon6 {
    width: 0.94rem;
    height: 0.25rem;
    margin: 0.23rem 0 0.12rem 0.4rem;
    background-position: -2.17rem -5.42rem;
}
.card_powerful_show {
    width: 6.7rem;
    height: 2.6rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/card_bg2_m.png);
    background-size: 100% 100%;
    margin: auto;
    text-align: center;
    padding: 1px;
    box-sizing: border-box;
}
.card_powerful_show .piece_chip {
    margin: 0.2rem 0.8rem 0 0 ;
    /* padding-top: 26px; */
    position: relative;
    display: inline-block;
    /* margin-right: 0.8rem; */
}
.card_powerful_show  .chip_btn {
    display: inline-block;
    position: relative;
    top: -0.6rem;
}
.card_powerful_show .chip_btn_item {
    width: 1.5rem;
    height: 0.55rem;
    line-height: 0.55rem;
    margin-bottom: 0.3rem;   
    background-position: -6.17rem -1.6rem;
}
.card_powerful_show.active .chip_btn_use {
    background-position: -6.16rem -1.02rem;
}
.card_powerful_show.active .chip_btn_send {
    background-position: -4.58rem -2.06rem;
}
.play_card .btn{
    width: 6.8rem;
    margin: 0.2rem auto 0.2rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #122539;
    text-align: center;
}
.play_card .picnic_gain {
    width: 2.3rem;
    background-position: -4.06rem -2.66rem;
}
.item_box .text_icon3 {
    width: 1.1rem;
    height: 0.3rem;
    margin: 0.2rem 0 0.14rem 0.4rem;
    background-position: -3.25rem -5.41rem;
}
.exchange_show {
    background-color: #112132;
    width: 6.8rem;
    margin: 0 auto 0.1rem;
    text-align: center;
}
.exchange_type {
    position:relative;
    display: inline-block;
    margin-bottom: 0.1rem;
    width: 90%;
    text-align: center;
    font-size: 0.28rem;
    font-weight: bold;
    color: #e8c27f;
    height: 0.7rem;
    vertical-align: middle;
    line-height: 0.75rem;
    border-bottom: 1px solid #28374e;
    /*background: radial-gradient(circle at 50% -86%,#1d3652 0.1rem, transparent 2rem);
    background: -webkit-radial-gradient(circle at 50% -86%,#1d3652 0.1rem, transparent 1rem);*/
}

.exchange_type::before{
    content: "";
    position: absolute;
    display: block;
    left: 50%;
    margin-left: -0.13rem;
    bottom: -0.15rem;
    width: 0.25rem;
    height: 0.25rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/title_icon.png?v=3);
    background-size: 17.79rem;
    background-position: -16.82rem -16.52rem;
    z-index: 2;
}
.exchange_card_list li {
    position: relative;
    display: inline-block;
    height: 0.3rem;
    line-height: 0.3rem;
    background-color: #0f161e;
    border-radius: 18px;
    margin: 0.04rem 0.02rem;
    font-size: 0.2rem;
    border: 0.02rem solid transparent;
    color: #7f8e9f;
}
.card_text {
    padding: 0 0.18rem;
    background-color: #0f161e;
    position: relative;
    border-radius: 18px;
    /* border: 2px solid transparent; */
}
.exchange_card_list .sr.active::before, .exchange_card_list .r.active::before, .exchange_card_list .ssr.active::before {
    content: "";
    display: block;
    z-index: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 0.02rem;
    top: -0.02rem;
    left: -0.02rem;
    background: #e8ca81;
    background: -webkit-linear-gradient(#a26b2f,#eee,#a26b2f 0.33rem);
    background: -o-linear-gradient(#a26b2f,#eee,#a26b2f 0.33rem);
    background: -moz-linear-gradient(#a26b2f,#eee,#a26b2f 0.33rem);
    background: linear-gradient(#a26b2f,#eee,#a26b2f 0.33rem);
    border-radius: 18px;
}
.ssr.active .card_text {
    color: #e8c27f;
}
.sr.active .card_text {
    color: #e7e7e7;
}
.exchange_card_list .sr.active::before {
    background-color: #5a5b5b;
    background: -webkit-linear-gradient( #5a5b5b,#eee, #5a5b5b 0.33rem);
    background: -o-linear-gradient( #5a5b5b,#eee, #5a5b5b 0.33rem);
    background: -moz-linear-gradient( #5a5b5b,#eee, #5a5b5b 0.33rem);
    background: linear-gradient( #5a5b5b,#eee, #5a5b5b 0.33rem);
}
.r.active .card_text {
    color: #b7d3ff;
}
.exchange_card_list .r.active::before {
    background-color: #5679b1;
    background: -webkit-linear-gradient(#5679b1,#eee,#1b345c 0.33rem);
    background: -o-linear-gradient(#5679b1,#eee,#1b345c 0.33rem);
    background: -moz-linear-gradient(#5679b1,#eee,#1b345c 0.33rem);
    background: linear-gradient(#5679b1,#eee,#1b345c 0.33rem);
}
.treasure_wrap {
    width: 90%;
    margin: 0.2rem auto;
    padding-top: 0.2rem;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    border-top: 1px solid #28374e;
}   
.play_card .item_box  .treasure_price {
    display:block;
}
.treasure_price {
    position: relative;
    width: 3.86rem;
    border: 1px solid #2e3f5f;
    background-color: #192b41;
    border-radius: 6px;
    margin-left: 0.4rem;
}
.treasure_price::before {
    content: "";
    display: block;
    z-index: 0;
    position: absolute;
    width: 0.12rem;
    height: 0.12rem;
    top: 49%;
    right: -0.08rem;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    border: 1px solid #2e3f5f;
    border-top: transparent;
    border-right: transparent;
    background-color: #192b41;
}
.treasure_title {
    text-align: center;
    color: #7f8e9f;
    font-size: 0.24rem;
    line-height: 0.45rem;
}
.exchange_list {
    width: 90%;
    margin: auto;
    text-align: center;
    line-height: 0.3rem;
    border-top: 1px solid #1f3752;
    padding: 0.2rem 0 0.1rem;
}
.exchange_list li {
    text-align: left;
    display: inline-block;
    line-height: 0.22rem;
    font-size: 0.2rem;
    margin-right: 0.1rem;
}
.draw_img {
    position: relative;
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    background: #062146;
    background: -webkit-linear-gradient(145deg, #062146, #052966);
    background: -o-linear-gradient(145deg, #062146, #052966);
    background: -moz-linear-gradient(145deg, #062146, #052966);
    background: linear-gradient(145deg, #062146, #052966);
    line-height: 0.6rem;
    border: 1px solid #e7c17f;
    margin-bottom: 0.05rem;
    border-radius: 8px;
    float: left;
    text-align: center;
}
.draw_img .draw_icon {
    vertical-align: middle;
    height: 80%;
}
.draw_img .draw_icon1 {
    width: 108%;
    height: auto;
}
.draw_img .draw_icon2 {
    width: 130%;
    height: auto;
    margin-left: -0.06rem;
}
.draw_name {
    float: left;
    margin-left: 0.08rem;
}
.exchange_list .probability {
    font-size: 0.14rem
}
.exchange_list .num_wrap {
    clear: left;
    width: 0.46rem;
    height: 0.2rem;
    border-radius: 20px;
    line-height: 0.2rem;
    text-align: center;
    background: -webkit-linear-gradient(145deg, #c1903d, #ffe9c3);
    background: -o-linear-gradient(145deg, #c1903d, #ffe9c3);
    background: -moz-linear-gradient(145deg, #c1903d, #ffe9c3);
    background: linear-gradient(145deg, #c1903d, #ffe9c3);
    float: left;
    color: #4f2c0a;
    margin-left: 0.7rem;
    margin-top: -0.24rem;
    font-size:0.16rem;
}
.treasure_box {
    width: 1.1rem;
    height: 0.8rem;
    background-position: -5.1rem -0.3rem;
    float: right;
    margin-right: 0.3rem;
    margin-top: 0.15rem;
}
.active .treasure_box{
    background-position: -6.25rem -0.32rem;
    -webkit-animation: shake-shake 0.6s infinite;
    -moz-animation: shake-shake 0.6s infinite;
    animation: shake-shake 0.6s infinite;
}
.exchange_btn {
    position: absolute;
    right: -1.8rem;
    top: 0.9rem;
    width: 1.6rem;
    height: 0.5rem;
    text-align: center;
    margin: 0.08rem auto 0;
    background-position: -0.1rem -2.1rem;
}
.active .exchange_btn{
    background-position: -1.96rem -2.1rem;
}
.item_box .text_icon5 {
    width: 0.94rem;
    height: 0.25rem;
    margin: 0.23rem 0 0.12rem 0.4rem;
    background-position: -4.55rem -5.41rem;
}
.card_honor_wrap .honer_tab {
    position: relative;
    width: 6.8rem;
    height: 2.14rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/box_bg2.png);
    background-size: 100% 100%;
    margin: auto;
}
.honer_box .actor_head {
    height: 0.54rem;
    width: 0.54rem;
    display: inline-block;
    border-radius: 50%;
    border: 0.02rem solid #e5dc89;
}
.honer_box li {
    position: relative;
    text-align: center;
    float: left;
    width: 1.3rem;
}
.card_honor_wrap .honer_tab .tab_btn {
    top: 0.8rem;
}
.card_honor_wrap .tab_prev{
    left:0.2rem;
}
.card_honor_wrap .tab_next{
    right:0.2rem;
}
.honer_tab .honer_area {
    position: relative;
    margin: 0.3rem auto 0;
    width: 5.3rem;
    overflow: hidden;
    text-align: center;
}
.honer_text {
    color: #ffe08b;
    text-align: center;
    padding-top: 0.16rem;
}
.honer_box .list_name {
    width: 100%;
    color: #ffe598;
    /* font-size: 12px; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    color: #ffe598;
}
.honer_box li:nth-child(2n-1)::before, .honer_box li:nth-child(2n-1)::after,.honer_box li:last-child::after {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 0.24rem;
    background-color: #9f9270;
    top: 0.18rem;
    left: 0;
}
.honer_box li:nth-child(2n-1)::after ,.honer_box li:last-child::after{
    right: 0;
    left:auto;
}
.rare_obtain .title4 {
    position: relative;
    width: 2.28rem;
    height: 0.37rem;
    top: 0.15rem;
    margin: 0.2rem 0 0.24rem 0.4rem;
    background-position: -3.28rem -5.78rem;
}
.obtain_rule {
    overflow: hidden;
    padding-right: 0;
    background-color: #0d1721;
    border: 1px solid #22324b;
    width: 6.8rem;
    margin: auto;
    padding: 0.2rem 0.4rem;
    box-sizing: border-box;
}
.obtain_rule .rule_wrap p {
    margin-bottom: 0.2rem;
    font-size: 0.2rem;
    color: #e5c081;
    clear: both;
    overflow: hidden;
}
.rare_obtain .rule_right {
    width: 5rem;
    display: block;
    float: left;
}
.list_float {
    float: left;
    color: #edc98a;
}
.obtain_rule .show_box {
    width: auto;
    display: inline-block;
    overflow: hidden;
    padding: 0 0.05rem 0.05rem;
    background-color: #16273a;
    border-radius: 5px;
    margin: 0 auto 0.1rem;
}
.show_box .head_info {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #22324b;
    line-height: 0.6rem;
    padding-bottom: 0.1rem;

}
.obtain_rule .head_info .actor_head {
    display: inline-block;
    width: 0.46rem;
    height: 0.46rem;
    border: 0.02rem solid #fbe8cd;
    border-radius: 50%;
    float: none;
    vertical-align: middle;
}
.obtain_rule .list_name {
    max-width: 2rem;
    width: auto;
    margin: 0;
    color: #afa28d;
    font-size: 0.2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    vertical-align: top;
    display: inline-block;
}
.show_box .value_desc {
    display: inline-block;
    text-align: center;
    line-height: 0.24rem;
    font-weight: bold;
    color: #fff;
}
.show_box .value_num {
    position: relative;
    display: inline-block;
    width: 2.96rem;
    height: 0.42rem;
    line-height: 0.42rem;;
    color: #ffffff;
    background-color: #081524;
    text-align: center;
    border-radius: 6px;
    margin-left: 0.1rem;
    overflow: hidden;
    vertical-align: top;
}
.show_box .font_size2 {
    font-size: 0.18rem;
    font-weight: normal;
    color: #637285;
}
.value_wrap .value_list {
    clear: both;
    padding-top: 0.1rem;
    text-align: center;
    line-height: 0.42rem;
}
.show_box .value_num1, .show_box .value_num2 {
    position: absolute;
    height: 100%;
    width: 0;
    background-color: #355477;
}
.num_wrap{
    position: relative;
}
.value_list .countdown_show {
    width: 100%;
    height: 0.3rem;
    text-align: center;
    color: #fff;
    font-weight: bold;
}
.countdown_show .countdown_num {
    width: 2.2rem;
    height: 0.25rem;
    text-align: center;
    line-height: 0.25rem;
    color: #ff4647;
    display: inline-block;
    background-color: #081524;
    font-weight: normal;
    border-radius: 20px;
    margin: 0.05rem auto;
}
.value_list .jump_btn {
    display: block;
    width: 1.8rem;
    height: 0.4rem;
    background-position: -0.23rem -1.53rem;
    margin: 0.15rem auto 0.05rem;
}
.rule_wrap{
    position:relative;
}
.rule_wrap p:last-child{
    position: absolute;
    bottom: -4.4rem;
}
.info_wrap .prize_room_info{
    margin-top: 2.1rem;
}
.rank_list .rank_box {
    position: relative;
    width: 100%;
    padding: 0.2rem 0;
    margin-top: 0.15rem;
    background-color: #112031;
}
.rank_box .actor_head {
    display: block;
    width: 0.83rem;
    height: 0.83rem;
    border-radius: 50%;
    margin: 0 auto 0.2rem;
}
.rank_list .rank_box li {
    width: 1.7rem;
    text-align: center;
}
.rank_second, .rank_third {
    position: absolute;
    top: 0.2rem;
}
.rank_second {
    left: 0.6rem;
}
.rank_first {
    margin: auto;
}
.rank_third {
    right: 0.6rem;
}
.rank_list .rank_box::before {
    content: "";
    position: absolute;
    display: block;
    left: 50%;
    margin-left: -2.25rem;
    top: 0.16rem;
    width: 4.5rem;
    height: 1rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/icon3.png);
    background-size: 7.53rem;
    background-position: -0.16rem -0.18rem;
    z-index: 2;
}
.rank_box .list_name {
    font-size: 0.18rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    color: #ffe598;
    line-height: 0.28rem;
    color:#fff;
    max-width: 1.1rem;
}
.rank_box .actor_live {
    height: 0.14rem;
    display: inline-block;
    line-height: 0.14rem;
    padding: 0 0.02rem;
    background-color: #ff4c4c;
    border-radius: 20px;
    color: #fff;
    font-size: 0.12rem;
    position: relative;
    top: -0.06rem;
}
.ticket_wrap {
    clear: both;
    color: #debe73;
    text-align: center;
    margin-top: 0.02rem;
    font-size: 0.18rem;
}
.rare_obtain .info_wrap{
    text-align: center;
}

.date_switch {
    display: inline-block;
    position: relative;
    width: auto;
    margin: 0.28rem auto 0.1rem;
    text-align: center;
}
.rank_list .date_switch .btn {
    position: absolute;
    display: inline-block;
    width: 0.2rem; 
    height: 0.33rem;
    background-size: 9.21rem;
    top: 0.03rem;
    margin: 0;
    padding:0;
}
.date_switch .prev_btn {
    background-position: -7.9rem -2.64rem;
    left: -0.3rem;
} 
.date_switch .next_btn {
    background-position: -8.2rem -2.64rem;
    right: -0.3rem;
}
.date_switch .date_show {
    height: 0.33rem;
    background-color: #0e1823;
    text-align: center;
    line-height: 0.33rem;
    border-radius: 4px;
    color: #e5c081;
    border: 1px solid #d7b06d;
    padding: 0 0.1rem;
}
.obtain_rule .rank_list{
    text-align: center;
    margin:0.2rem 0 0.1rem;
}
.item_box .exchange_wrap .sure_btn{
    position: absolute;
    right: -1.8rem;
    top: 0.9rem;
    width: 1.6rem;
    height: 0.5rem;
    text-align: center;
    margin: 0.08rem auto 0;
    background-size: 13.8rem;
    background-position: -9.06rem -1.86rem;
}
.treasure_title.active {
    color: #f42e51;
}          
.play_card .broadcast_wrap{
    margin:10px auto;
}

.show_wrap .play_card .broadcast_wrap{
    margin: 0.4rem auto;
}
.show_wrap .play_card .attent_wrap2{
    position: absolute;
    top: auto;
    width: 6.8rem;
    background-color: #0d1721;
    border: 1px solid #122539;
    color: #87a8ce;
    margin: auto;
    left: 50%;
    margin-left: -3.4rem;
    padding-bottom: 0.1rem;
}

@-webkit-keyframes shake-shake {
    0% {
        -webkit-transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(-10deg);
    }
    50% {
        -webkit-transform: rotate(0deg);
    }
    75% {
        -webkit-transform: rotate(10deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
    }
}
@-moz-keyframes shake-shake {
    0% {
        -moz-transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(-10deg);
    }
    50% {
        -webkit-transform: rotate(0deg);
    }
    75% {
        -webkit-transform: rotate(10deg);
    }
    100% {
        -moz-transform: rotate(0deg);
    }
}
@keyframes shake-shake {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(-10deg);
        -moz-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
        -o-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    75% {
        -webkit-transform: rotate(10deg);
        -moz-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        -o-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}
;{}.bounced {
    position: absolute;
    top: 0.1rem;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.bounced_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.6);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000);
    z-index: 2;
}
.dialog_wrap {
    position: relative;
    width: 6.2rem;
    padding: 0.2rem 0.16rem;
    background-color: #16273a;
    z-index: 2;
    margin: 0.2rem auto 0;
    box-sizing: border-box;
    border: 1px solid #22324b;
}
.show_wrap .bounced .title {
    margin: auto;
    height: 0.36rem;
    background-size: 15.79rem;
}
.bounced .close {
    position: absolute;
    width: 0.38rem;
    height: 0.38rem;
    cursor: pointer;
    top: 0.14rem;
    right: 0.14rem;
    background-position: -11.1rem -4.01rem;
}
.bounced .dialog_wrap .title2 {
    background-position: -1.56rem -6.64rem;
    width: 1.96rem;
}
.bounced .dialog_wrap .title9 {
    background-position: -10.76rem -6.15rem;
    width: 1.2rem;
}
.bounced .dialog_wrap .title10 {
    background-position: -0.16rem -6.64rem;
    width: 1.2rem;
}
.bounced .dialog_wrap .title11 {
    background-position: -9.4rem -6.18rem;
    width: 1.14rem;
}
.bounced .dialog_wrap .title12 {
    background-position: -0.1rem -7.18rem;
    width: 1.2rem;
}
.bounced .dialog_wrap .title13 {
    background-position: -6.6rem -6.18rem;
    width: 2.6rem;
}
.bounced .dialog_wrap .title14 {
    background-position: -12.3rem -6.18rem;
    width: 2.34rem;
}
.bounced .draw_history .title15 {
    height: 0.6rem;
    width: 2.5rem;
    background-position: -12.2rem -6.56rem;
    margin: 0.5rem auto 0;
}
.bounced .dialog_wrap .title16 {
    background-position: -9.4rem -6.68rem;
    width: 2.4rem;
}
.bounced .dialog_wrap .title17 {
    background-position: -12.34rem -5.28rem;
    width: 1.2rem;
}
.bounced .dialog_wrap .title18 {
    background-position: 0 -7.78rem;
    width: 4.5rem;
}
.bounced .dialog_wrap .title19 {
    background-position: -14rem -5.3rem;
    width: 1.3rem;
}
.bounced .dialog_wrap .title20 {
    background-position: -6.6rem -6.68rem;  
    width: 2.7rem;
}
.bounced .dialog_wrap .title21 {
    background-position: -9.7rem -7.2rem;
    width: 5.2rem;
}
.bounced .dialog_wrap .title22 {
    background-position: -2.5rem -7.2rem;
    width: 5.2rem;
}
.bounced .dialog_wrap .title23 {
    background-position: -4.7rem -7.88rem;
    width: 2.4rem;
}
.task_list li {
    overflow: hidden;
    width: 5.2rem;
    background-color: #112031;
    border: 1px solid #22324b;
    margin: 0.06rem auto;
    padding: 0.1rem;
    font-size: 0.2rem;
}
.task_list .task_state {
    display: inline-block;
    padding: 0 0.2rem;
    height: 0.4rem;
    text-align: center;
    line-height: 0.4rem;
    color: #331304;
    cursor: pointer;
    border-radius: 20px;
    background-color: #febe5a;
    background: -webkit-linear-gradient(40deg, #febe5a 12px, #edd087 40px);
    background: -o-linear-gradient(40deg, #febe5a 12px, #edd087 40px);
    background: -moz-linear-gradient(40deg, #febe5a 12px, #edd087 40px);
    background: linear-gradient(40deg, #febe5a 12px, #edd087 40px);
}
.task_list .task_finished {
    background: #969696;
    color: #21201f;
}
.task_list .link_box {
    float: right;
    width: 1.4rem;
    text-align: center;
    margin-top: 0.12rem;
}
.task_list .task_desc {
    float: left;
}
/*.dialog_step_wrap {
    background-color: #112031;
    margin: 0.16rem auto 0;
    line-height: 0.2rem;
    border: 1px solid #22324b;
    padding-right: 0.05rem;
    font-size: 0.18rem;
    padding-bottom: 0.1rem;
}*/
.draw_price_wrap {
    overflow: hidden;
    text-align: center;
}
.draw_price_wrap li {
    display: inline-block;
    width: 1.07rem;
    overflow: hidden;
    text-align: center;
    margin-top: 0.1rem;
    vertical-align: top;
}
.step_price .img_wrap, .draw_price_wrap .img_wrap {
    position: relative;
    float: left;
    width: 0.52rem;
    height: 0.52rem;
    background-color: #fff;
    text-align: center;
    line-height: 0.5rem;
    background: #17293e;
    background: -webkit-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: -o-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: -moz-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: linear-gradient( #17293e 30px, #1f3c5d 58px);
    border: 1px solid #ffe387;
    border-radius: 4px;
    margin-top: 0.04rem;
}
/* .step_price .img_wrap::before, .draw_price_wrap .img_wrap::before {
    content: "";
    display: block;
    position: absolute;
    top: 0.02rem;
    left: 0.02rem;
    width: 0.48rem;
    height: 0.48rem;
    background: #17293e;
    background: -webkit-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: -o-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: -moz-linear-gradient( #17293e 30px, #1f3c5d 58px);
    background: linear-gradient( #17293e 30px, #1f3c5d 58px);
    border-radius: 4px;
} */
/* .step_price .img_wrap::before{
    top: 0.01rem;
    left: 0.01rem;
    width: 0.5rem;
    height: 0.5rem;
} */
.draw_price_wrap .img_wrap::before {
    width: 0.76rem;
    height: 0.76rem;
    border-radius: 0;
}
.draw_price_wrap .img_wrap {
    width: 0.8rem;
    height: 0.8rem;
    line-height: 0.76rem;
    border-radius: 0;
    display: inline-block;
    float: none;
}
.step_price .draw_icon, .draw_price_wrap .draw_icon {
    position: relative;
    height: 70%;
    display: inline-block;
    vertical-align: middle;
}
.gift_name {
    color: #fff;
    margin-top: 0.1rem;
}
.step_rule .rule_right {
    width: 4.4rem;
}
.rule_right {
    display: block;
    float: left;
}
.obtain_rule p, .step_rule li {
    color: #e5c081;
    clear: both;
    margin-bottom: 0.15rem;
    overflow: hidden;
}
.dialog_step_wrap {
    padding: 0.16rem 0 0 0.2rem;
    font-size: 0.2rem;
}
.dialog_step_wrap .list_float{
    color:#fff;
}
.step_price li {
    line-height: 0.7rem;
    height: 0.7rem;
    margin: 0.2rem 0;
    display: inline-block;
    font-size: 0.18rem;
    /* margin-right: 0.1rem; */
    min-width: 1.65rem;
}
.step_price li:last-child{
    margin-right:0;
}
.step_price .price_desc {
    display: inline-block;
    line-height: 0.22rem;
    vertical-align: middle;
    margin-left: 0.1rem;
}
.history_wrap, .friend_wrap, .recharge_wrap {
    width: 5.2rem;
    height: 4rem; 
    background-color: #121e30;
    margin: 0.22rem auto 0;
    line-height: 0.36rem;
    text-align: center;
    padding: 0.1rem 0;
    border: 1px solid #22324b;
    overflow-y: auto;
}
.friend_wrap{
    height: 4.8rem;
}
.piece_send_arrow {
    text-align: center;
}
.piece_send_arrow li {
    text-align: center;
    display: inline-block;
    /* float: left; */
    margin: 0.2rem;
    cursor: pointer;
    color: #ddb36c;
    font-size: 0.26rem;
}
.draw_history {
    position: relative;
    width: 6.2rem;
    min-height: 4rem;
    margin: auto;
    background: url(/activity/images/activity/ceremony_2018_s3/draw_bounced_bg.png) no-repeat center;
    background-size: 9rem;
    padding: 0.7rem 0.2rem;
    text-align: center;
    z-index: 2;
}
.draw_success_bg {
    position: absolute;
    width: 5.54rem;
    top: 0.8rem;
    left: 50%;
    margin-left: -2.72rem;
}
.draw_history .sure_btn {
    width: 3.1rem;
    height: 0.7rem;
    margin: 0.2rem auto 0;
    background-position: -4.06rem -2.6rem;
}
.draw_list {
    display: inline-block;
    overflow: hidden;
    margin-top: 0.4rem;
    min-height: 1rem;
}
.draw_list li {
    display: inline-block;
    width: 0.82rem;
    height: 1.6rem;
    text-align: center;
    margin-left: 10px;
    overflow: hidden;
    margin-bottom: 0.1rem;
    vertical-align: top;
    margin-top: 16px;
}
.price_gift {
    display: inline-block;
    width: 0.77rem;
    height: 0.77rem;
    line-height: 0.77rem;
    border: 1px solid #e7c17f;
    float: left;
    text-align: center;
    overflow: hidden;
    background: #062146;
    background: -webkit-linear-gradient(145deg, #062146, #052966);
    background: -o-linear-gradient(145deg, #062146, #052966);
    background: -moz-linear-gradient(145deg, #062146, #052966);
    background: linear-gradient(145deg, #062146, #052966);
}
.price_gift img{
    height:70%;
    vertical-align: middle;
}
.send_history_btn {
    text-align: center;
    width: 3.74rem;
    margin: 0.14rem auto 0;
    border-bottom: 1px solid #22324b;
}
.send_history_btn li {
    display: inline-block;
    position: relative;
    bottom: -1px;
    padding-bottom: 0.04rem;
    margin: 0 0.1rem;
}
.send_history_btn li.active {
    position: relative;
    color: #ffd997;
    border-bottom: 0.02rem solid #ffd997;
}
.send_history_btn li.active::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -0.14rem;
    left: 50%;
    margin-left: -0.05rem;
    width: 0.1rem;
    height: 0.1rem;
    border-left: 1px solid #444540;
    border-bottom: 1px solid #444540;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
}
.length_limit {
    display: inline-block;
    max-width: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: top;
}
.history_wrap{
   width:5.4rem; 
}
.title_text {
    font-size: 0.2rem;
    color: #fff;
    text-align: center;
}
.dialog_friend .piece_send_list li {
    position: relative;
    height: 0.8rem;
    width: 80%;
    padding: 0 5%;
    line-height: 0.8rem;
    text-align: left;
    margin: 0 auto;
    border-bottom: 1px solid #16273a;
}
.piece_send_list .list_img {
    display: inline-block;
    float: left;
    margin: 0.1rem 0.18rem 0 0;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background: #ffffff;
}
.piece_send_list .list_name {
    font-size: 0.2rem;
    width: 2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.piece_send_list .list_send {
    position: absolute;
    margin-top: -0.12rem;
    top: 50%;
    right: 0.02rem;
    width: 0.65rem;
    height: 0.34rem;
    line-height: 0.34rem;
    text-align: center;
    color: #331304;
    background: #edcf84;
    background: -webkit-linear-gradient(#edcf84,#fdbf5c);
    background: -o-linear-gradient(#edcf84,#fdbf5c);
    background: -moz-linear-gradient(#edcf84,#fdbf5c);
    background: linear-gradient(#edcf84,#fdbf5c);
    border-radius: 22px;
    font-size:0.2rem;
}
.recharge_wrap {
    width: 6.7rem;
    height: auto;
}

.dialog_powerful{
    width: 7rem;
    padding: 0.2rem 0;
}
.dialog_card_detail{
    width: 6.2rem;
}
.recharge_wrap .desc_text {
    font-size:0.22rem;
    color: #e5c081;
}
.powerful_card_wrap {
    overflow: hidden;
    width: 80%;
    border-bottom: 1px solid #22324b;
    margin: 0.1rem auto 0.2rem;
    padding-bottom: 0.2rem;
    text-align: center;
}
.powerful_card_wrap .card_img {
    float: left;
    width: 1.44rem;
    height: 2.1rem;
}
.powerful_card_wrap .icon_img {
    width: 1.25rem;
    display: inline-block;
    height: 0.55rem;
    background-position: -2.04rem -1.74rem;
    margin: 0.75rem 0.1rem 0;
    vertical-align: top;
}
.rechange_card{
    display: inline-block;
    vertical-align: top;
}
.card_unchoose {
    width: 1.44rem;
    height: 2.1rem;
    background-color: #050d16;
    border: 0.02rem dotted #2f476d;
    border-radius: 6px;
    line-height: 2.1rem;
    text-align: center;
    box-sizing: border-box;
}
.card_choose {
    width: 1.44rem;
    height: 2.1rem;
}
.card_unchoose .icon_img2 {
    display: inline-block;
    vertical-align: middle;
    width: 0.35rem;
    height: 0.85rem;
    background-position: -1.46rem -1.74rem;
}
.dialog_powerful .recharge_wrap {
    background-image: url(/activity/images/activity/ceremony_2018_s3/box_bg1.png);
    background-size: 100%;
    background-repeat: no-repeat;
}
.dialog_card_detail .card_img {
    width: 5.82rem;
    display: block;
    height: 8.39rem;
    margin-left: 0.34rem;
    margin: 0.4rem auto 0.8rem;
    position: relative;
}
/* .info_wrap {
    height: 2rem;
    padding-left: 0.18rem;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
} */
.dialog_card_detail .dialog_card_wrap {
    margin-bottom: 0.2rem;
    position: relative;
}
.info_wrap .card_desc {
    height: 1.3rem;
    width: 98%;
    margin: auto;
}
.info_wrap .actor_wrap {
    position: relative;
    width: 5.2rem;
    height: 0.83rem;
    background-position: -3.88rem -4.82rem;
    box-sizing: border-box;
    padding: 0.12rem 0.14rem;
    background: url(/activity/images/activity/ceremony_2018_s3/room_bg_m.png) no-repeat;
    background-size: 100%;
    margin: auto;
}
.info_wrap .actor_head {
    float: left;
    width: 0.56rem;
    height: 0.56rem;
    border-radius: 50%;
}
.info_wrap .actor_live {
    line-height: 0.16rem;
    position: absolute;
    text-align: center;
    color: #fff;
    width: 0.4rem;
    height: 0.16rem;
    background-color: #ff4c4c;
    border-radius: 26px;
    font-size: 0.12rem;
    bottom: 0.12rem;
    left: 0.22rem;
}
.info_wrap .actor_info {
    float: left;
    line-height: 0.22rem;
    margin: 0.1rem 0 0 0.12rem;
}
.actor_wrap .room_link {
    display: block;
    float: right;
    width: 1.5rem;
    height: 0.35rem;
    background-position: -2.43rem -1.59rem;
    margin-top: 0.14rem;
    margin-right: 0.2rem;
}
.info_wrap .card_name {
    color: #e8c27f;
    font-size: 0.28rem;
    text-align:center;
}
.chip_btn_charge{
    width: 1.6rem;
    height: 0.5rem;
    margin: 0.2rem auto 0;
    background-position: -0.1rem -2.08rem;
}
.chip_btn_charge.active{
    background-position: -1.97rem -2.08rem;
}
.confirm_second{
    position: absolute;
    width: 5.4rem;
    padding-bottom: 0.2rem;
    left: 50%;
    margin-left: -2.7rem;
    top: 50%;
    margin-top: -1rem;
    background-color: #16273a;
    z-index: 3;
    text-align: center;
}
.confirm_text{
    font-size: 0.2rem;
    color: #e8c27f;
    line-height: 0.7rem;
}
.confirm_icon_play_wrap{
    width: 5rem;
    margin: auto;
    border: 1px solid #22324b;
    padding: 0.2rem;
    box-sizing: border-box;
    color: #fff;
}
.attent_icon{
    position: relative;
    width: 1.05rem;
    height: 1.05rem;
    background-position: -0.2rem -1.5rem;
    margin: 0 auto 0.1rem;
    z-index: 12;
}
.confirm .btn_sure{
    width: 1.59rem;
    height: 0.43rem;
    cursor: pointer;
    background-position: -7.51rem -2.25rem;
    margin: 0.2rem auto 0;
}
.dialog_card_detail .card_name {
    position: absolute;
    color: #e8c27f;
    text-align: center;
    width: 100%;
    bottom: 1.2rem;
    font-size: 0.28rem;
}
.card_img .card_list_img{
    width:100%;
}
;{}.play_draw{
    padding-bottom: 0.6rem;
}
.title_desc {
    text-align: center;
    color: #87a8ce;
    margin-top: 0.4rem;
}
.draw_broadcast, .road_broadcast,.card_broadcast{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.draw_broadcast::after,.road_broadcast::after,.card_broadcast::after{
    content: "";
    position: absolute;
    top: 0.47rem;
    left: 0;
    width: 100%;
    height: 0.47rem;
    background-color: #112132;
}
.draw_broadcast li, .road_broadcast li, .card_broadcast li {
    position: relative;
    padding-left: 0.1rem;
    line-height: 0.48rem;
    z-index: 1;
}
.draw_broadcast li::before, .road_broadcast li::before, .card_broadcast li::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 0.02rem;
    width: 0.28rem;
    height: 0.25rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/title_icon.png?v=3);
    background-size: 13.69rem;
    background-position: -13.21rem -3.88rem;
}
.play_item .slides_name, .play_item .slides_price {
    display: inline-block;
    max-width: 1.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    white-space: nowrap;
}
.play_item .slides_price {
    color: #ff3054;
}
.play_draw  .draw_left {
    position: relative;
    width: 6.8rem;
    margin:auto;
    text-align: center;
    padding-top: 0.7rem;
    padding-bottom: 1.2rem;
}
.play_draw .draw_sweet_img {
    position: relative;
    left: -0.12rem;
    width: 100%;
    height: 2.38rem;
    margin-left: 0.1rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/sweet_img.png);
    background-position: -0.5rem -0.56rem;
    background-size: 7.74rem;
    background-repeat: no-repeat;
}
.play_draw .btn1 {
    overflow: hidden;
    border-bottom: 1px solid #16253a;
    padding-left: 0.2rem;
    padding-bottom: 0.2rem;
}
.play_draw  .btn_item {
    width: 2rem;
    height: 0.45rem;
    line-height: 0.45rem;
    text-align: center;
    float: left;
    font-weight: bold;
    font-size: 0.28rem;
    background-position: -0.04rem -0.74rem;
    color: #292929;
    background-size: 8.56rem;
}
.btn_item.active {
    background-position: -0.06rem -0.24rem;
    color: #3e1f10;
}
.btn_item_ten{
    margin: 0 0.2rem;
}
.chance_wrap {
    font-size: 0.2rem;
    font-weight: bold;
    line-height: 0.34rem;
    position: relative;
    top: -3.6rem;
    display: inline-block;
    color:#d4bc81;
}
.chance_wrap::before,.chance_wrap::after{
    content: "";
    display: block;
    position: absolute;
    left: -0.6rem;
    top: 0.17rem;
    width: 0.5rem;
    height: 0.02rem;
    background-color: #d4bc81;
}
.chance_wrap::after{
    right: -0.6rem;
    left: auto;
}
.draw_chance {
    color: #ff3054;
}
.btn_normal {
    display: inline-block;
    width: 1.92rem;
    height: 0.62rem;
    text-align: center;
    line-height: 0.6rem;
    cursor: pointer;
    padding-right: 0.24rem;
    box-sizing: border-box;
    font-size: 0.21rem;
}
.play_draw .btn2 {
    margin-top: -0.2rem;
    border-bottom: 1px solid #16253a;
    padding-bottom: 0.2rem;
}
.draw_right .text_icon2, .card_attent_wrap .text_icon2 {
    width: 0.77rem;
    height: 0.32rem;
    margin: 0.2rem 0 0.05rem 0.5rem;
    background-position: -1.22rem -5.4rem;
}
.draw_right .attent_wrap{
    position: absolute;
    top: 7.6rem;
    width: 80%;
    width: 6.8rem;
    background-color: #0d1721;
    border: 1px solid #122539;
    color: #87a8ce;
    margin: auto;
    left: 50%;
    margin-left: -3.4rem;
    padding-bottom: 0.1rem;
}
.attent_wrap li {
    position: relative;
    width: 88%;
    padding-left: 0.42rem;
    margin-top: 0.1rem;
    line-height:0.28rem;
}
.attent_wrap li::before {
    content: "";
    display: block;
    position: absolute;
    left: 0.2rem;
    top: 0.03rem;
    width: 0.2rem;
    height: 0.2rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/title_icon.png?v=3);
    background-size: 13.79rem;
    background-position: -12.74rem -3.93rem;
}
.draw_right .text_icon2{
    position: absolute;
    top: 7rem;
}
.draw_bottom{
    text-align: center;
};{}body{
    background-color: #121b25;
}
.show_wrap {
    max-width: 750px;
    margin: 0 auto;
    position: relative;
    font-family: "微软雅黑","Microsoft YaHei","宋体","SimSun",sans-serif;
    /* overflow: hidden; */
    padding-bottom: 1.5rem;
    padding-top: 1px;
    color: #87a8ce;
    background-color: #121b25;
    font-size: 0.22rem;
}
.treasure_box, .powerful_card_wrap .icon_img, .card_unchoose .icon_img2, .attent_icon {
    background-image: url(/activity/images/activity/ceremony_2018_s3/icon3.png);
    background-repeat: no-repeat;
    background-size: 7.53rem;
}
.btn_item ,.type_nav li, .play_item .list_user, .exchange_btn,.treasure_price  .sure_btn, .value_list .jump_btn, .confirm .btn_sure ,.chip_btn_charge{
    background-image: url(/activity/images/activity/ceremony_2018_s3/btn_icon.png?v=2);
    background-repeat: no-repeat;
    background-size:9.56rem;
}
.btn_normal, .chip_btn_item,.total_nav,.total_nav li.active, .sure_btn{
    background-image: url(/activity/images/activity/ceremony_2018_s3/m_icon_play.png?v=3);
    background-repeat: no-repeat;
    background-size:7.63rem;
}
.item_title, .text_icon, .bounced .close, .bounced .title, .honer_tab .tab_btn, .date_switch .btn, .treasure_close{
    background-image: url(/activity/images/activity/ceremony_2018_s3/title_icon.png?v=3);
    background-repeat: no-repeat;
    background-size:13.69rem;
}
.play_draw .broadcast_wrap,.play_road .broadcast_wrap,.play_card .broadcast_wrap{
    width: 5.08rem;
    height:1.5rem;
    background-color: #122539;
    border: 1px solid #30557b;
    margin:0.2rem auto;
    line-height: 0.47rem;
    text-align: center;
    color: #dfbc88;
}
.m_banner{
    width:100%;
}
.total_nav{
    position: relative;
    width: 100%;
    height: 1.02rem;
    margin-top: -0.51rem;
}
.total_nav li{
    width:2rem;
    height:100%;
    float:left;
}
.total_nav .nav_list4{
    width:1.5rem;
    height:100%;
}
.total_nav .nav_list4 a{
    display:block;
    width:100%;
    height:100%;
}
.nav_list1.active{
    background-position: 0 -1.05rem;
}
.nav_list2.active{
    background-position: -2.06rem -1.05rem;
}
.nav_list3.active{
    background-position: -4.12rem -1.05rem;
}
.item_box{
    position: relative;
}
.btn_yellow {
    color: #400e00;
    font-weight: bold;
    background-position: 0 -2.64rem;
}
.btn_grey {
    color: #bceeff;
    background-position: -2.06rem -2.64rem;
}
.footer_text {
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: 0.4rem;
}
.play_attend{
    width: 100%;
    margin: auto;
}
.play_attend .item_title{
    width: 100%;
    height: 1.2rem;
    background-size: 12.79rem;
    background-position: -2.4rem -6.8rem;
}
.play_attend ul{
    width: 90%;
    margin: 0.12rem auto 0;
    line-height: 0.3rem;
}


.show_wrap .font_color1 {
    color: #ff3054;
}
.show_wrap .font_color2 {
    color: #ffd69a;
}
.show_wrap .font_bold {
    font-weight: bold;
}
.show_wrap .font_color3 {
    color: #ff4242;
}
.rule_small {
    font-size: 0.16rem;
    color: #6c7c8f;
}
.second_line{
    display:block;
}
.title_text2 {
    color: #87a8ce;
    text-align: center;
}
.show_wrap .font_color4 {
    color: #87a8ce;
}
.show_wrap .font_color5 {
    color: #ff3154;
}
.show_wrap .hide {
    display:none;
}
;{}.play_road .draw_left {
    position: relative;
    width: 6.7rem;
    border: 1px solid #2d3d54;
    margin: 0.2rem auto 1.2rem;
    padding: 0.2rem 0 0.4rem;
}
.play_road .draw_right{
    width: 6.7rem;
    border: 1px solid #2d3d54;
    margin: 0.26rem auto 0;
    padding: 0.2rem 0.2rem 0.4rem;
    box-sizing: border-box;
}
.step_list {
    width: 5.75rem;
    height: 6.83rem;
    background-image: url(/activity/images/activity/ceremony_2018_s3/step_bg_m.png);
    background-size: 100% 100%;
    margin: auto;
}
.play_item .list_img {
    display: inline-block;
    width: o.58rem;
    height: 0.58rem;
    border-radius: 50%;
    padding: 0.02rem;
    background: #e7e590;
    background: -webkit-linear-gradient(top,#e7e590 50%, #e7e590);
    background: -o-linear-gradient(top,#e7e590 50%, #e7e590);
    background: -moz-linear-gradient(top,#e7e590 50%, #e7e590);
    background: linear-gradient(top,#e7e590 50%, #e7e590);
    box-sizing: border-box;
}
.play_road .item_box{    
    padding-top: 2.2rem;
}
.play_road .item_box_unstart{
    padding-top: 0.2rem;
}
.play_road .draw_right .broadcast_wrap{
    top: 0.4rem;
    position: absolute;
    left: 50%;
    margin-left: -2.5rem;
}
.left_title {
    color: #cfbc7d;
    text-align: center;
    font-weight: bold;
    margin-bottom: 0.14rem;
}
.step_list li {
    float: left;
    width: 2.62rem;
    height: 3.18rem;
    margin:0 0.5rem 0.5rem 0;
}
.step_list li:nth-child(2n){
    margin-right: 0;
}
.step_list .step_name {
    text-align: center;
    line-height: 0.35rem;
    letter-spacing: 0.08rem;
    color: #efbf78;
    margin-top: 1.6rem;
}
.step_list .step_desc {
    font-size: 0.18rem;
    color: #a18c6d;
    text-align: center;
    width: 76%;
    margin: 0.1rem auto 0.1rem;
    line-height: 0.22rem;
}
.step_btn {
    width: 1.2rem;
    height: 0.33rem;
    border-radius: 16px;
    background-color: #e8ca81;
    background: -webkit-linear-gradient(-45deg,  #fde699 0.3rem, #b48345 0.58rem,#fde699 0.79rem);
    background: -o-linear-gradient(-45deg,  #fde699 0.3rem, #b48345 0.58rem,#fde699 0.79rem);
    background: -moz-linear-gradient(-45deg, #fde699 0.3rem, #b48345 0.58rem,#fde699 0.79rem);
    background: linear-gradient(-45deg, #fde699 0.3rem, #b48345 0.58rem,#fde699 0.79rem);
    color: #22140a;
    text-align: center;
    line-height: 0.33rem;
    margin: auto;
}
.item_box .tip {
    font-size:0.22rem;
}
.play_item .list li {
    float: left;
    width: 1.2rem;
    text-align: center;
}
.list_content{
    overflow:hidden;
    margin-top: 0.2rem;
}
.play_item .list_user {
    display: block;
    width: 0.72rem;
    height: 0.3rem;
    margin: 0.1rem auto 0;
    background-position: -4.03rem -1.29rem;
}
.play_road .list_name {
    font-size: 0.18rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    color: #ffe598;
    line-height: 0.28rem;
}
.play_road .box_unstart{
    width: 6.27rem;
    height: 0.81rem;
    line-height:0.81rem;
    border: none;
    background: url(/activity/images/activity/ceremony_2018_s3/road_bg_m.png);
    /* background-image: url(/activity/images/activity/ceremony_2018_s3/title_icon.png); */
    /* background-position: -0.58rem -2.97rem; */
    background-size: 100%;
    background-repeat: no-repeat;
    box-sizing: border-box;
    font-size: 0.16rem;
    padding: 0 0 0.32rem 1.59rem;
    color: #f7d9a5;
    margin: 0.4rem auto 0.6rem;
}
.play_road .draw_left .history_btn{
    position: absolute;
    bottom: -1rem;
    left: 50%;
    margin-left: -0.96rem;
}