@charset "utf-8";
/* CSS Document */
.margin0{margin: 0!important;}

.layui-form-select dl::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.layui-form-select dl::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.layui-form-select dl::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.layui_tips{position: absolute; width: 0; height: 0; border-width: 8px; border-color: transparent; border-style: dashed; top: 5px; border-bottom-style: solid; border-bottom-color: #373737; left: -8px;}
.layui_tips2{position: absolute; width: 0; height: 0; border-width: 8px; border-color: transparent; border-style: dashed; top:5px; border-bottom-style: solid; border-bottom-color: #373737; right: -8px;}
.layui_tips3{position: absolute; width: 0; height: 0; border-width: 8px; border-color: transparent; border-style: dashed; top:-15px; border-bottom-style: solid; border-bottom-color: #373737; left: 8px;}

.nobox.layui-layer {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.nobox .layui-layer-content {
  padding: 0 !important;
  background: transparent !important;
}

/*index*/
.index_header_box{width: 100%; height: 80px; background: #fff; position: sticky; top: 0; z-index: 99; border-bottom: #ededed 1px solid; box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);}
.index_header{width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 80px;}
.index_logo{}
.index_menu{display: flex; align-items: center; gap: 60px;}
.index_menu a{font-size: 17px; color: #222; }
.index_menu a:hover{color: #1673e8;}
.index_menu .hover{font-weight: bold; color: #1673e8;}
.index_header_right{display: flex; align-items: center; gap: 5px;}
.index_header_right .login_btn{font-size: 16px; color: #222; font-weight: bold; padding: 0 20px; height: 36px; display: flex; align-items: center; justify-content: center;}
.index_header_right .login_btn:hover{color: #333; border-radius: 60px; background:#efeff1; }
.index_header_right .register_btn{font-size: 16px; color: #fff; background: #222; padding: 0 20px; height: 36px; border-radius: 60px; display: flex; align-items: center;}
.index_header_right .register_btn i{margin-left: 5px;}
.index_header_right .register_btn:hover{color: #fff; background: #323948; }
.language_main{width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: #222 1px solid; box-sizing: border-box; cursor: pointer; margin-left: 10px;}
.language_main:hover{background: #efeff1;}


.index_bannerbox{width: 100%; height: 599px; position: relative; background: url(../../images/index/banner.jpg) center #ff3407;}
.index_bannerbox .main{width: 1200px; margin: 0 auto;}
.index_bannerbox .left{width: 600px; padding: 120px 0 0 0;}
.index_bannerbox .left>h1{display: block; width: 100%; font-size: 46px; color: #fff; font-weight: 500; line-height: 1.5;}
.index_bannerbox .left>h2{display: block; width: 100%; font-size: 22px; color: #fff; font-weight: 500; padding: 15px 0 50px 0;}
.index_bannerbox .left>a{display: inline-block; background: #101521; font-size:18px; color: #fff; border-radius: 60px; padding: 0 60px; line-height: 60px;}
.index_bannerbox .left>a:hover{background: #323948;}
.index_bannerbox .foot{position: absolute; bottom: -40px; width: 1000px; height: 140px; background: #fff; border-radius: 18px; box-shadow: 0 4px 16px 0 rgba(64, 72, 90, .1); padding: 0 100px; display: flex; align-items: center; justify-content: space-between;}
.index_bannerbox .foot .zi{display: flex; flex-direction: column;}
.index_bannerbox .foot .zi>span{font-size: 26px; color: #222; padding: 0 0 12px 0;}
.index_bannerbox .foot .zi>span>em{font-family: Din; font-size: 30px;}
.index_bannerbox .foot .zi>small{font-size: 16px; color: #666; }

.index_surveybox{width: 1200px; margin: 80px auto 30px auto;}
.index_surveybox .title{width: 100%; display: flex; align-items: center; justify-content: space-between;}
.index_surveybox .title>span{font-size: 20px; color: #222;}
.index_surveybox .title>a{font-size: 14px; color: #1673e8;}
.index_surveybox .main{width: 100%; box-sizing: border-box; display: grid; justify-content: space-between; flex-wrap: wrap; grid-gap: 20px 0; grid-template-columns: repeat(auto-fill, 225px); padding-top: 25px;}

.survey_notlogin_box{margin: 30px auto 30px auto;}
.survey_notlogin_box .title{flex-direction: column;}
.survey_notlogin_box .title span{width: 100%; font-size: 24px; font-weight: bold;}
.survey_notlogin_box .title small{width: 100%; font-size: 16px; color: #555; line-height: 1.5; padding: 10px 0 0 0;}
.survey_notlogin_box .survey_box{padding: 20px 0 20px 0; overflow: visible; max-height: none;}

.survey_notlogin_box .game_mainbox{padding: 20px 0 20px 0; overflow: visible; max-height: none;}

.survey_notlogin_box .home_main{padding: 20px 0 0 0;}
.survey_notlogin_box .home_main .left{background: #fff; border: 1px solid #eee; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px; padding: 0 30px;}
.survey_notlogin_box .voten_list_box{ overflow: visible; max-height: none;}
.survey_notlogin_box .home_main .vote_right{position: -webkit-sticky; position: sticky; top: 90px; z-index: 9;  align-self: flex-start;}

@media screen and (max-width: 1560px) and (min-width: 1400px) {
 .survey_notlogin_box .home_main .vote_right{width: 300px!important;} 
  }
@media screen and (max-width: 1400px) and (min-width: 520px) {
 .survey_notlogin_box .home_main .vote_right{width: 300px!important; display: block;} 
  }

.survey_notlogin_box .voteinfo_new_title{    padding: 10px 0 10px 0; height: 55px;}
.survey_notlogin_box .voteinfo_pl_nr{max-height: 400px; overflow: auto;}
.survey_notlogin_box .voteinfo_pl_nr::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.survey_notlogin_box .voteinfo_pl_nr::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.survey_notlogin_box .voteinfo_pl_nr::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.survey_notlogin_box .voteinfo_pl_pk_nr{max-height: 400px; overflow: auto;}
.survey_notlogin_box .voteinfo_pl_pk_nr::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.survey_notlogin_box .voteinfo_pl_pk_nr::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.survey_notlogin_box .voteinfo_pl_pk_nr::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}



.index_surveybox .survey_list{width: 225px;}
.index_surveybox .survey_pic{width: 100%; height: 120px; display: flex; position: relative;}
.index_surveybox .survey_pic>i{width: 100%; height: 120px;}
.index_surveybox .survey_pic>i img{display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px;}
.index_surveybox .survey_zi{width: 100%; box-sizing: border-box; padding: 10px 5px;display: flex; flex-direction: column;}
.index_surveybox .survey_zi>small{width: 100%; font-size: 13px; color: #666;}
.index_surveybox .survey_zi>span{width: 100%; font-size: 16px; color: #222; padding: 10px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.index_surveybox .survey_jf{width: 100%; display: flex; align-items: center;}
.index_surveybox .survey_jf>span{font-size:16px; color:#ff472e; margin-right:15px; display: flex; align-items: center;}
.index_surveybox .survey_jf>span>i{width: 20px; margin: 0 3px 0 0;}
.index_surveybox .survey_jf>span>i img{width: 100%;}
.index_surveybox .survey_jf>span>p{display: flex; align-items: baseline;}
.index_surveybox .survey_jf>span>p>b{font-size:22px; color:#ff472e;     font-weight: 500;  font-family: Din;}
.index_surveybox .survey_jf>span>p>em{font-size:14px; color: #FB5652; margin-left: 2px;}
.index_surveybox .survey_jf>small{font-size:14px; color:#666; display: flex; align-items: center;}
.index_surveybox .survey_jf>small>i{width: 20px; margin: 0 3px 0 0;}
.index_surveybox .survey_jf>small>i img{width: 100%;}

.index_jieshao{width: 100%; display: flex; flex-direction: row;}
.index_jieshao .left{width: 50%; background-color: #E6F8FE; display: flex; justify-content: center; align-items: end; flex-direction: column; padding: 40px 0;}
.index_jieshao .right{width: 50%; background-color: #EAFBF1; display: flex; justify-content: center; align-items: flex-start; flex-direction: column; padding: 40px 0;}
.index_jieshao .jieshao_img{width: 600px; display: flex; justify-content: center; padding: 20px 0 30px 0;}
.index_jieshao .jieshao_zi1{width: 600px; font-size: 26px; color: #222; line-height: 1.5; text-align: center; padding: 0 60px 10px 60px; box-sizing: border-box;}
.index_jieshao .jieshao_zi2{width: 600px; font-size: 16px; color: #666; line-height: 1.5; text-align: center; padding: 0 60px 0 60px; box-sizing: border-box;}
.index_jieshao .jieshao_aa{width: 600px; padding: 0 60px 0 60px; box-sizing: border-box; text-align: center;}
.index_jieshao .jieshao_aa a{display: inline-block; background: #1e1f23; font-size:16px; color: #fff; border-radius: 60px; padding: 0 40px; line-height: 48px; margin: 30px auto 0 auto;}
.index_jieshao .jieshao_aa a:hover{background: #323948;}

.index_liuchengbox{width: 1200px; margin: 0 auto; padding: 50px 0;}
.index_liuchengbox>h2{display: block; width: 100%; font-size: 36px; color: #222;     font-weight: 500; text-align: center; padding: 20px 0 30px 0;}

.index_liucheng{width: 1200px; display: flex; align-items: center; justify-content: center;}
.index_liucheng .list{display: flex; align-items: center; justify-content: center; flex-direction: column; margin-right: 190px; position: relative;}
.index_liucheng .list:last-child {margin-right: 0;}

.index_liucheng .list>i{width: 150px;}
.index_liucheng .list>span{font-size: 22px; color: #222; padding: 10px 0 15px 0;}
.index_liucheng .list>small{font-size: 14px; color: #666;}
.index_liucheng .list>em{font-size: 34px; color: #dbdbe7; font-family: Din; font-weight: 500; padding: 10px 0 0 0;}
.index_liucheng .list:not(:last-child):after {
    content: "";
    position: absolute;
    top: 80px;
    left: 100%;
    width: 190px;
    height: 4px;
    background-image: -webkit-gradient(linear,left top,right top,from(#d6d7e4),color-stop(20%,#d6d7e4),color-stop(20%,transparent));
    background-image: linear-gradient(90deg,#d6d7e4 0,#d6d7e4 20%,transparent 0);
    background-size: 15px 4px;
    background-repeat: repeat-x
}


.foot_login{width: 100%; height: 350px;  background: url(../../images/index/foot_login.png) center top;}
.foot_login .main{width: 1200px; height: 350px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.foot_login .left{width: 600px; display: flex; flex-direction: column; padding: 100px 0 0 0;}
.foot_login .left>span{font-size: 36px; color: #222;}
.foot_login .left>small{font-size: 16px; color: #222; line-height: 1.5; padding: 20px 0 0 0;}
.foot_login .main>a{padding: 18px 50px; font-size: 16px; border-radius: 60px; margin: 130px 0 0 0;}

.foot_box{width: 100%; border-top: #eee 1px solid;}
.foot_box .main{width: 1200px; margin: 0 auto; display: flex;}
.foot_box .left{width: 650px; display: flex; flex-direction: column; padding: 45px 100px 35px 0;}
.foot_box .left>i{width: auto; padding: 0 0 15px 0;}
.foot_box .left>span{font-size: 14px; color: #222; line-height: 1.5;}
.foot_box .left>span a{display: inline-block; font-size: 12px; color: #1e81cd;}
.foot_box .left>span a:hover{color: #ed4731; text-decoration: underline;}

.foot_box .ewm_box{width: 100%; display: flex; padding: 20px 0 0 0; gap: 30px;}
.foot_box .ewm{display: flex; align-items: center;}
.foot_box .ewm>i{width: 77px;}
.foot_box .ewm>p{display: flex; flex-direction: column; padding: 0 0 0 10px;}
.foot_box .ewm>p span{font-size: 14px; color: #666;}
.foot_box .ewm>p small{font-size: 12px; color: #999; line-height: 1.5; padding: 8px 0 0 0;}

.foot_box .right{flex: 1; display: flex;  justify-content: space-between; padding: 60px 0 0 0;}
.foot_box .foot_nav{}
.foot_box .foot_nav span{display: block; width: 100%; font-size: 22px; color: #222; padding: 0 0 20px 0;}
.foot_box .foot_nav a{display: block; width: 100%; font-size: 14px; color: #555; padding: 8px 0;}


/*about*/
.about_box{width: 100%; background: linear-gradient(178deg, #f3f6fb 0%, #FFFFFF 300px);}
.about_nr{width: 1200px; margin: 0 auto; display: flex; padding: 30px 0 20px 0;}
.about_left{width: 280px; display: flex; flex-direction: column; gap:10px; flex-shrink: 0; margin-right: 20px;  position: -webkit-sticky; position: sticky; top: 90px; z-index: 9;  align-self: flex-start; }
.about_left a{width: 100%; background: #fff; border-radius: 8px; border: #eee 1px solid; height: 50px; line-height: 50px; box-sizing: border-box; padding: 0 10px 0 20px; font-size: 16px; color: #333; font-weight: bold;}
.about_left .hover,.about_left a:hover{background:#ebf4fe;  border: #e0efff 1px solid; color: #222;}
.about_right{flex: 1; min-width: 0; background: #fff; border: 1px solid #eee; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px; padding: 30px 30px; box-sizing: border-box;}
.about_right .title{font-size: 24px; color: #1673e8; font-weight: bold; padding: 0 0 25px 0; }
.about_right .title span{position: relative;}
.about_right .title span:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 6px;
    background: linear-gradient( 90deg, #2090FF 0%, #F1F8FF 100%);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 3px;
    z-index: 10;
    bottom: -5px;    
    width: 50%
}

.about_right .zi1{width: 100%; display: flex; flex-direction: column; padding: 0 0 15px 0;}
.about_right .zi1 span{width: 100%; font-size: 18px; color: #333; font-weight: bold; padding: 0 0 8px 0;}
.about_right .zi1 small{width: 100%; font-size: 16px; color: #444; line-height: 1.7;}

.contact_box{display: flex;}
.contact_box .contact_leftzi{flex: 1; min-width: 0; padding: 0 60px 0 0; font-size: 16px; color: #222; line-height: 1.7;}

.contact_box .contact_right{flex-shrink: 0; width: 480px;}
.contact_box .contact_right .list{width: 100%; padding: 0 0 15px 0;}
.contact_box .contact_right .list input{width: 100%; height: 48px; line-height: 48px; padding: 0 5px 0 10px; box-sizing: border-box; background: #fff; border: #eee 1px solid; border-radius:8px; font-size: 16px; color: #222;}
.contact_box .contact_right .list input:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}

.contact_box .contact_right .list textarea{width: 100%; height: 90px; line-height: 22px; padding: 6px 5px 6px 10px; box-sizing: border-box; background: #fff; border: #eee 1px solid; border-radius:8px; font-size: 16px; color: #222;}
.contact_box .contact_right .list textarea:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}

.contact_box .contact_right .btn{width: 100%; display: flex;}
.contact_box .contact_right .btn a{width: 100%; height: 48px; line-height: 48px; font-size: 14px; border-radius: 8px; display: flex; align-items: center; justify-content: center;}
.contact_box .contact_right .btn a i{width: 16px; margin-right: 8px;}
.contact_box .contact_right .btn a i img{width: 100%;}

.contact_box .cooperation_zi{font-size: 14px;}

.countries_box{width: 100%;}
.countries_leftzi{width: 100%; padding: 0 0 20px 0; font-size: 16px; color: #222; line-height: 1.7; box-sizing: border-box;}

.countries_right{width: 100%; background: #ebf4fe; border-radius: 8px; padding: 30px 30px; display: flex;  flex-wrap: wrap; gap:25px 0; box-sizing: border-box;}
.countries_gq{display: flex; align-items: center; width: 259px;}
.countries_gq a{display: flex; align-items: center;}
.countries_gq i{width:20px; flex-shrink: 0;}
.countries_gq i img{width: 100%; border-radius: 2px;}
.countries_gq span{font-size: 14px; color: #333; padding: 0 0 0 8px;}
.countries_gq em{width:12px; flex-shrink: 0; margin: 0 0 0 5px;}
.countries_gq em img{width: 100%;}
.countries_gq a:hover span{text-decoration: underline; color: #000;}



.agreement_box{width: 100%; font-size: 15px; color: #333; line-height: 1.8; padding: 0 0 30px 0;}
.agreement_box h2{display: block; width: 100%; font-size: 22px; color: #333; font-weight: 500; line-height: 1.5; padding: 0 0 15px 0;}


/*home*/
.mainbox{width: 100%; display: flex; min-width: 1300px;}
.mainleft{flex-shrink: 0; width: 240px; border-right: #ECECF0 1px solid; box-sizing: border-box; background: #fff; height: 100vh; overflow: auto; padding: 0 25px 15px 25px; display: flex; flex-direction: column;}
.mainleft::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.mainleft::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.mainleft::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.logo_box{display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: sticky; top: 0; z-index: 9; background: #fff; padding: 30px 0 0 0; width: 100%; box-sizing: border-box;}
.logo_box>i{margin-right: 25px; cursor: pointer;}
.nav_box{width: 100%; display: flex; flex-direction: column; gap: 15px; padding: 30px 0 0 0; flex: 1; min-width: 0;}
.nav_box>a{display: flex; align-items:center; font-size: 16px; color: #222; padding: 0 10px 0 20px; height: 42px; line-height: 42px; font-weight: 500; position: relative; box-sizing: border-box;}


.nav_box .nav_home_hover,.nav_box .nav_survey_hover,.nav_box .nav_game_hover,.nav_box .nav_vote_hover,.nav_box .nav_shop_hover,.nav_box>a:hover{background: linear-gradient( 90deg, #16ADFD 0%, #0F8FFD 100%); box-shadow: 0px 6px 20px 1px #CBE6FF; border: 1px solid #129BFD; border-radius: 60px; color: #fff!important;}


.nav_home i{width: 18px; height: 18px; background: url(../../images/nav/home.svg) no-repeat center; margin-right: 10px; background-size: 18px;}
.nav_box .nav_home_hover i, .nav_home:hover i{background: url(../../images/nav/home2.svg) no-repeat center!important; background-size: 18px;}
.nav_survey i{width: 18px; height: 18px; background: url(../../images/nav/survey.svg) no-repeat center; margin-right: 10px; background-size: 18px;}
.nav_box .nav_survey_hover i, .nav_survey:hover i{background: url(../../images/nav/survey2.svg) no-repeat center; background-size: 18px;}
.nav_game i{width: 18px; height: 18px; background: url(../../images/nav/game.svg) no-repeat center; margin-right: 10px; background-size: 18px;}
.nav_box .nav_game_hover i, .nav_game:hover i{background: url(../../images/nav/game2.svg) no-repeat center; background-size: 18px;}
.nav_vote i{width: 18px; height: 18px; background: url(../../images/nav/vote.svg) no-repeat center; margin-right: 10px; background-size: 18px;}
.nav_box .nav_vote_hover i, .nav_vote:hover i{background: url(../../images/nav/vote2.svg) no-repeat center; background-size: 18px;}
.nav_shop i{width: 18px; height: 18px; background: url(../../images/nav/shop.svg) no-repeat center; margin-right: 10px; background-size: 18px;}
.nav_box .nav_shop_hover i, .nav_shop:hover i{background: url(../../images/nav/shop2.svg) no-repeat center; background-size: 18px;}

.mainleft .foot_nav_box{flex-shrink: 0; width: 100%; padding: 15px 0 0 0;}
.mainleft .foot_nav{width: 100%; display: flex; flex-direction: column; gap:2px; border-top: #ECECF0 1px solid; padding: 15px 0; box-sizing: border-box;}
.mainleft .foot_nav>a{font-size: 14px; color: #222; display: flex; align-items: center; height: 36px; line-height: 36px; padding: 0 10px; position: relative;}
.mainleft .foot_nav>a>i{width: 16px; margin: 0 10px 0 0;}
.mainleft .foot_nav>a>i img{width: 100%;}
.mainleft .foot_nav_hover,.mainleft .foot_nav>a:hover{background: #EFF1F7; border-radius: 8px; color: #1673E8;}

.mainleft .foot_nav>a>em{background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 16px; line-height: 16px; padding: 0 5px; display: flex; margin-left: 8px;}
.mainleft .foot_contact{width: 100%; border-top: #ECECF0 1px solid; padding: 15px 0 0 0; font-size: 12px; color: #999; line-height: 1.6;}
.mainleft .foot_contact>a{background: #F5F6F7; border-radius: 60px; display: block; width: 100%; box-sizing: border-box; padding: 5px 4px; font-size: 12px; color: #999AAA; text-align: center; margin: 10px 0 0 0;}

/*maincontent*/
.maincontent{flex:1; min-width: 0; box-sizing: border-box; background: #fff; padding: 30px 30px 0 30px; box-sizing: border-box;}
.main_head{width: 100%; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; padding: 0 10px; min-width: 800px;}
.main_head .seach{width: 320px; height: 34px; display: flex; align-items: center;}
.main_head .seach input{width: 100%; font-size: 14px; color: 333; padding: 0 10px; line-height: 34px; box-sizing: border-box; border-radius: 8px; border-radius: 8px 0 0 8px; border: #9ACEFB 1px solid; border-right: none;}
.main_head .seach a{background: #0086F6; border-radius: 0 8px 8px 0; height: 36px; padding: 0 10px; display: flex; align-items: center; }
.main_head .seach a:hover{background: #0f90fd; }

.main_head .shijian_box{font-size:14px; color: #333;}
.main_head .shijian_box small{font-size:14px;}

.head_gundong{display: flex; align-items: center; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap;}
.scroll-track {display: flex; align-items: center; gap:12px; will-change: transform;}
.head_gundong_list{border-radius: 60px; background: #F2F8FE; display: flex; align-items: center; height: 35px; line-height: 35px; padding: 0 20px; }
.head_gundong_list span{font-size: 14px; color: #f56e5c; padding: 0 5px 0 0;}
.head_gundong_list small{font-size: 14px; color: #333;}


.main_head .head_right{display: flex; align-items: center; flex-shrink: 0; padding: 0 0 0 30px;}
.head_right .head_zliao{display: flex; align-items: center; background: #F2F8FE; border-radius: 60px; padding: 5px 10px 5px 5px; cursor: pointer;}
.head_right .head_zliao:hover{background: #e8eff7;}
.head_right .head_zliao:hover span{color: #1673E8;}
.head_right .head_zliao i{width: 25px; height: 25px;}
.head_right .head_zliao i img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.head_right .head_zliao span{font-size: 14px; color: #222; padding: 0 5px; max-width: 100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height: 1.3;}
.head_right .head_zliao small{width: 5px;}
.head_right .head_zliao small img{width: 100%;}


.head_right .head_xx{display: flex; align-items: center; font-size: 14px; color: #222; padding: 0 20px; cursor: pointer;  border-left: #DADFE6 1px solid; border-right: #DADFE6 1px solid; margin: 0 20px; position: relative;}
.head_right .head_xx i{width: 10px; margin: 0 5px 0 0 ;}
.head_right .head_xx i img{width: 100%;}
.head_right .head_xx:hover{ color: #1673E8;}
.head_right .head_xx em{position: absolute; top: -15px; right: 4px; background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 18px; line-height: 18px; padding: 0 6px;}


.head_right .head_dyt{display: flex; align-items: center; background: linear-gradient( 90deg, #FC5531 0%, #FF7700 100%); border-radius: 60px; padding: 5px 10px 5px 5px; cursor: pointer; position: relative;}
.head_right .head_dyt:hover{background: #f3502d;}
.head_right .head_dyt i{width: 25px; height: 25px; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.head_right .head_dyt i img{width: 18px;}
.head_right .head_dyt span{font-size: 14px; color: #fff; padding: 0 5px;}
.head_right .head_dyt small{width: 5px;}
.head_right .head_dyt small img{width: 100%;}
.head_right .head_dyt em{position: absolute; top: -16px; right: -25px; background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 18px; line-height: 18px; padding: 0 6px;}




/*tan message*/
.message_content{display: none;}
.message_title{width: 100%;  padding: 0 20px; height: 56px; line-height: 56px; border-bottom: #EEEFF1 1px solid; box-sizing: border-box; display: flex; align-items: center; gap:30px;}
.message_title a{font-size: 16px; color: #444; position: relative; }
.message_title a em{background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 18px; line-height: 18px; padding: 0 6px; display: flex; position: absolute; top: 8px; right: -20px;}
.message_title a:first-child {color: #222; font-weight: bold; padding: 0 5px;}
.message_title a:first-child:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 3px;
    background: #333;
    left: 0;   
    border-radius: 3px;
    z-index: 10;
    bottom: 0;
}

.message_foot{width: 100%; display: flex; align-items: center; justify-content: space-between; background: #fff; border-top: solid 1px #EEEFF1; line-height: 55px; padding: 0 20px;}
.message_foot span{font-size: 14px; color: #333;}
.message_foot small{font-size: 14px; color: #40abe2; cursor: pointer;}
.message_foot small:hover{color: #1964FF;}
.message_foot_hui{color: #D8D8D8!important; cursor: not-allowed!important;}

.message_nr{width: 100%; height: 450px; overflow: auto;}
.message_nr::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.message_nr::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.message_nr::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.message_list{width: calc(100% - 40px); border-bottom: solid 1px #EEEFF1; display: flex; margin: 0 20px; padding: 20px 5px;}
.message_list:last-child{border-bottom:none;}
.message_list_hover{opacity: .6}
.message_list>i{width: 36px; flex-shrink: 0;}
.message_list>i img{width: 100%;}
.message_list_zi{flex:1; min-width: 0; padding: 0 0 0 10px; display: flex; flex-direction: column;}
.message_list_title{font-size: 16px; color: #222; font-weight: bold; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 0 6px 0;}
.message_list_title em{display: inline-block; width: 6px; height: 6px; border-radius: 50%;  background-color: #ff6161;}

.message_list_nr{font-size: 14px; color: #666; line-height: 1.5;  overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; display:-webkit-box; display:box; transition: all .3s;}
.message_list_nr2{font-size: 14px; color: #666; line-height: 1.5;}


.message_list_time{width: 100%; display: flex; align-items: center; justify-content: space-between; background: #fff; padding: 10px 0 0 0;}
.message_list_time span{font-size: 12px; color: #999;}
.message_list_time small{font-size: 12px; color: #40abe2; cursor: pointer;}
.message_list_time small:hover{color: #1964FF;}


/*tan ziliao*/
.tan_center_content{display: none;}
.tan_center_box{width: 100%; padding: 5px; box-sizing: border-box;}
.tan_center_top{width: 100%; background: linear-gradient(180deg, #E8EBED 0%, #F7F8FA 90%); border-radius: 4px; padding: 15px 20px; box-sizing: border-box;}
.corp_bg{background: linear-gradient(180deg, #f9e5cf 0%, #fffcf8 100%);}
.tan_center_ziliao{display: flex; align-items: center; width: 100%; box-sizing: border-box;}
.tan_center_ziliao a{display: flex; align-items: center; width: 100%;}
.tan_center_ziliao a:hover .tan_center_name>span>em{color: #1673E8;}
.tan_center_ziliao>a>i{width: 48px; height: 48px; flex-shrink: 0;}
.tan_center_ziliao>a>i img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 1px solid #f6f7f9;}
.tan_center_name{display: flex; flex-wrap: wrap; flex: 1; min-width: 0; flex-direction: column; padding: 0 0 0 10px; }
.tan_center_name>span{width: 100%;  display: flex; align-items: center;}
.tan_center_name>span>em{font-size: 14px; color: #222; font-weight: bold; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height: 20px; line-height: 20px;}
.tan_center_name>span>i{margin-left: 10px; flex-shrink: 0;}
.tan_center_name>small{width: 100%; font-size: 12px; color: #333; padding: 1px 0 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height: 20px; line-height: 20px;}

.tan_center_jifen{width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 15px 0 0 0;}
.tan_center_jifen .list{display: flex; flex-direction: column; align-items: center;}
.tan_center_jifen .list span{font-size: 16px; color: #333; font-family: Din; font-weight: 500;}
.tan_center_jifen .list small{font-size: 12px; color: #888; padding: 5px 0 0 0;}


.tan_center_nav{width: 100%; display: flex; flex-direction: column;
    gap: 6px; padding: 10px 0;}
.tan_center_nav li{width: 100%;}
.tan_center_nav li a{display: flex; align-items: center; width: 100%; padding: 12px 20px; border-radius: 4px; box-sizing: border-box;}
.tan_center_nav li a i{width: 15px;}
.tan_center_nav li a i img{width: 100%;}
.tan_center_nav li a span{font-size: 14px; color: #222; padding: 0 0 0 10px;}
.tan_center_nav .tan_center_nav_hover,.tan_center_nav li a:hover{background: #EFF1F7;}
.tan_center_nav .tan_center_nav_hover span,.tan_center_nav li a:hover span{color: #1673E8;}
.tan_center_nav li {
    &:last-of-type {
        border-top: #E4E4E5 1px solid; padding: 10px 0 0 0;
    }
}


/*login*/
.login_box{width: 100%; }
.login_bg{width: 100%; height: 620px; position: relative; background: linear-gradient(180deg, #e9f1ff, rgba(233, 241, 255, 0)); border-radius: 1px;}
.login_main{width: 1280px; height: 581px; position: absolute; left: 0; right: 0; margin: 0 auto; background-image: url(../../images/login/bg.png);
    background-size: 100%;     background-repeat: no-repeat;}



.login_logo{width: 100%; height: 42px; position: absolute; left: 0; top: 70px; display: flex; align-items: center; justify-content: center;}
.login_content{width: 500px; height: 480px; padding: 0 60px 30px 60px; background: #fff; box-shadow: 0 10px 20px 0 rgba(127, 145, 180, .1); border-radius: 8px; position: absolute; left: 0; right: 0; top: 50px; margin: 0 auto; box-sizing: border-box;}
.login_content h1{width: 100%; text-align: center; font-size: 24px; color: #222; padding:45px 0; }

.login_title{width: 100%; display: flex; align-items: center; justify-content: center; padding:45px 0; gap:50px;}
.login_title a{font-size: 20px; color: #666;}
.login_title a:hover{color: #222;}
.login_title .hover{font-size: 20px; color: #222; position: relative;}
.login_title .hover:after {
    background: #2672ff;
    border-radius: 8px;
    bottom: -5px;
    content: "";
    height: 2px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    position: absolute;
    width: 46px
}


.login_input{width: 100%; display: flex; align-items: center; margin-bottom: 15px; position: relative; height: 42px;}
.login_input i{width: 16px; margin: 0 5px 0 10px; position: absolute; z-index: 3;}
.login_input i img{width: 100%;}
.login_input input{width: 100%; height: 48px; line-height: 48px; padding: 0 5px 0 32px; box-sizing: border-box; background: #fff; border: #e9ecf0 1px solid; border-radius:8px; font-size: 14px; color: #222; position: absolute; z-index: 2;}
.login_input input:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}
.login_input input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color:#666;}
.login_input input:-moz-placeholder, textarea:-moz-placeholder{color:#666;}
.login_input input::-moz-placeholder, textarea::-moz-placeholder {color:#666;}
.login_input input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:#666;}

.login_nr_txt{width: 100%; display: flex; justify-content: space-between; padding: 0 0 10px 0;}
.login_nr_txt span{font-size: 14px; color: #444;}

.login_nr_input{width: 100%; display: flex; padding: 0 0 10px 0; position: relative;}
.login_nr_input .login_cuotip{    bottom: 50px;}
.login_iput2{width:250px; height:44px; line-height:44px;  padding:0 10px; border:#e8e8e8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #333;}
.login_iput2:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}
.register_yzm{display: inline-block; min-width:140px; text-align: center; height:44px; line-height:44px;  padding:0 10px; border:#1673E8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #1673E8; margin-left: 10px; cursor: pointer;}
.register_yzm_hover:hover{border:#1673E8 1px solid; background:#1673E8;  color: #fff;}


.login_cuotip{position: absolute; bottom: 40px; left: 34px; z-index: 9; background-color: #FFCFCF; border: #FF1F1F 1px solid; font-size: 12px; color: #2F2C2C; text-shadow: 0 1px 0 #FFFFFF; padding: 3px 6px; border-radius: 2px; display: none;}
.login_cuotip:after{content: ""; position: absolute; left: 10px; width: 15px; height: 15px; background: url(../../images/tri.gif) no-repeat scroll 0 0 transparent; bottom:-11px}

.login_ren{width: 250px; height: 244px; position: absolute; left: 200px; bottom: -4px}
.login_ren img{width: 100%;}

.register_yszc{width: 100%; padding: 5px 0 0 0;}
.register_yszc label{line-height: 1.5;}
.register_yszc span{font-size: 13px; color: #3f4755; padding: 0 0 0 5px;}
.register_yszc a{font-size: 13px; color: #1673E8;}
.register_yszc a:hover{text-decoration: underline;}
.register_yszc em{font-size: 13px; color: #3f4755;}

.login_btnbox{width: 100%; padding: 20px 0 0 0;}
.login_btnbox a{width: 100%; height: 48px; line-height: 48px; border-radius: 8px; font-size: 14px; color: #fff; display: flex; align-items: center; justify-content: center;}

.newlogin_gap{width: 100%; display: flex; align-items: center; margin: 30px 0 24px 0;}
.newlogin_gap em{width: auto; flex: 1 0; height: 2px; border-radius: 1px; background: linear-gradient(270deg,#fff,#e9ecf0); position: relative}
.newlogin_gap em:nth-child(1){ transform: rotate(180deg);}
.newlogin_gap span{width: auto; height: 16px; font-size: 14px; color: #a4acb9; font-weight: 500; line-height: 16px; text-align: center; text-transform: uppercase; margin: 0 10px;}

.login_dsf{width: 100%; display: flex; align-items: center; justify-content: center; gap:20px;}
.login_dsf a{width: 54px;}
.login_dsf a img{width: 100%;}

.newlogin_zhuce1{position: absolute; right: -8px; top: 10px; width: auto; height: 26px; background: linear-gradient(270deg,#2879ff,#94c2fd); border-radius: 13px 0 0 13px; font-size: 13px; color: #fff; line-height: 26px; z-index: 2; cursor: pointer; padding: 0 10px;}
.newlogin_zhuce1 a{font-size: 13px; color: #fff; line-height: 26px;}
.newlogin_zhuce1 a:hover{color: #fff;}
.newlogin_zhuce2 {position: absolute; top: 36px; right: -8px; width: 8px; height: 8px; background: linear-gradient(to left top,transparent 0,transparent 49%,#2879ff 50%,#0150d5); z-index: 0; overflow: hidden;}




.rigister_content{width: 640px;}
.rigister_title{width: 100%; display: flex; flex-direction: column; align-items: center; }
.rigister_title h2{font-size: 24px; color: #222; padding: 45px 0 18px 0;}
.rigister_title span{font-size: 15px; color: #666; padding: 0 0 20px 0;}
.rigister_list{width: 100%; display: flex; align-items: center; padding: 15px 20px; border: #eee 1px solid; border-radius: 8px; margin: 10px 0 20px 0; box-sizing: border-box;box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); cursor: pointer;}
.rigister_list:hover{background: #EBF5F8; border-box;box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06);}

.rigister_content .complete{background: #EBF5F8;}
.rigister_content .complete .pic_email,.rigister_content .complete .pic_ziliao{background: url(../../images/login/dui.svg) no-repeat; background-size: 100%;}

.rigister_list>i{flex-shrink: 0; width: 48px; height: 48px;}
.rigister_list .pic_email{background: url(../../images/login/email.svg) no-repeat; background-size: 100%;}
.rigister_list .pic_phone{background: url(../../images/login/phone.svg) no-repeat; background-size: 100%;}
.rigister_list .pic_ziliao{background: url(../../images/login/ziliao.svg) no-repeat; background-size: 100%;}
.rigister_list .zibox{display: flex; align-items: center; justify-content: space-between; flex: 1; min-width: 0; padding: 0 0 0 15px;}
.rigister_list .zibox .zi{display: flex; flex-direction: column; flex:1; min-width: 0;}
.rigister_list .zibox .zi span{font-size: 16px; color: #222;}
.rigister_list .zibox .zi small{font-size: 14px; color: #999; padding: 10px 0 0 0; line-height: 1.5;}
.rigister_list .zibox .zi small em{color: #1673E8;}
.rigister_list .zibox a{font-size: 14px; color: #fff; padding: 6px 12px; border-radius: 60px; flex-shrink: 0; margin-left: 10px;}

.rigister_tiao{width: 100%; padding: 20px 0 0 0; display: flex; align-items: center; justify-content: center;}
.rigister_tiao span{font-size: 14px; color: #222; padding: 0 3px 0 0;}
.rigister_tiao a{font-size: 14px; color: #1673E8;}
.rigister_tiao a:hover{text-decoration: underline;}



.tanverify_account{width: 100%;  padding:40px 30px 20px 30px; box-sizing: border-box; border-radius: 8px;}
.tanverify_account .title{width: 100%;}
.tanverify_account .title span{display: block; width: 100%; font-size: 22px; color: #222; font-weight: bold;}
.tanverify_account .title small{display: block; width: 100%; font-size: 14px; color: #666; padding: 15px 0 30px 0; line-height: 1.5;}

.tanverify_account .inputbox{width: 100%;  display: flex;}
.tanverify_account .inputbox input{width:250px; height:44px; line-height:44px;  padding:0 10px; border:#e8e8e8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #222;}
.tanverify_account .inputbox input:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}

.tanverify_account .inputbox span{min-width:140px; text-align: center; height:44px; line-height:44px;  padding:0 10px; border:#1673E8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #1673E8; cursor: pointer; margin-left: 10px;}
.tanverify_account .inputbox span:hover{border:#1673E8 1px solid; background: #1673E8; color: #fff;}


.tanverify_account .yzmtip{width:100%; font-size:13px; color:#666; padding:20px 0 30px 0; line-height:1.7;} 
.tanverify_account .yzmtip span{display: block; width: 100%; font-size:15px; color:#222; padding: 0 0 5px 0;}
.tanverify_account .yzmtip a{font-size:13px; color:#1673E8; text-decoration:underline;}
.tanverify_account .yzmtip a:hover{text-decoration:none;}

.tan_btn{width: 100%; text-align: center; display: flex; align-items: center; justify-content:center; padding: 30px 0 30px 0; flex-shrink: 0;}
.btn_tiao{font-size: 14px; color: #222; margin-right: 30px;}
.btn_tiao:hover{text-decoration: underline;}
.btn_jt{display: flex; align-items: center; justify-content:center; height: 50px; line-height: 50px; padding: 0 50px; border-radius: 60px;}
.btn_quxiao{font-size: 14px; color: #222; margin-right: 20px; border: #ccc 1px solid; height: 50px; line-height: 50px; padding: 0 50px; border-radius: 60px;}

.tan_profilemain{width: 100%; height: 100vh; padding: 40px 30px 0 30px; box-sizing: border-box; border-radius: 8px; display: flex; flex-direction: column;}
.tan_profilemain .title{width: 100%; flex-shrink: 0;}
.tan_profilemain .title span{display: block; width: 100%; font-size: 22px; color: #222; font-weight: bold;}
.tan_profilemain .title small{display: block; width: 100%; font-size: 14px; color: #555; padding: 15px 0 30px 0; line-height: 1.5;}

.tan_profilebox{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap:20px; flex:1; min-width: 0; overflow: auto;}
.tan_profilebox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.tan_profilebox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.tan_profilebox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}
.tan_profilebox .list{width: 48%; display: flex;  flex-direction: column;}
.tan_profilebox .list .zi{width: 100%; display: flex; align-items: center;}
.tan_profilebox .list .zi small{font-size: 14px; color: #FB5652; padding: 0 5px 0 0;}
.tan_profilebox .list .zi span{font-size: 14px; color: #222;}
.tan_profilebox .list .inputbox{width: 100%; padding: 10px 0 0 0; }
.tan_profilebox .list .genderbox{width: 100%; padding: 10px 0 0 0; display: flex; gap:10px;}
.tan_profilebox .list .gender{width: 40%; display: flex; align-items: center; justify-content: center; border:#e8e8e8 1px solid; border-radius: 8px;  height:40px; line-height:40px;  padding:0 10px; box-sizing: border-box; cursor: pointer;}
.tan_profilebox .list .gender i{width: 16px;}
.tan_profilebox .list .gender span{font-size: 14px; color: #222; padding: 0 0 0 8px;}
.tan_profilebox .list .gender_hover,.tan_profilebox .list .gender:hover{background: #EBF5F8;}

.tan_profilebox .selectbox{width: 100%; display: flex; gap:10px;  padding: 10px 0 0 0;}
.tan_profilebox .selectbox .select_width1{width: 50%;}
.tan_profilebox .layui-form-select dl{max-width: 270px; max-height: 240px;}
.tan_profilebox .layui-form-select{width: 100%; border-radius: 8px;     box-sizing: border-box; border: 1px solid transparent;}

.basic_input1{width:100%; height:40px; line-height:40px;  padding:0 10px; border:#e8e8e8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #222;}
.basic_input1:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}
.basic_input2{width:300px; height:40px; line-height:40px;  padding:0 10px; border:#e8e8e8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #222;}
.basic_input2:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}

.tan_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.7); z-index:998; top: 0; left: 0;}


/*home_main*/
.home_main{width: 100%; display: flex; padding: 30px 10px 0 10px; box-sizing: border-box;}
.home_main .left{flex: 1; min-width: 670px;}
.home_main .right{width: 300px; flex-shrink: 0; margin: 0 0 0 30px;}

.main_banner{width: 100%; height: 150px; background: #DDECF0; border-radius: 8px; display: flex; justify-content: center; position: relative;}
.main_banner img{width: 100%;  border-radius: 8px; object-fit: cover; object-position: center top;}
.main_banner>span{position: absolute; top: 10px; right: 10px; font-size: 12px; color: #fff; padding: 2px 5px; border-radius: 4px; border: 1px solid #fff;}

.right_guanggao{width: 100%; height: 380px; background: #eaefeb; border-radius: 8px; position: relative;}
.right_guanggao img{width: 100%; height: 100%;  border-radius: 8px; object-fit: cover; object-position: center top;}
.right_guanggao>span{position: absolute; top: 10px; right: 10px; font-size: 12px; color: #fff; padding: 2px 5px; border-radius: 4px; border: 1px solid #fff;}


.banner_gun{width: 100%; height: 150px; overflow: hidden; position: relative;}
.banner_gun a{display: block; width: 100%; height: 150px;}
.banner_gun img{display: block; width: 100%; height: 150px; border-radius: 8px; object-fit: cover; object-position: center top;}
.banner_points {position: absolute; z-index: 5; list-style: none; width: 20%; display: flex; align-items: center; justify-content: center; gap:6px; bottom: 8px; left: 40%; height: 4px; border-radius: 25px; }
.banner_points li {cursor: pointer; display: inline-block; width: 8px; height: 4px;border-radius: 15px; background-color: rgba(255,255,255,0.45);}
.banner_active {width: 14px!important; background-color: hsla(0,0%,100%,1.00) !important;}
.banner_prev {border-radius: 0 30px 30px 0;}
.banner_next,.banner_prev {appearance: menu; margin: 0 auto; width: 40px; display: block; float: left; height: 40px; position: absolute; line-height: 40px; text-align: center; font-family: "宋体"; color: aliceblue; z-index: 997; background-color: hsla(0,0%,0%,0.15); top: 35%; cursor: pointer; font-size: 14px;}
.banner_next {right: 0px; border-radius: 30px 0 0 30px;}
.banner_prev:hover{background-color: hsla(0,0%,0%,0.5);}
.banner_next:hover{background-color: hsla(0,0%,0%,0.5);}



/*home_box*/
.home_main .home_box{width: 100%; padding: 25px 0 0 0;}
.home_box .title{width: 100%; display: flex; align-items: center; justify-content: space-between;}
.home_box .title>span{font-size: 18px; color: #222; display: flex; align-items: baseline; font-weight: bold;}
.home_box .title>span em{font-size: 14px; color: #888; padding: 0 0 0 5px; font-weight: 500;}
.home_box .title>a{font-size: 14px; color: #9296A6; background: url(../../images/jiantou/jt_right2.svg) no-repeat right; background-size: 6px; padding-right: 10px;}
.home_box .title>a:hover{color: #333; background: url(../../images/jiantou/jt_right22.svg) no-repeat right; background-size: 6px; }


.home_box .scrolllist{width:100%;  padding: 20px 0 0 0; position: relative;}

.home_box .aleft{position: absolute; top: 80px; left: -18px; z-index: 99; width: 40px; height: 40px; background: rgba(255, 255, 255, 0.8); border-radius: 8px; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .1); display: flex; align-items: center; justify-content: center;}
.home_box .agrayleft{cursor:default; display: none;}
.home_box .aright{position: absolute; top: 80px; right: -18px; z-index: 99; width: 40px; height: 40px; background: rgba(255, 255, 255, 0.8); border-radius: 8px; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .1); display: flex; align-items: center; justify-content: center;}
.home_box .agrayright{cursor:default; display: none;}


.home_box .scrolllist .imglist_w{width:100%; height:244px; overflow:hidden;position:relative;/*必要元素*/}
.home_box .scrolllist .imglist_w ul{width:200000px; position:absolute; left:0px; top:0px; display: grid; justify-content: space-between;     grid-gap: 20px 0; grid-template-columns: repeat(auto-fill, 245px);}
.home_box .scrolllist .imglist_w li{width:225px; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px;}
.home_box .scrolllist .imglist_w li:hover{
    box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); border-radius: 10px;}
.home_box .scrolllist .imglist_w li:hover .survey_pic .pic img{-ms-transform: scale(1.05); transform: scale(1.05); border-radius: 10px;}


.home_box .survey_list{width: 100%; cursor: pointer;}
.home_box .survey_pic{width: 100%; height: 120px; display: flex; position: relative;}
.home_box .survey_pic .pic{width: 100%; height: 120px; overflow: hidden; border-radius: 10px;}
.home_box .survey_pic .pic img{display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; transition: transform .3s ease 0s; object-fit: cover;}
.home_box .survey_pic .biao{position: absolute; top: 5px; left: 5px; padding: 4px 5px; background-color: rgba(0, 0, 0, .5); border-radius:20px;}

.home_box .survey_zi{width: 100%; box-sizing: border-box; padding: 15px 5px 15px 10px; display: flex; flex-direction: column;}
.home_box .survey_zi>small{width: 100%; font-size: 13px; color: #666;}
.home_box .survey_zi>span{width: 100%; font-size: 16px; color: #222; padding: 8px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height: 1.3;}
.home_box .survey_jf{width: 100%; display: flex; align-items: center;}
.home_box .survey_jf>span{font-size:20px; color:#ff472e; margin-right:15px; display: flex; align-items: center;}
.home_box .survey_jf>span>i{width: 20px; margin: 0 3px 0 0;}
.home_box .survey_jf>span>i img{width: 100%;}
.home_box .survey_jf>span>p{display: flex; align-items: baseline;}
.home_box .survey_jf>span>p>b{font-size:22px; color:#ff472e;     font-weight: 500;  font-family: Din;}
.home_box .survey_jf>span>p>em{font-size:14px; color: #FB5652; margin-left: 2px;}
.home_box .survey_jf>small{font-size:14px; color:#666; display: flex; align-items: center;}
.home_box .survey_jf>small>i{width: 20px; margin: 0 3px 0 0;}
.home_box .survey_jf>small>i img{width: 100%;}


/*game*/
.game_box{width: 100%; padding: 20px 0; display: flex;  flex-wrap: wrap; justify-content: space-between; grid-gap: 20px; box-sizing: border-box;}
.game_box .list{width: 48.5%; background: #F1F7FF; border-radius: 8px; padding: 14px; display: flex; box-sizing: border-box;     flex-grow: 1;}
.game_box .list>a{display: flex; width: 100%;}
.game_box .list>a:hover .game_zi>span{color: #1673E8;}
.game_box .list .game_imgbox{width: 70px; height: 70px; display: flex; flex-shrink: 0; position: relative;}
.game_box .list .game_pic{width: 100%; height: 70px;}
.game_box .list .game_pic img{display: block; width: 100%; height: 100%; object-fit: cover;     border-radius: 10px;}
.game_box .list .game_biao{position: absolute; top: 5px; left: 5px; padding: 2px 4px; background-color: rgba(0, 0, 0, .5); border-radius:20px;}
.game_box .list .game_zi{flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-around; padding: 0 0 0 10px;}
.game_box .list .game_zi>span{font-size: 16px; font-weight: bold; color: #222; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height: 1.3;}
.game_box .list .jifen{width: 100%; display: flex; justify-content: space-between; align-items: center;}
.game_box .list .jifen>small{flex: 1; min-width: 0; font-size: 14px; color: #666; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height: 1.3;}
.game_box .list .jifen>span{flex-shrink: 0; display: flex; align-items: center; font-size: 16px; color: #ff472e;     margin-right: 5px;}
.game_box .list .jifen>span>i{width: 18px; margin: 0 3px 0 0;}
.game_box .list .jifen>span>i img{width: 100%;}
.game_box .list .jifen>span>p{display: flex; align-items: baseline;}
.game_box .list .jifen>span>p>b{font-size:20px; color:#ff472e;     font-weight: 500; font-family: Din;}
.game_box .list .jifen>span>p>em{font-size:14px; color: #FB5652; margin-left: 2px;}

/*vote*/
.voten_tuij_list{width: 100%; display: flex;  margin: 15px 0 10px 0; cursor: pointer;}
.voten_tuij_list:hover,.voten_tuij_nr h2:hover{color: #ed4731;}
.voten_tuij_list i{width: 15px; padding: 3px 10px 0 0; flex-shrink: 0;}
.voten_tuij_nr{flex: 1; min-width: 0; display: flex; flex-direction: column;}
.voten_tuij_nr a{width: 100%; font-size: 14px; color: #333; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.voten_tuij_nr a:hover{color:#ed4731; text-decoration:none;}

.voten_tuij_nrzan{width: 100%; padding: 6px 0 0 0; display: flex; align-items: center; gap:15px;}
.voten_tuij_nrzan span{font-size: 12px; color: #999;}
.voten_tuij_nrzan small{display: inline-block; font-size: 12px; color: #999;}



/*mainright*/
.mainright1{flex-shrink: 0; width: 300px; border-left: #ECECF0 1px solid; box-sizing: border-box; background: #fff; padding: 0 15px; position: relative; z-index: 3;}

.mainright2{flex-shrink: 0; width: 18px; border-left: #ECECF0 1px solid; box-sizing: border-box; background: #fff; display: none;  position: relative; z-index: 3;}
.mainright2>span{position: absolute; top: 100px; left: 0; background: #000; width: 10px; height: 15px; position: relative;}



.right_jt{position: absolute; left: -10px; top: 45%; width: 16px; height: 64px; border-radius: 20px; background: #edf2f5; border:1px solid rgba(0,0,0,.08); cursor: pointer; display: flex; align-items: center; justify-content: center; display: none;}
.right_jt:hover{background: #dde6eb;}

.mainright1:hover .jt_tip1{display: flex;}
.mainright2 .jt_tip2{display: flex;}


.right_jifenbox{width: 100%;}
.right_jf_title{width: 100%; font-size: 14px; color: #333; padding: 20px 0 10px 0;}
.right_jf_tip{width: 100%;  margin: 10px 0 0 0;}
.right_jf_tip_zi{font-size: 13px; color: #555; line-height: 1.5; width: 100%;}
.right_jf_tip_zi span{display: inline-block; font-size: 13px; font-weight: bold; color: #333;}

.right_jf_btn{width: 100%; margin: 10px 0;}
.right_jf_btn a{display: block; width: 100%; font-size: 14px; color: #333; border-radius: 8px; border: 2px solid #eee; height: 48px; line-height: 48px; text-align: center; box-sizing: border-box;}
.right_jf_btn a:hover{background: linear-gradient(90deg, #16ADFD 0%, #0F8FFD 100%);box-shadow: 0px 6px 20px #CBE6FF; color:#fff; border: 2px solid #16ADFD;}

.right_jf_nrbox{width: 100%; border-radius: 4px; padding: 10px 0; box-sizing: border-box; display: flex;}
.right_jf_nr_pic{width: 34px; padding: 0 10px 0 0; flex-shrink: 0;}
.right_jf_nr_pic img{width: 100%;}
.right_jf_nr{flex:1; min-width: 0;}
.right_jf{display: flex; align-items: baseline;}
.right_jf span{font-size: 20px; color: #222; font-family: Din!important;}
.right_jf small{font-size: 18px; color: #444; font-family: Din!important;}
.right_jf em{font-size: 13px; color: #444; padding: 0 0 0 3px;}
.right_jf i{width: 16px; margin-left: 3px;}
.right_jf_zhexian{width: 100%; font-size: 12px; color: #666; padding: 5px 0 8px 0;}

.right_jf_jdut{display: flex; width: 100%; background: #e2e2e2; border-radius: 60px; height: 4px;}
.right_jf_jdut span{background: linear-gradient( 90deg, #65B266 0%, #D9B24B 33.88%, #F79138 65.69%, #AF2C28 100%); border-radius: 60px; height: 4px;}


/*points_activity*/
.points_activity_box{width: 100%; background: linear-gradient( 180deg, #f2f8ff 0%, #fff 100%); border: 1px solid #E4EDF8; border-radius: 8px; box-sizing: border-box; margin-top: 20px;}
.points_activity{width: 100%; border: 2px solid #fff; border-radius: 8px; box-sizing: border-box; padding: 0 0 0 0;}
.points_activity_title{width: 100%; box-sizing: border-box; padding: 15px 15px 10px 15px; display: flex; align-items: center;}

.points_activity_time{width: 100%; display: flex; align-items: center; gap:5px; padding: 0 15px 0 15px;  box-sizing: border-box;}
.points_activity_time span{background: #E8EFF5; border-radius: 2px; font-size: 12px; color: #333; padding: 4px;}
.points_activity_time small{font-size: 12px; color: #333;}

.points_activity_jf{width: 100%; display: flex; align-items: baseline; padding: 10px 15px 10px 15px;  box-sizing: border-box;}
.points_activity_jf span{font-size: 14px; color: #555;;}
.points_activity_jf small{font-size: 12px; color: #FB5652; padding: 0 0 0 2px;}
.points_activity_jf em{font-size: 16px; color: #ff472e; font-family: Din !important;}

.points_activity_title .zi1{display: flex; flex-direction: column; flex: 1; min-width: 0;}
.points_activity_title .zi1 span{font-size: 18px; color: #222; font-weight: bold;}
.points_activity_title .zi1 small{font-size: 14px; color: #666; padding: 4px 0 0 0;}
.points_activity_title .zi1 small em{font-size: 16px; color: #ff472e; font-family: Din !important;}

.points_activity_title .zi2{flex-shrink: 0; background: #F5FAFF; border-radius: 60px; border: #E4EDF8 1px solid; padding: 4px 8px; font-size: 12px; color: #999; display: flex; align-items: center; cursor: pointer;}
.points_activity_title .zi2 i{width: 14px; margin: 0 3px 0 0;}
.points_activity_title .zi2 i img{width: 100%;}
.points_activity_title .zi2:hover{background: #fff;}



.progress_box{width: 100%; padding: 50px 8px 20px 8px; box-sizing: border-box; position: relative;}

.progress_container{width: 100%; height: 12px; background-color: #eaeaea; border-radius: 10px; position: relative;}
.progress_bar{height: 100%; background: linear-gradient(to right, #DAD5FF, #0F92FD); border-radius: 10px; width: 37px; position: relative; display: flex; align-items: center; justify-content: end;}
.progress_text {color: #fff; font-size: 12px; transform: scale(0.83); display: inline-block;}
.progress_tips{background-color: #fff9e8;  border-radius: 8px; border:#f6f0de 1px solid; padding: 8px 12px; font-size: 12px; color: #333; display: inline-block;  position: absolute; top: -46px; left: 0; white-space: nowrap;}
.progress_tips em{font-size: 12px; color: #ff472e; font-weight: bold;}
.progress_tips:after{content: ""; position: absolute; bottom: -7px; left: 15px; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #fff9e8;}


.progress_iconbox{ position: absolute; right: 0px; top: 40px; width: 100%; display: flex; overflow: hidden;}

.progress_iconbox1{justify-content: flex-end;}
.progress_iconbox2{justify-content: space-between;}

.progress_iconlist1{display: flex; flex-direction: column; align-items: center;}
.progress_iconlist1 .icon{width: 24px; height: 27px;  background: url(../../images/points/suo1.png) repeat-x; background-size: 100%;}
.progress_iconlist1 .text{font-size: 12px; color: #ccc; border-radius: 60px; border: #ccc 1px solid; padding: 2px 6px 0 6px; transform: scale(0.83);}

.progress_iconlist2{display: flex; flex-direction: column; align-items: center; cursor: pointer;}
.progress_iconlist2 .icon{width: 24px; height: 27px;  background: url(../../images/points/suo2.png) repeat-x; background-size: 100%; animation: zoomInOut 2s ease-in-out infinite;}
.progress_iconlist2 .text{font-size: 12px; color: #FB5652; border-radius: 60px; border: #FB5652 1px solid; padding: 2px 6px 0 6px; transform: scale(0.83);}
.progress_iconlist2:hover .text{background: #FB5652; color: #fff;}

@keyframes zoomInOut {
  0% {
    transform: scale(1);   /* 初始状态：原始大小 */
  }
  50% {
    transform: scale(1.2); /* 动画中间：放大到 1.1 倍 */
  }
  100% {
    transform: scale(1);   /* 结束状态：恢复原始大小 */
  }
}

.progress_iconlist3{display: flex; flex-direction: column; align-items: center;}
.progress_iconlist3 .icon{width: 24px; height: 27px;  background: url(../../images/points/suo3.png) repeat-x; background-size: 100%;}
.progress_iconlist3 .text{font-size: 12px; color: #FB5652; border-radius: 60px; border: #FB5652 1px solid; padding: 2px 6px 0 6px; transform: scale(0.83); opacity: .4;}

.points_foot_pic{width: 100%; display: flex; align-items: center; justify-content: center; padding: 20px 0 0 0; opacity: .98}
.points_foot_pic img{width: 100%; border-radius: 0 0 8px 8px;}

/*points_activity_tan*/
.zindex99999{z-index: 99999!important;}
.tan_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.6); z-index:990; top: 0; left: 0;}
.tan_mainbox{top:0; left:50%; margin-left: -300px; width:600px; padding:30px 0 0 0; background: #fff; position: fixed; z-index: 999; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); -box-shadow: 0 0 10px rgba(0,0,0,.4);}
.tan_close{width: 40px; height: 40px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: absolute; top: 15px; right: 10px; z-index: 33;}
.tan_close:hover{background: #F7F9FD; border-radius: 50%;}

.tan_close2{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: absolute; bottom: -60px; left: 50%; z-index: 33; margin-left: -16px; border: #fff 1px solid; border-radius: 50%;}
.tan_close2:hover{border: #16ADFD 1px solid; background: #16ADFD; border-radius: 50%;}

.tan_mainbox_padding0{padding: 0;}

.tan_title{width: 100%; display: flex; justify-content: space-between;     align-items: center; border-bottom: 1px solid #eee; height: 60px; line-height: 60px; padding: 0 10px 0 30px; box-sizing: border-box;}
.tan_title span{font-size: 16px; color: #222; font-weight: bold;}
.tan_title i{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.tan_title i:hover{background: #eee; border-radius: 50%;}




.points_activity_tan{width: 480px; margin-left: -240px; background: linear-gradient( 178deg, #DBEDFF 0%, #FFFFFF 60%); border: 2px solid #FFFFFF; border-radius: 20px; padding: 20px; box-sizing: border-box;}
.point_tan_box1{width: 100%; border: 1px solid #C5DEF9; border-radius: 20px; box-sizing: border-box;}
.point_tan_box2{width: 100%; border: 1px solid #fff; border-radius: 20px;  box-sizing: border-box; position: relative;}
.point_tan_box2 .zi1{width: 100%; padding: 30px 20px 0 20px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }
.point_tan_box2 .zi1 span{font-size: 32px; color: #222; font-weight: bold; position: relative;}
.point_tan_box2 .zi1 span small{width:30px;  position: absolute; top: -10px; left: -40px;}
.point_tan_box2 .zi1 span small img{width: 100%;}
.point_tan_box2 .zi2{width: 100%; padding: 10px 20px 0 20px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }
.point_tan_box2 .zi2 span{font-size: 32px; color: #FB5652; font-weight: bold; position: relative;}
.point_tan_box2 .zi2 span:after{
    content: "";
    position: absolute;
    width: 30px;
    height: 10px;
    background: #F5D7CB;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 60px;
    z-index: -1;
    bottom: -2px;    
    width: 80%
}

.point_tan_box2 .zi3{width: 100%; padding: 30px 20px 0 20px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.point_tan_box2 .zi3 span{font-size: 22px; color: #222;}
.point_tan_box2 .zi3 small{font-size: 15px; color: #999; padding: 10px 0 0 0;}
.point_tan_box2 .zi3 p{display: flex; align-items: baseline; background: url(../../images/points/tanzi_bg.png) repeat-x  0 44px;}
.point_tan_box2 .zi3 p>b{font-size:72px; color:#FB5652;   font-family: Din;}
.point_tan_box2 .zi3 p>em{font-size:24px; color: #FB5652; margin-left: 2px;}

.point_tan_btn{width: 100%; display: flex; justify-content: center; padding: 30px 0;}
.point_tan_btn a{font-size: 16px; padding: 14px 40px; border-radius: 60px;}

.point_tan_xianshi{width: 90px; height: 90px; background: url(../../images/points/xianshi.png) no-repeat; background-size: 100%; position: absolute; top: 70px; right: 15px;}
.point_tan_xianshi span{font-size: 20px; color: #c86b46; font-weight: bold; transform: skewX(-15deg); text-shadow: 1px 1px 0 rgba(255,255,255,0.4); font-family: "SimHei", "Microsoft YaHei", sans-serif; display: inline-block; position: absolute; top: 33px; left: 24px;}


.points_activity_guize{width: 480px; margin-left: -240px; background: url(../../images/points/guize.png) no-repeat 0 -30px #fff; border-radius: 20px; background-size: 100%; padding: 20px 10px 5px 20px; box-sizing: border-box;}
.pointa_guize_title{width: 100%; display: flex; align-items: center; justify-content: center; padding: 5px 0 30px 0;}
.pointa_guize_title span{font-size: 22px; color: #222;}
.pointa_guize_nr{width: 100%; padding: 0 25px 30px 25px; box-sizing: border-box; max-height: 500px; overflow: auto;}
.pointa_guize_nr::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.pointa_guize_nr::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.pointa_guize_nr::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.pointa_guize_nr .zi1{display: flex; align-items: center; font-size: 18px; color: #222; padding: 18px 0 0 0;}
.pointa_guize_nr .zi1 em{background: #15A6FD; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #fff; border-radius: 50%; margin-right: 5px;}
.pointa_guize_nr .zi2{display: flex; align-items: center; flex-wrap: wrap; width: 100%; padding: 0 0 0 20px; box-sizing: border-box;}
.pointa_guize_nr .zi2 span{font-size: 15px; color: #555; line-height: 1.6; padding: 6px 0 0 0; display: flex; align-items: center;}
.pointa_guize_nr .zi2 span em{flex-shrink: 0; width: 4px; height: 4px; border-radius: 50%; background: #15A6FD; margin: 0 6px 0 4px;}


/*right_footbox*/
.right_footbox{width: 46px; position: fixed; bottom: 60px; right: 20px; z-index: 99; display: flex; flex-direction: column; gap:10px;}
.right_footbox .boxbox{width: 44px; height: 44px; border-radius: 50%; border:1px solid #E5E5E6; background: #fff; box-shadow: 0px 10px 30px 1px rgba(120,120,120,0.15); display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative;}
.right_footbox .boxbox:hover{background: #F6F7F9;}
.right_footbox>.right_foot_message{background: radial-gradient( 0% 0% at 50% 50%, #16ACFD 0%, #1091FD 100%)!important; border:1px solid #16ACFD;}
.right_footbox>.right_foot_message:hover{background: #16ACFD; border:1px solid #16ACFD;}
.right_footbox>.right_foot_message .nr{position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}

.right_footbox>.right_foot_message .nr>em{background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 18px; line-height: 18px; padding: 0 6px; position: absolute; top: -10px; right: -10px;}

.goTop img{position: relative; top: 16px; left: 17px;}

@keyframes scaleToggleOne { 0 {
transform:scale(1);
-webkit-transform:scale(1)
}
50% {
transform:scale(2);
-webkit-transform:scale(2)
}
100% {
transform:scale(1);
-webkit-transform:scale(1)
}
}
@keyframes scaleToggleTwo { 0 {
transform:scale(1);
-webkit-transform:scale(1)
}
20% {
transform:scale(1);
-webkit-transform:scale(1)
}
60% {
transform:scale(2);
-webkit-transform:scale(2)
}
100% {
transform:scale(1);
-webkit-transform:scale(1)
}
}
@keyframes scaleToggleThree { 0 {
transform:scale(1);
-webkit-transform:scale(1)
}
33% {
transform:scale(1);
-webkit-transform:scale(1)
}
66% {
transform:scale(2);
-webkit-transform:scale(2)
}
100% {
transform:scale(1);
-webkit-transform:scale(1)
}
}
.animated-circles{ position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 1;}
.animated-circles .circle { background: rgba(38,199,252,.25); width: 46px; height: 46px; border-radius: 50%; position: absolute; z-index: 49; transform: scale(1); -webkit-transform: scale(1) }
.animated-circles.animated .c-1 { animation: 2s scaleToggleOne cubic-bezier(.25, .46, .45, .94) forwards }
.animated-circles.animated .c-2 { animation: 2.5s scaleToggleTwo cubic-bezier(.25, .46, .45, .94) forwards }
.animated-circles.animated .c-3 { animation: 3s scaleToggleThree cubic-bezier(.25, .46, .45, .94) forwards }


.tan_downloadbox{width: 400px; display: none;}
.downewm_box{width: 100%; display: flex; flex-direction: column; padding: 15px; gap: 10px; box-sizing: border-box;}
.downewm_box .ewm{display: flex; align-items: center;}
.downewm_box .ewm>i{width: 77px;}
.downewm_box .ewm>p{display: flex; flex-direction: column; padding: 0 0 0 10px;}
.downewm_box .ewm>p span{font-size: 14px; color: #666;}
.downewm_box .ewm>p small{font-size: 12px; color: #999; line-height: 1.5; padding: 8px 0 0 0;}



/*foot_message*/
.foot_message{width: 100%; height: 100vh; background: url(../../images/xmsbg.png) no-repeat; background-size: 100% 100%;  display: flex; flex-direction: column;}
.foot_message .title{width: 100%; display: flex; align-items: center; padding: 20px 40px; box-sizing: border-box; flex-shrink: 0; position: relative;}
.foot_message .title>i{width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(0% 0% at 50% 50%, #16ACFD 0%, #1091FD 100%) !important; border: 1px solid #16ACFD; display: flex; align-items: center; justify-content: center;}
.foot_message .title>span{font-size: 18px; color: #222; padding: 0 0 0 10px;}
.foot_message .title .close{position: absolute; right: 30px; top: 30px; width: 12px; height: 12px; cursor: pointer; padding: 5px;}
.foot_message .title .close img{width: 100%;}
.foot_message .title .close:hover{    background: #fff; padding: 5px; border-radius: 50%; }

.foot_message .chat_box{width: 100%; padding: 0 20px 0 30px; box-sizing: border-box; display: flex; flex-direction: column; gap:25px;  overflow: auto; flex:1; min-width: 0;}
.foot_message .chat_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.foot_message .chat_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.foot_message .chat_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.foot_message .chat_left{width: 100%; display: flex; flex-wrap: wrap;}
.foot_message .chat_left .time{width: 100%; box-sizing: border-box; font-size: 12px; color: #666; padding: 0 0 6px 15px;}
.foot_message .chat_left>.content{background: #fff; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); display: flex; flex-direction: column;}
.foot_message .chat_left>.content>span{font-size: 14px; color: #222; line-height: 1.6}
.foot_message .chat_left>.content>span img{max-width: 80%;}
.foot_message .chat_left>.content>i{margin: 0 0 0 0; height: 100px;}
.foot_message .chat_left>.content>i img{height: 100%;}
.foot_message .chat_left>.content>h3{font-size:14px; color: #222; border-bottom: #EAECF3 1px solid; padding: 8px 0 12px 0; margin-bottom: 10px;}

.foot_message .chat_right{width: 100%;display: flex; justify-content: flex-end; flex-wrap: wrap;}
.foot_message .chat_right .time{width: 100%; box-sizing: border-box;font-size: 12px; color: #666; padding: 0 15px 6px 0; text-align: right;}
.foot_message .chat_right>.content{ background: #CEDEFF; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); display: flex; flex-direction: column;}
.foot_message .chat_right>.content>span{font-size: 14px; color: #222; line-height: 1.6}
.foot_message .chat_right>.content>i{margin: 0 0 0 0; height: 100px;}
.foot_message .chat_right>.content>i img{height: 100%;}
.foot_message .chat_right .chat_yinyong{justify-content: flex-end;}

.foot_message .faq_box{width: 100%; display: flex; flex-direction: column; gap:10px; padding: 15px 15px; box-sizing: border-box; background: linear-gradient( 180deg, #F0F2FF 0%, #F7F9FD 100%); border: 1px solid #fff; border-radius: 16px;}
.foot_message .faq_box>h2{font-size:14px; color: #222; padding: 6px 0;}
.foot_message .faq_box .list{width: 100%; display: flex; align-items: center; background: #fff; padding: 15px 20px; box-sizing: border-box; border-radius: 20px; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); cursor: pointer;}
.foot_message .faq_box .list>i{width: 16px; height: 16px;}
.foot_message .faq_box .list>i img{width: 100%;}
.foot_message .faq_box .list>span{font-size: 14px; color: #222; line-height: 1.6; padding: 0 0 0 6px;}
.foot_message .faq_box .list:hover{box-shadow: 0 2px 12px 0 rgba(0,0,0,.06);}
.foot_message .faq_box .list:hover span{color: #1673E8;}


.foot_message .chat_yinyong{width: 100%; display: flex;}
.foot_message .chat_yinyong>.content{background: #E8EBF6; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); display: flex; flex-direction: column; margin-top: 8px;}
.foot_message .chat_yinyong>.content>span{font-size: 14px; color: #666; line-height: 1.6; overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; display:-webkit-box; display:box;}
.foot_message .chat_yinyong>.content>i{margin: 0 0 0 0; height: 30px;}
.foot_message .chat_yinyong>.content>i img{height: 100%;}

.chat_input_box{width: 100%; padding: 20px 30px; box-sizing: border-box; flex-shrink: 0; display: flex; flex-wrap: wrap;}
.chat_option{width: 100%; display: flex; align-items: center; gap:10px;}
.chat_option .list{display: flex; align-items: center; background: #fff; padding: 8px 10px; border-radius: 60px; cursor: pointer;}
.chat_option .list i{width: 14px; height: 14px;}
.chat_option .list i img{width: 100%;}
.chat_option .list span{font-size: 14px; color: #333; padding: 0 0 0 5px;}
.chat_option .list:hover{box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .04);}
.chat_option .list:hover span{color: #1673e8}

.chat_input_box form{width: 100%;}
.chat_input{width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 10px 0 0 0;}
.chat_input .input{flex:1; min-width: 0; background: #FFFFFF; box-shadow: 0px 2px 10px 1px rgba(106,106,106,0.04); border-radius: 60px; border: 1px solid #E9F0FF; display: flex; align-items: center; width: 100%; padding: 2px 10px; box-sizing: border-box;}
.chat_input .input>input{border: none; font-size: 14px; color: #222;  flex-grow: 1; padding: 10px 10px 10px 0;}
.chat_input .input>a{background: linear-gradient(90deg, #16ADFD 0%, #0F8FFD 100%); border-radius: 60px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 6px 12px;}
.chat_input .input>a i{width: 17px;}
.chat_input .input>a i img{width: 100%;}

.chat_input .pic{background: #FFFFFF; box-shadow: 0px 2px 10px 1px rgba(106,106,106,0.04); border-radius: 60px;  border: 1px solid #E9F0FF; display: flex; align-items: center; padding: 10px; box-sizing: border-box; cursor: pointer; margin-left: 10px;}
.chat_input .pic img{width: 26px;}
.chat_input .pic:hover{background: #F6F7F9; box-shadow: 0px 2px 10px 1px rgba(106,106,106,0.06); font-size: 14px; color: #666;}


.chat_input_yinyong{background: #E8EBF6; border-radius: 20px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); margin: 2px 0 8px 0; position: relative;}
.chat_input_yinyong .yinyong{display: flex; flex-direction: column;}
.chat_input_yinyong .yinyong>span{ font-size: 14px; color: #666; line-height: 1.6; overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; display:-webkit-box; display:box;}
.chat_input_yinyong .yinyong>i{margin: 2px 0 0 0; height: 30px;}
.chat_input_yinyong .yinyong>i img{height: 100%;}
.chat_input_yinyong .close{position: absolute; right: -5px; top: -5px; width: 8px; height: 8px; cursor: pointer; padding: 5px; background: #fe4e53; border-radius: 50%;}
.chat_input_yinyong .close img{width: 100%;}
.chat_input_yinyong .close:hover{    background: #ff6469; padding: 5px; border-radius: 50%; }



.chat_left .ewm_box{width: 100%; display: flex; padding: 10px 0; gap: 20px;}
.chat_left .ewm{display: flex; align-items: center;}
.chat_left .ewm>i{width: 77px;}
.chat_left .ewm>p{display: flex; flex-direction: column; padding: 0 0 0 10px;}
.chat_left .ewm>p span{font-size: 14px; color: #666;}
.chat_left .ewm>p small{font-size: 12px; color: #999; line-height: 1.5; padding: 8px 0 0 0;}

#OpLimits_Menu {position: absolute; cursor: default; display: none; z-index: 99999;}
#OpLimits_Menu ul {background-color: #fff; border: 1px solid #E8EBF6; border-radius: 4px; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); display: flex; flex-direction: column; padding: 5px 3px;}
#OpLimits_Menu ul li{font-size: 14px; color: #222; padding: 5px 10px; cursor: pointer;}
#OpLimits_Menu ul li:hover{color: #1673E8;}


/*survey*/
.main_box{width: 100%; margin: 30px 0 0 0; box-sizing: border-box; min-width: 800px;}

.main_title{width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 10px 10px 10px; border-bottom: #ECECF0 1px solid; box-sizing: border-box; height: 45px;}
.main_title .title{display: flex; align-items: center; position: relative; gap:40px;}
.main_title .title a{font-size: 18px; color: #222; height: 20px; line-height: 20px; position: relative;}
.main_title .title a:hover{color: #1673E8;}
.main_title .title .hover{font-weight: bold; color: #1673E8; font-size: 20px;}

.main_title .title a span{display: inline-block; position: absolute; background: linear-gradient(90deg, #FF0037 0%, #F301A4 100%); top: -18px; right:-38px; border-radius: 60px 60px 60px 5px; font-size: 12px; color: #fff; padding: 0 6px; line-height: 18px; font-weight: bold;}
.main_title .title a em{display: inline-block; position: absolute; width: 8px; height: 8px; background: linear-gradient(90deg, #FF0037 0%, #F301A4 100%); top: -7px; right:-8px; border-radius: 50%;}
.main_title .title .regtask_tips{position: absolute; top: 0; right:-24px; cursor: pointer;}


.main_title .title .hover:after,.main_title .title a:hover:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 6px;
    background: linear-gradient( 90deg, #2090FF 0%, #F1F8FF 100%);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 3px;
    z-index: 100;
    bottom: -5px;    
    width: 62.5%
}
.main_title .jiansuobox{display: flex; align-items: center;}
.main_title .jiansuobox .jiansuo{display: flex; align-items: center; gap:10px;}
.main_title .jiansuobox .jiansuo a{font-size: 14px; color: #222; border: #ededed 1px solid; padding: 0 10px; height: 33px; line-height: 33px; border-radius: 4px;}
.main_title .jiansuobox .jiansuo .hover,.main_title .jiansuobox .jiansuo a:hover{color: #1673E8; border: #1673E8 1px solid;}

.atcker{width: auto; height: 30px; display: flex; align-items: center; background: #f3f3f3; border-radius: 4px; padding: 3px; margin-left: 10px;}
.atcker span{width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; opacity:.5;}
.atcker .hover{background: #fff; border-radius: 4px; opacity:1;}

.main_title_btn{background: linear-gradient(92deg, #ffab6b 1.15%, #fe8c37 123.37%); box-shadow: 0 10px 20px 0 rgba(254, 141, 56, .1); border-radius: 60px; text-align: center; font-size: 14px; color: #fff; height: 34px; line-height: 34px; padding: 0 16px; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.main_title_btn:hover{background: #fe8c37; color: #fff;}
.main_title_btn i{width: 14px; margin-right: 5px;}
.main_title_btn img{width: 100%;}



.survey_box{width: 100%; display: grid; justify-content: space-between;grid-gap: 24px; grid-template-columns: repeat(auto-fill, minmax(225px, 1fr)); padding: 20px 10px 40px 10px;  max-height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box;}
.survey_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.survey_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.survey_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.survey_box .survey_list{width: auto; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px; cursor: pointer; background: #fff;}
.survey_box .survey_pic{width: 100%; height: 120px; display: flex; position: relative;}
.survey_box .survey_pic .pic{width: 100%; height: 120px; overflow: hidden;     border-radius: 10px;}
.survey_box .survey_pic .pic img{display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; transition: transform .3s ease 0s; object-fit: cover;}
.survey_box .survey_pic .biao{position: absolute; top: 5px; left: 5px; padding: 4px 5px; background-color: rgba(0, 0, 0, .5); border-radius:20px;}

.survey_box .survey_zi{width: 100%; box-sizing: border-box; padding: 15px 5px 15px 10px; display: flex; flex-direction: column;}
.survey_box .survey_zi>small{width: 100%; font-size: 13px; color: #666;}
.survey_box .survey_zi>span{width: 100%; font-size: 16px; color: #222; padding: 8px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height: 1.3;}
.survey_box .survey_jf{width: 100%; display: flex; align-items: center;}
.survey_box .survey_jf>span{font-size:20px; color:#ff472e; margin-right:15px; display: flex; align-items: center;}
.survey_box .survey_jf>span>i{width: 20px; margin: 0 3px 0 0;}
.survey_box .survey_jf>span>i img{width: 100%;}
.survey_box .survey_jf>span>p{display: flex; align-items: baseline;}
.survey_box .survey_jf>span>p>b{font-size:22px; color:#ff472e;     font-weight: 500;  font-family: Din;}
.survey_box .survey_jf>span>p>em{font-size:14px; color: #FB5652; margin-left: 2px;}
.survey_box .survey_jf>small{font-size:14px; color:#666; display: flex; align-items: center;}
.survey_box .survey_jf>small>i{width: 20px; margin: 0 3px 0 0;}
.survey_box .survey_jf>small>i img{width: 100%;}

.survey_box .survey_list:hover{
    box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); border-radius: 10px;}
.survey_box .survey_list:hover .survey_pic .pic img{-ms-transform: scale(1.1); transform: scale(1.1); border-radius: 10px;}

.survey_box .survey_lqbtn{height: 38px; line-height: 38px; text-align: center; border-radius: 8px; color: #fff; font-size: 14px; margin: 12px 0 0 0; cursor: pointer;}
.survey_box .survey_lq .survey_pic{height: 70px;}
.survey_box .survey_lq .survey_pic .pic{height: 70px;}


/*survey_tablelist*/
.survey_tablelist{width: 100%; display: flex; flex-direction: column; padding: 10px 10px 20px 10px; height: calc(100vh - 142px); overflow: auto; box-sizing: border-box; min-width: 900px;}
.survey_tablelist::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.survey_tablelist::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.survey_tablelist::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}
.survey_tablelist .tb_head{ width: 100%; display: flex; align-items: center; border-bottom: #ECECF0 1px solid; position: sticky; top: -10px; z-index: 2; background: #fff; padding: 0 0 0 0;}
.survey_tablelist .tb_head span{color: #666; line-height: calc(100% + 8px); text-decoration: none; padding: 13px 0; padding-right: 8px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.survey_tablelist .tb_head .name{width: auto; flex: 1; min-width: 0;}
.survey_tablelist .tb_head .jifen{width: 180px; flex-shrink: 0;}
.survey_tablelist .tb_head .time{width: 150px; flex-shrink: 0;}
.survey_tablelist .tb_head .operate{width: 150px; flex-shrink: 0;}

.survey_tablelist .item_list{width: 100%; display: flex; align-items: center;  border-bottom: #ECECF0 1px solid; padding: 15px 0;}
.survey_tablelist .item_list:hover{background: #fbfbfb; cursor: pointer;}

.survey_tablelist .item_list .name{width: auto; flex: 1; min-width: 0; display: flex; align-items: center;}
.survey_tablelist .item_list .name i{width: 20px; flex-shrink: 0;}
.survey_tablelist .item_list .name i img{width: 100%;}
.survey_tablelist .item_list .name span{font-size: 16px; color: #222; padding: 0 5px; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.3;}
.survey_tablelist .item_list .name small{font-size: 13px; color: #666; flex-shrink: 0; padding: 0 10px 0 0;}

.survey_tablelist .item_list .jifen{width: 180px; flex-shrink: 0; font-size:20px; color:#ff472e; display: flex; align-items: center;}
.survey_tablelist .item_list .jifen>i{width: 20px; margin-right: 5px; flex-shrink: 0;}
.survey_tablelist .item_list .jifen>i img{width: 100%;}
.survey_tablelist .item_list .jifen>p{display: flex; align-items: baseline;}
.survey_tablelist .item_list .jifen>p>b{font-size:22px; color:#ff472e;     font-weight: 500;  font-family: Din;}
.survey_tablelist .item_list .jifen>p>em{font-size:14px; color: #FB5652; margin-left: 2px;}

.survey_tablelist .item_list .time{width: 150px; flex-shrink: 0; font-size:14px; color:#666; display: flex; align-items: center;}
.survey_tablelist .item_list .time>i{width: 20px; margin: 0 3px 0 0;}
.survey_tablelist .item_list .time>i img{width: 100%;}

.survey_tablelist .item_list .operate{width: 150px; flex-shrink: 0; display: flex; justify-content: flex-end; padding: 0 10px 0 0; box-sizing: border-box;}
.survey_tablelist .item_list .operate a{padding: 8px 20px; border-radius: 8px; border: #e3e3e3 1px solid; font-size: 14px; color: #666;}
.survey_tablelist .item_list .operate a:hover{border: #0086F6 1px solid; background: #0086F6; color: #fff; }



@keyframes enter-project-animation-c56c9ed0 {
    0% {
        transform: translateY(40px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}
.survey_tablelist .item_list:nth-child(-n+30) {animation: enter-project-animation-c56c9ed0 .4s linear; animation-fill-mode: forwards; opacity: 0;}
.survey_tablelist .item_list:nth-child(0) {
    animation-delay: 0s
}
.survey_tablelist .item_list:first-child {
    animation-delay: 20ms
}
.survey_tablelist .item_list:nth-child(2) {
    animation-delay: 40ms
}
.survey_tablelist .item_list:nth-child(3) {
    animation-delay: 60ms
}
.survey_tablelist .item_list:nth-child(4) {
    animation-delay: 80ms;
}
.survey_tablelist .item_list:nth-child(5) {
    animation-delay: .1s
}
.survey_tablelist .item_list:nth-child(6) {
    animation-delay: .12s
}
.survey_tablelist .item_list:nth-child(7) {
    animation-delay: .14s
}
.survey_tablelist .item_list:nth-child(8) {
    animation-delay: .16s
}
.survey_tablelist .item_list:nth-child(9) {
    animation-delay: .18s
}
.survey_tablelist .item_list:nth-child(10) {
    animation-delay: .2s
}
.survey_tablelist .item_list:nth-child(11) {
    animation-delay: .22s
}
.survey_tablelist .item_list:nth-child(12) {
    animation-delay: .24s
}
.survey_tablelist .item_list:nth-child(13) {
    animation-delay: .26s
}
.survey_tablelist .item_list:nth-child(14) {
    animation-delay: .28s
}
.survey_tablelist .item_list:nth-child(15) {
    animation-delay: .3s
}
.survey_tablelist .item_list:nth-child(16) {
    animation-delay: .32s
}
.survey_tablelist .item_list:nth-child(17) {
    animation-delay: .34s
}
.survey_tablelist .item_list:nth-child(18) {
    animation-delay: .36s
}
.survey_tablelist .item_list:nth-child(19) {
    animation-delay: .38s
}
.survey_tablelist .item_list:nth-child(20) {
    animation-delay: .4s
}
.survey_tablelist .item_list:nth-child(21) {
    animation-delay: .42s
}
.survey_tablelist .item_list:nth-child(22) {
    animation-delay: .44s
}
.survey_tablelist .item_list:nth-child(23) {
    animation-delay: .46s
}
.survey_tablelist .item_list:nth-child(24) {
    animation-delay: .48s
}
.survey_tablelist .item_list:nth-child(25) {
    animation-delay: .5s
}
.survey_tablelist .item_list:nth-child(26) {
    animation-delay: .52s
}
.survey_tablelist .item_list:nth-child(27) {
    animation-delay: .54s
}
.survey_tablelist .item_list:nth-child(28) {
    animation-delay: .56s
}
.survey_tablelist .item_list:nth-child(29) {
    animation-delay: .58s
}
.survey_tablelist .item_list:nth-child(30) {
    animation-delay: .6s
}

@keyframes enter-project-animation-c56c9ed1 {
    0% {
        transform: translateY(30px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}
.survey_box .survey_list:nth-child(-n+30) {animation: enter-project-animation-c56c9ed1 .4s linear; animation-fill-mode: forwards; opacity: 0;}
.survey_box .survey_list:nth-child(0) {
    animation-delay: 0s
}
.survey_box .survey_list:first-child {
    animation-delay: 20ms
}
.survey_box .survey_list:nth-child(2) {
    animation-delay: 40ms
}
.survey_box .survey_list:nth-child(3) {
    animation-delay: 60ms
}
.survey_box .survey_list:nth-child(4) {
    animation-delay: 80ms;
}
.survey_box .survey_list:nth-child(5) {
    animation-delay: .1s
}
.survey_box .survey_list:nth-child(6) {
    animation-delay: .12s
}
.survey_box .survey_list:nth-child(7) {
    animation-delay: .14s
}
.survey_box .survey_list:nth-child(8) {
    animation-delay: .16s
}
.survey_box .survey_list:nth-child(9) {
    animation-delay: .18s
}
.survey_box .survey_list:nth-child(10) {
    animation-delay: .2s
}
.survey_box .survey_list:nth-child(11) {
    animation-delay: .22s
}
.survey_box .survey_list:nth-child(12) {
    animation-delay: .24s
}
.survey_box .survey_list:nth-child(13) {
    animation-delay: .26s
}
.survey_box .survey_list:nth-child(14) {
    animation-delay: .28s
}
.survey_box .survey_list:nth-child(15) {
    animation-delay: .3s
}
.survey_box .survey_list:nth-child(16) {
    animation-delay: .32s
}
.survey_box .survey_list:nth-child(17) {
    animation-delay: .34s
}
.survey_box .survey_list:nth-child(18) {
    animation-delay: .36s
}
.survey_box .survey_list:nth-child(19) {
    animation-delay: .38s
}
.survey_box .survey_list:nth-child(20) {
    animation-delay: .4s
}
.survey_box .survey_list:nth-child(21) {
    animation-delay: .42s
}
.survey_box .survey_list:nth-child(22) {
    animation-delay: .44s
}
.survey_box .survey_list:nth-child(23) {
    animation-delay: .46s
}
.survey_box .survey_list:nth-child(24) {
    animation-delay: .48s
}
.survey_box .survey_list:nth-child(25) {
    animation-delay: .5s
}
.survey_box .survey_list:nth-child(26) {
    animation-delay: .52s
}
.survey_box .survey_list:nth-child(27) {
    animation-delay: .54s
}
.survey_box .survey_list:nth-child(28) {
    animation-delay: .56s
}
.survey_box .survey_list:nth-child(29) {
    animation-delay: .58s
}
.survey_box .survey_list:nth-child(30) {
    animation-delay: .6s
}



/*callback*/
.callback_tan_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.6); z-index:998; top: 0; left: 0;}

.callback_mainbox{ width:600px;padding: 0 0 0 0; box-sizing: border-box; max-height: 100vh; overflow: auto; overflow-x: hidden;}
.callback_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.callback_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #aaa;
}
.callback_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.callback_main{width:600px; border-radius: 8px;}

.callback_dui_bgbg{background: linear-gradient( 180deg, #EEF6FF 0%, #FFFFFF 25%);}
.callback_cuo_bgbg{background: linear-gradient( 180deg, #FFF3F1 0%, #FFFFFF 25%);}


.callback_content{width: 100%; position: relative; padding: 40px 0 0 0; z-index: 2;}
.callback_close{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: fixed; top: 15px; right: 15px; z-index: 33;}
.callback_close:hover{background: #F7F9FD; border-radius: 50%;}

.callback_duipic{width: 100%; display: flex; justify-content: center;}
.callback_duipic img{width: 140px;}

.callback_cuopic{width: 100%; display: flex; justify-content: center;}
.callback_cuopic img{width: 140px;}

.callback_jf{width: 100%;  padding: 10px 50px 0 50px; box-sizing: border-box; display: flex; justify-content: center; align-items: baseline;}
.callback_jf span{font-size: 30px; font-weight: bold; color: #222;}
.callback_jf small{font-size: 28px;  color: #ff472e; font-family: Din !important; padding: 0 0 0 5px;}
.callback_jf em{font-size: 20px; font-weight: bold; color: #ff472e; padding-left: 5px;}

.callback_zi{width: 100%; padding: 15px 50px 15px 50px; box-sizing: border-box; display: flex; flex-wrap: wrap;}
.callback_zi span{width: 100%; font-size: 24px; color: #222; font-weight: bold;}
.callback_zi small{width: 100%; font-size: 16px; color: #555; line-height: 1.6; text-align: center;}

.callback_btn{width: 100%; box-sizing: border-box; padding: 40px 50px 40px 50px; display: flex; align-items: center; justify-content: center; gap:30px;}
.callback_btn a{padding: 0 40px; height: 50px; line-height: 50px; display: flex; align-items: center; border-radius: 60px; font-size: 16px; position: relative; box-sizing: border-box;}
.callback_btn a i{height: 20px; margin-right: 8px;}
.callback_btn a i img{height: 100%;}
.callback_btn .btn2{border: #717171 2px solid; color: #666;}
.callback_btn .btn2:hover{border: #666  2px solid;}
.callback_btn em{position: absolute; top: -10px; right: -15px; background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 18px; line-height: 18px; padding: 0 6px;}

.callback_huaaa{width: 100%; position: absolute; z-index: 1; display: flex; justify-content: center;}
.confetti{width: 500px; height: 360px; display: block; margin: 0 auto; user-select: none; position: absolute; z-index: 1; top: -160px;}


.callback_nengliang{width: 440px;  margin: 0 auto; padding: 15px 20px; margin-top: 30px;}
.callback_nengliang .zi1{font-size: 16px; color: #333;}
.callback_nengliang .zi1 em{font-size: 16px;}

.callback_hb{width: 500px; background: #fff; border-radius: 8px; padding: 10px 20px; box-sizing: border-box; position: relative; margin: 15px 50px 0 50px; border: 1px solid #eee;}

.callback_hb .title{ font-size: 16px; color: #222; border-bottom: #ECECF0 1px solid; padding: 8px 0 12px 0; margin-bottom: 5px;}
.callback_hb .list{width: 100%;  border-bottom: #ECECF0 1px solid; padding: 15px 0 15px 0; display: flex; align-items: center;}
.callback_hb .list:last-child {border-bottom:none;}

.callback_hb .list i{width: 34px; flex-shrink: 0;}
.callback_hb .list i img{width: 100%;}
.callback_hb .list a{flex-shrink: 0; padding: 3px 10px; border-radius: 4px; background: #FD7C61; font-size: 14px; color: #fff;}
.callback_hb .list a:hover{background: #ff472e;}
.callback_hb .list .list_nr{flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 10px;}
.callback_hb .list .list_nr span{font-size: 16px; color: #222;}
.callback_hb .list .list_nr small{font-size: 12px; color: #999; padding: 3px 0 0 0;}


.shensu_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.6); z-index:990; top: 0; left: 0;}
.shensu_tishi_mainbox{width:600px; padding:30px 0 0 0; background: #fff;  -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); -box-shadow: 0 0 10px rgba(0,0,0,.4);}
.shensu_tishi_box{width: 500px; padding: 0 50px;}
.shensu_title{width: 100%; text-align: center; font-size: 18px; color: #333; padding: 5px 0 20px 0; font-weight: bold;}

.tishi_close{display:block; width:30px; height:40px; font-size:18px; position:absolute; right:12px; top:12px; font-family:Arial, Helvetica, sans-serif; color:#666; cursor:pointer; text-align:center;}
.tishi_close:hover{color:#ee504c;}

.shensu_xuanx{width: 100%; background: #fff; border: #E5E5E5 1px solid; border-radius: 4px; box-sizing: border-box; height: 45px; line-height: 45px; padding: 0 15px; font-size: 15px; color: #333; margin-bottom: 15px;}
.shensu_xuanx label{cursor: pointer; display: flex;  align-items:center;}
.shensu_xuanx label i{margin: 0 10px;}
.shensu_nr{width: 100%;}
.shensu_nr textarea{width: 100%; background: #fff; border: #E5E5E5 1px solid; border-radius: 4px; box-sizing: border-box; height: 90px; line-height: 20px; padding: 5px 10px; font-size: 14px; color: #666;}

.shensu_btn_box{width:100%; padding:40px 0; text-align:center;}
.shensu_btn1{display: inline-block; padding:0 80px; font-size:14px; background: linear-gradient(90deg, #16ADFD 0%, #0F8FFD 100%);box-shadow: 0px 6px 20px #CBE6FF; color: #fff; border-radius: 8px; height: 48px; line-height: 48px;}
.shensu_btn1:hover{color:#fff; background: #0F8FFD;}

.shensu_btn2{display: inline-block; padding:0 80px; font-size:14px; background: #e6e6e6; color: #fff; border-radius: 8px; height: 48px; line-height: 48px;}
.shensu_btn2:hover{color:#fff; background:#e6e6e6;}

.callback_points_activity{width: 500px; margin: 20px 50px 0 50px;}
.callback_points_activity .points_activity_time{width: auto; padding: 0;}
.callback_points_activity .points_activity_title{
    padding: 15px 15px 3px 15px;}
.callback_points_activity .points_activity_jf{
    padding: 0 15px 10px 15px;}

/*game*/
.game_mainbox{width: 100%; display: grid; justify-content: space-between;grid-gap: 24px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); padding: 20px 10px 40px 10px;  max-height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box;}
.game_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.game_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.game_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.game_list_box{background: #fff; border: 1px solid #eee;     box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); padding: 10px; border-radius: 8px; transition: all .3s; cursor: pointer; display: flex; align-items: center; box-sizing: border-box;}
.game_list_box:hover{box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); transition: all .3s;}

.game_list_box dt{width: 90px; flex-shrink:0; padding: 0 14px 0 0; position: relative;}
.game_list_box dt i{position: absolute; top: 5px; left: 5px; padding: 3px 6px; background-color: rgba(0, 0, 0, .5); border-radius:20px;}
.game_list_box dd{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; flex: 1; min-width: 0;}
.game_title{width: 100%; font-size: 16px; color: #222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3;}
.game_xx{width: 100%; font-size: 14px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 10px 0; line-height: 1.3;}
.game_pic{border-radius: 8px;}

.game_jf{display: flex; align-items: baseline;}
.game_jf span{font-size: 22px; color: #ff472e; font-family: Din !important;}
.game_jf small{font-size: 14px; color: #ff472e; padding: 0 0 0 3px;}

.game_lingbtn{padding: 6px 12px; border-radius: 60px; font-size: 12px;}


.game_tanmainbox{width: 750px; background: #fff; position: fixed; z-index: 999; box-sizing: border-box; border-radius: 8px; top: 0; left: 50%; margin-left: -375px;}
.game_tanbox{width: 100%;  padding:0; box-sizing: border-box; border-radius: 8px; display: flex;}

.game_tan_close{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: absolute; top: 15px; right: 15px; z-index: 33;}
.game_tan_close:hover{background: #F7F9FD; border-radius: 50%;}

.gamets_left{width: 380px;}
.gamets_left img{border-radius: 8px 0 0 8px;}
.gamets_right{width: 370px; text-align: center; position: absolute; right: 30px; top: 70px;}
.gamets_right h2{display: block; font-size: 28px; font-weight: bold; color: #333; text-align: center;}
.gamets_right h2 em{font-size: 28px; color: #ff7b4d; font-weight: bold;}
.gamets_right h3{display: block; font-size: 14px; color: #666; line-height: 1.5; text-align: center; margin: 10px 0 20px 0; font-weight: 400;}
.gamets_ewm {width: 100%; padding:5px; text-align: center; box-sizing: border-box;}
.gamets_ewm span {display: inline-block; width: 100%;}
.gamets_ewm span img{display: inline-block;}
.gamets_ewm small {display: inline-block; width: 100%; text-align: center; color: #666; font-size: 14px; padding-top:10px;}




@keyframes enter-project-animation-c56c9ed1 {
    0% {
        transform: translateY(30px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}
.game_mainbox .game_list_box:nth-child(-n+30) {animation: enter-project-animation-c56c9ed1 .4s linear; animation-fill-mode: forwards; opacity: 0;}
.game_mainbox .game_list_box:nth-child(0) {
    animation-delay: 0s
}
.game_mainbox .game_list_box:first-child {
    animation-delay: 20ms
}
.game_mainbox .game_list_box:nth-child(2) {
    animation-delay: 40ms
}
.game_mainbox .game_list_box:nth-child(3) {
    animation-delay: 60ms
}
.game_mainbox .game_list_box:nth-child(4) {
    animation-delay: 80ms;
}
.game_mainbox .game_list_box:nth-child(5) {
    animation-delay: .1s
}
.game_mainbox .game_list_box:nth-child(6) {
    animation-delay: .12s
}
.game_mainbox .game_list_box:nth-child(7) {
    animation-delay: .14s
}
.game_mainbox .game_list_box:nth-child(8) {
    animation-delay: .16s
}
.game_mainbox .game_list_box:nth-child(9) {
    animation-delay: .18s
}
.game_mainbox .game_list_box:nth-child(10) {
    animation-delay: .2s
}
.game_mainbox .game_list_box:nth-child(11) {
    animation-delay: .22s
}
.game_mainbox .game_list_box:nth-child(12) {
    animation-delay: .24s
}
.game_mainbox .game_list_box:nth-child(13) {
    animation-delay: .26s
}
.game_mainbox .game_list_box:nth-child(14) {
    animation-delay: .28s
}
.game_mainbox .game_list_box:nth-child(15) {
    animation-delay: .3s
}
.game_mainbox .game_list_box:nth-child(16) {
    animation-delay: .32s
}
.game_mainbox .game_list_box:nth-child(17) {
    animation-delay: .34s
}
.game_mainbox .game_list_box:nth-child(18) {
    animation-delay: .36s
}
.game_mainbox .game_list_box:nth-child(19) {
    animation-delay: .38s
}
.game_mainbox .game_list_box:nth-child(20) {
    animation-delay: .4s
}
.game_mainbox .game_list_box:nth-child(21) {
    animation-delay: .42s
}
.game_mainbox .game_list_box:nth-child(22) {
    animation-delay: .44s
}
.game_mainbox .game_list_box:nth-child(23) {
    animation-delay: .46s
}
.game_mainbox .game_list_box:nth-child(24) {
    animation-delay: .48s
}
.game_mainbox .game_list_box:nth-child(25) {
    animation-delay: .5s
}
.game_mainbox .game_list_box:nth-child(26) {
    animation-delay: .52s
}
.game_mainbox .game_list_box:nth-child(27) {
    animation-delay: .54s
}
.game_mainbox .game_list_box:nth-child(28) {
    animation-delay: .56s
}
.game_mainbox .game_list_box:nth-child(29) {
    animation-delay: .58s
}
.game_mainbox .game_list_box:nth-child(30) {
    animation-delay: .6s
}

/*vote*/
.vote_guanggao{width: 100%; height: 120px; background: #eaefeb; border-radius: 8px; position: relative;}
.vote_guanggao img{width: 100%; height: 100%;  border-radius: 8px; object-fit: cover; object-position: center top;}
.vote_guanggao>span{position: absolute; top: 10px; right: 10px; font-size: 12px; color: #fff; padding: 2px 5px; border-radius: 4px; border: 1px solid #fff;}



.voten_list_box{width: 100%; padding: 0 10px 10px 0; max-height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box;}
.voten_list_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.voten_list_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.voten_list_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.voten_height1{max-height: calc(100vh - 160px);}

.voten_list{width: 100%; border-bottom:#edf1f6 1px solid; padding: 30px 0 10px 0;}
.voten_list_name{width: 100%; display: flex; align-items: center; justify-content: space-between;}
.voten_list_name a{display: flex; align-items: center;}
.voten_list_name i{width: 20px; height: 20px; margin-right: 6px;}
.voten_list_name i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.voten_list_name span{font-size: 12px; color: #666;}
.voten_list_name small{margin-left: 5px;}

.voten_list_zd{background:url(../../images/vote/voten_zd3.png) no-repeat 7px 3px #fff2e5; text-indent: 20px; color: #ff7544; margin: 0 10px 0 0; padding: 2px 5px; border-radius: 4px;}


.voten_list_title{width: 100%; padding: 10px 0 15px 0;}
.voten_list_title em{font-size: 12px; color: #fff; font-weight: bold; padding: 0 2px; border-radius: 2px; width: 28px; height: 16px; line-height: 16px; display: inline-block; text-align: center;}
.voten_list_title span{font-size: 16px; color: #222; line-height: 1.6;}
.voten_list_title a{font-size: 16px; color: #222; line-height: 1.6;}
.voten_list_title a:hover{font-size: 16px; color: #333; line-height: 1.6;}
.voten_list_title .voten_b2{background: linear-gradient(90deg, #4daaff .25%, #2f9cff 100%, #559dfd 0); font-style: italic;}
.voten_list_title .voten_b1{background: linear-gradient(90deg, #ff6c79 .25%, #ff8e96 100%, #ff7767 0); width: 22px; font-style: italic;}

.voten_content{width: 600px; background: #f6f6f6; border-radius: 2px; padding: 15px; box-sizing: border-box;}
.voten_option{width: 100%; display: flex; flex-wrap:wrap; position: relative; }
.voten_option li{width: 100%; background: #fff;  border:1px #e9e9e9 solid; border-radius: 2px; text-align: center; font-size: 14px; color: #333; padding: 8px 0; line-height: 1.6; margin: 5px 0; cursor: pointer;}
.voten_option .voten_option_hover,.voten_option li:hover{background: #fff;  border:1px #ffc88f solid;}

.voten_option_zdbox{height: 226px; overflow: hidden;}
.voten_option_zhedie{position: absolute; bottom: 0; text-align: center; width: 100%; height: 202px; z-index: 1;}
.voten_option_zhedie span{position: absolute; left: 0; right: 0; bottom: 0; height: 202px; z-index: 1; cursor: pointer;}
.voten_option_zhedie i{pointer-events: none; position: absolute; left: 0; right: 0; bottom: -6px; height: 100px; z-index: 2;background-image: linear-gradient(180deg,hsla(0,0%,97.6%,0),#f6f6f6 72%);}
.voten_option_zhedie2{position: absolute; bottom: 0; text-align: center; width: 100%; z-index: 90;}
.voten_option_zhedie2_zi1{position: absolute; z-index: 3; bottom: 0; left: 42%; font-size: 13px; color: #999;}
.voten_option_zhedie2_zi1:after {
  display: inline-block;
    content: "";
    margin-left: 5px;
    margin-bottom: 2px;
    width: 5px;
    height: 5px;
    border-left: 1px solid #939393;
    border-bottom: 1px solid #939393;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.voten_option_zhedie2_zi2{position: absolute; z-index: 3; bottom: -23px; left: 46%; font-size: 13px; color: #999; display: flex; align-items: center;}
.voten_option_zhedie2_zi2:after {
  display: inline-block;
    content: "";
    margin-left: 5px;
    margin-bottom: 2px;
    width: 5px;
    height: 5px;
    border-left: 1px solid #939393;
    border-bottom: 1px solid #939393;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    margin-top: 5px;
}

.voten_option_zhong{width: 100%; display: flex; flex-wrap:wrap;}
.voten_option_zhong li{width: 100%; background: #fff; border:1px #e9e9e9 solid; border-radius: 2px; display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; line-height: 1.6; margin: 5px 0; position: relative; cursor: auto;}
.voten_option_zhong li:hover{background: #fff;  border:1px #e9e9e9 solid;}
.voten_option_zhong li span{font-size: 14px; color: #666; position: relative; z-index: 10;}
.voten_option_zhong li small{font-size: 12px; color: #999; position: relative; z-index: 10;}
.voten_option_zhong li div{width: 0;  position: absolute; bottom: 0; left: 0; top: 0; transition: all .3s; background:#f2f2f2;}

.voten_option_zhong  .voten_option_zhong_hover span{color: #ff7900; align-items: center; display: flex; background:url(../../images/vote/voten_dui.png) no-repeat right; padding: 0 18px 0 0;}
.voten_option_zhong  .voten_option_zhong_hover div{background:#fff7f3;}


.voten_tip{width: 100%; padding: 0 5px; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box;}
.voten_tip span{font-size: 12px; color: #888;}
.voten_tip em{font-size: 12px; color: #999; padding: 5px 0 0 0;}
.voten_tip small{font-size: 12px; color: #999; padding: 5px 18px 0 0; background: url(../../images/vote/join.png) no-repeat right 6px; background-size: 13px;}

.voten_btn{background:#f6953e; font-size:12px; color:#fff; padding:0 20px; line-height: 28px; border-radius: 30px; position: absolute; bottom: -30px; left: 50%; margin-left: -50px; z-index: 100;}
.voten_btn:hover{color:#fff; background:#ffa05e;}

.voten_pktip{width: 600px; padding: 10px 5px 0 5px; display: flex; justify-content: space-between;     align-items: center; box-sizing: border-box; position: relative;}
.voten_pktip em{font-size: 12px; color: #999; padding: 5px 0 0 0;}
.voten_pktip small{font-size: 12px; color: #999; padding: 5px 18px 0 0; background: url(../../images/vote/join.png) no-repeat right 6px; background-size: 13px;}

.voten_foot{width: 100%; display: flex; padding: 20px 0 15px 0;}
.voten_foot a{display: flex; align-items: center; margin-right: 40px; font-size: 13px; color: #808080; min-width: 16px; height: 18px;}
.voten_foot a:hover{color: #ff7544;}
.voten_foot_pingl{background:url(../../images/vote/voten_pl1.jpg) no-repeat 0 0; text-indent: 18px;}
.voten_foot_pingl:hover{background:url(../../images/vote/voten_pl2.jpg) no-repeat 0 0; text-indent: 18px;}
.voten_foot_zan{background:url(../../images/vote/voten_zan1.jpg) no-repeat 0 1px; text-indent: 20px;}
.voten_foot_zan:hover{background:url(../../images/vote/voten_zan2.jpg) no-repeat 0 1px; text-indent: 20px;}
.voten_foot_fen{background:url(../../images/vote/voten_fen1.jpg) no-repeat 0 1px; text-indent: 21px;}
.voten_foot_fen:hover{background:url(../../images/vote/voten_fen2.jpg) no-repeat 0 1px; text-indent: 21px;}

.voten_foot_zd{background:url(../../images/vote/voten_zd1.jpg) no-repeat 0 1px; text-indent: 20px;}
.voten_foot .voten_foot_zd_hover,.voten_foot_zd:hover{background:url(../../images/vote/voten_zd2.jpg) no-repeat 0 1px; text-indent: 20px; color: #ff7544;}

.voten_foot .voten_foot_zan_hover{background:url(../../images/vote/voten_zan3.jpg) no-repeat 0 1px; text-indent: 20px; color: #ff7544;}

.voten_pk_box{width: 600px;}
.voten_pk{width: 600px; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box;}
.voten_pk_nr{position: relative; display: flex; min-width: 120px; align-items: center; justify-content: space-between; height: 60px; width: 50%; cursor: pointer;}

.voten_pk_left{text-align: center; margin-right: 26px; padding-left: 10px; border-radius: 6px 0 0 6px; background: linear-gradient(90deg, #ff555f, #ff6b81 96.18%); transition: width .3s ease;
}
.voten_pk_left:hover{background: #ff6b81;}
.voten_pk_right{flex-direction: row-reverse; text-align: center; padding-right: 10px; border-radius: 0 6px 6px 0; background: linear-gradient(270deg, #4f9aff, #74baff 96.18%); transition: width .3s ease;}
.voten_pk_right:hover{background: #74baff;}

.voten_pk_biao{flex: 0 0 auto;height: 30px; margin: 0 25px 0 0; width: 40px;}
.voten_pk_biao img{width: 100%;}

.option-skew {position: absolute; top: 0px; height: 100%; width: 25px; overflow: hidden; pointer-events: none;}
.option-skew-fill {pointer-events: all; position: absolute; top: 0px; width: 100%; height: 100%;}

.voten_pk_left .option-skew{right: -25px;}
.voten_pk_left .option-skew-fill{left: -11px; background-color: rgb(255 107 129); transform: skew(21deg); border-top-right-radius: calc(6px - 2px); border-bottom-right-radius: 6px;}

.voten_pk_right .option-skew{left: -25px;}
.voten_pk_right .option-skew-fill{left: 11px; background-color: rgb(115 186 255); transform: skew(21deg); border-top-left-radius: 6px; border-bottom-left-radius: calc(6px - 2px);}

.pktxt_info{min-width: 36px; position: absolute;top: 50%; transform: translateY(-50%); width: calc(100% - 20px);}
.pktxt_bfh{font-size: 14px; color: #fff; font-weight: 600; line-height: 18px; padding: 0 0 3px 0; align-items: center; display: flex;}

.pktxt_zi{font-size: 15px; color: #fff; line-height: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600;}

.voten_pk_zhong .pktxt_zi{text-align: left!important; font-weight: 400;}

.voten_pk_zhong .voten_pk_right .pktxt_bfh{justify-content:flex-end;}
.voten_pk_zhong .voten_pk_right .pktxt_zi{text-align: right!important;}
.voten_pk_zhong .voten_pk_right .pktxt_bfh i{padding: 0 5px 0 0;}

.voten_pk_bfb100_red{width: 100%; text-align: center; padding-left: 10px; border-radius: 6px; background: linear-gradient(90deg, #ff555f, #ff6b81 96.18%); transition: width .3s ease;}
.voten_pk_bfb100_blue{width: 100%; flex-direction: row-reverse; text-align: center; padding-right: 10px; border-radius: 6px; background: linear-gradient(270deg, #4f9aff, #74baff 96.18%); transition: width .3s ease;}
.voten_pk_zhong .voten_pk_bfb100_blue .pktxt_bfh{justify-content:flex-end;}
.voten_pk_zhong .voten_pk_bfb100_blue .pktxt_zi{text-align: right!important;}
.voten_pk_zhong .voten_pk_bfb100_blue .pktxt_bfh i{padding: 0 5px 0 0;}

.voten_right_guang{width: 320px; background: #fff; border: #e9e9e9 1px solid; border-radius: 4px; margin-bottom: 15px; padding: 20px; box-sizing: border-box;}
.voten_right_guang a{display: block; width: 100%; margin-top: 15px;}
.voten_right_guang a img{border-radius: 6px;}

.voten_right_mexx{width: 320px; background: #fff; border: #e9e9e9 1px solid; border-radius: 4px; box-sizing: border-box; margin-bottom: 15px; }

.voten_right_mexx_tou{width: 100%; display: flex; align-items: center; padding: 20px; box-sizing: border-box; position: relative; z-index: 1;}
.voten_right_mexx_toudi{background-position: 50%;  background-repeat: repeat; background-size: cover; -webkit-filter: blur(8px); filter: blur(8px);
    overflow: hidden; width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-sizing: border-box; border-radius: 4px 4px 0 0;
}
.voten_right_mexx_bgbg{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, .3); box-sizing: border-box; border-radius: 4px 4px 0 0;}
.voten_right_mexx_tou i{width: 60px; height: 60px; margin-right: 15px; flex-shrink: 0; z-index: 2;}
.voten_right_mexx_tou i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.voten_right_mexx_namebox{width: 100%; z-index: 2;}
.voten_right_mexx_name{display: flex; align-items: center;}
.voten_right_mexx_name span{font-size: 16px; color: #fff; font-weight: bold;}
.voten_right_mexx_name small{margin-left: 5px;}
.voten_right_mexx_namebox em{display: block; font-size: 14px; color: hsla(0, 0%, 100%, .7); padding: 5px 0 0 0;}
.voten_right_mexx_ull{display: flex; justify-content: space-between; padding: 20px 25px; width: 100%; box-sizing: border-box;}
.voten_right_mexx_ull li{color:#666; text-align:center; font-size: 13px;}
.voten_right_mexx_ull li strong{font-size:18px; color:#333; display:block; width:100%;}


.voten_my_list{padding: 15px 0 10px 0;}
.voten_pk_my{padding: 0 0 15px 0;}
.voten_my_can{width: 100%; display: flex; align-content: center;}
.voten_my_can span{display: inline-block; font-size: 12px; color: #fff; margin-right: 10px; border-radius: 2px; padding: 0 5px;}
.voten_my_can small{display: inline-block; font-size: 12px; color: #999; margin-right: 10px;}
.voten_my_can em{font-size: 12px; color: #999; padding: 0 18px 0 0; background: url(../../images/vote/join.png) no-repeat right 1px; background-size: 13px; margin: 0 0 0 30px;}

.my_lv{background: #2dbe79;}
.my_red{background: #f96376;}

.voteinfo_new_title{width:100%; padding: 0 10px 0 0; height:45px; margin:  0; border-bottom:#edf1f6 1px solid; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box;}
.voteinfo_fanhui{font-size: 14px; color: #333; background:url(../../images/vote/voten_fanhui.png) no-repeat 8px 5px #f7f8f9; text-indent: 15px; border-radius: 2px; height: 28px; line-height: 28px; margin-right: 12px;  min-width: 24px;  padding:0 10px; transition: all .3s;}
.voteinfo_fen{width: 16px; height: 16px; background:url(../../images/vote/voten_fen3.png) no-repeat 5px 5px; padding: 5px;}
.voteinfo_fen:hover{background:url(../../images/vote/voten_fen3.png) no-repeat 5px 5px #f7f8f9; padding: 5px; border-radius: 2px;}

.voteinfo_nr{width: 100%; border-bottom: #fafbfc 3px solid; padding: 20px 0 30px 0;}
.voteinfo_name{width: 100%; display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;}
.voteinfo_name_nr{width: 400px; display: flex; align-items: center;}
.voteinfo_name_nr a{width: auto; display: flex; align-items: center;}
.voteinfo_name_nr i{width: 40px; height: 40px; margin-right: 6px;}
.voteinfo_name_nr i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.voteinfo_name_nr span{font-size: 14px; color: #333;}
.voteinfo_name_nr small{margin-left: 5px;}
.voteinfo_name_hya{font-size: 12px; color: #f6953e; border-radius: 60px; border:1px solid #f6953e; padding: 4px 12px; margin-right: 10px;}
.voteinfo_name_hya:hover{border:1px solid #f6953e; background: #f6953e; color: #fff;}

.voteinfo_pl_box{width: 100%; position: relative;}
.voteinfo_pl_title{width: 100%; margin: 30px 0 10px 0;     border-bottom: #edf1f6 1px solid; display: flex; align-items: center; height: 30px;}
.voteinfo_pl_title span{font-size: 14px; color: #14191e; border-bottom: #666 2px solid; padding: 0 2px 0 2px; margin: 0 8px 0 0; height: 30px;}
.voteinfo_pl_title small{font-size: 12px; color: #14191e; height: 30px;}
.voteinfo_pl_nr{width: 100%; min-height: 20px;}
.voteinfo_pl_list{width: 100%; padding: 20px 0; border-bottom: #edf1f6 1px solid;}
.voteinfo_pl_list:last-child{border-bottom:none;}
.voteinfo_pl_tou{width: 100%; display: flex; align-items: center;}
.voteinfo_pl_tou i{width: 34px; height: 34px; margin-right: 10px; flex-shrink: 0;}
.voteinfo_pl_tou i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.voteinfo_pl_namebox{width: 100%;}
.voteinfo_pl_name{display: flex; align-items: center; padding: 0 0 5px 0;}
.voteinfo_pl_name span{font-size: 13px; color: #333; font-weight: bold;}
.voteinfo_pl_name small{margin-left: 5px;}
.voteinfo_pl_namebox em{font-size: 12px; color: #999;}
.voteinfo_pl_txt{font-size: 15px; color: #222; line-height: 1.6; padding: 8px 10px 0 44px;}
.voteinfo_pl_zan{flex-shrink: 0; display: flex; margin-right: 10px;}
.pl_zan{display: block; width: auto; height: 17px; line-height: 17px; background:url(../../images/vote/voten_pl_zan1.png) no-repeat; background-size: 17px; font-size: 12px; color: #999; text-indent: 20px; cursor: pointer; min-width: 17px; margin-right: 10px;}
.pl_zan_hover,.pl_zan:hover{display: block; width: auto; height: 17px; line-height: 17px; background:url(../../images/vote/voten_pl_zan2.png) no-repeat; background-size: 17px; font-size: 12px; color: #333; text-indent: 20px; cursor: pointer; min-width: 17px; margin-right: 10px;}
.pl_del{display: block; width: auto; height: 17px; line-height: 17px; background:url(../../images/vote/voten_pl_del1.png) no-repeat; background-size: 17px; font-size: 12px; color: #777; text-indent: 18px; cursor: pointer; min-width: 17px; margin-right: 10px;}
.pl_del:hover{background:url(../../images/vote/voten_pl_del2.png) no-repeat; background-size: 17px; color: #F94051;}


.voteinfo_pl_pk_nr{width: 100%; display: flex; flex-wrap:wrap; }
.voteinfo_pl_pk{width: 100%; padding: 20px; border-radius: 8px; box-sizing: border-box; margin: 0 0 16px 0;}
.voteinfo_pl_tou_pk{width: 100%; display: flex; align-items: center;}
.voteinfo_pl_tou_pk i{width: 34px; height: 34px; margin-right: 10px; flex-shrink: 0;}
.voteinfo_pl_tou_pk i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.voteinfo_pl_namebox_pk{width: 100%;}
.voteinfo_pl_name_pk{display: flex; align-items: center;}
.voteinfo_pl_name_pk span{font-size: 13px; color: #333; font-weight: bold;}
.voteinfo_pl_name_pk small{margin-left: 5px;}
.voteinfo_pl_namebox_pk em{font-size: 12px; color: #999;}
.voteinfo_pl_txt_pk{font-size: 15px; color: #222; line-height: 1.6; padding: 8px 0 0 0;}
.voteinfo_pl_zan_pk{width: 100%; display: flex;  align-items: center; padding: 15px 0 0 0;}
.pl_zan_pk1{display: block; width: auto; height: 18px; background:url(../../images/vote/voten_pl_zan3.png) no-repeat; background-size: 15px; font-size: 12px; color: #999; text-indent: 18px; cursor: pointer; margin-right: 15px; min-width: 15px;}
.pl_zan_pk1_hover,.pl_zan_pk1:hover{display: block; width: auto; height: 18px; background:url(../../images/vote/voten_pl_zan4.png) no-repeat; background-size: 15px; font-size: 12px; color: #333; text-indent: 18px; cursor: pointer; margin-right: 15px; min-width: 15px;}
.pl_zan_pk2{display: block; width: auto; height: 18px; background:url(../../images/vote/voten_pl_zan5.png) no-repeat; background-size: 15px; font-size: 12px; color: #999; text-indent: 20px; cursor: pointer; margin-right: 15px; min-width: 15px;}
.pl_zan_pk2_hover,.pl_zan_pk2:hover{display: block; width: auto; height: 18px; background:url(../../images/vote/voten_pl_zan6.png) no-repeat; background-size: 15px; font-size: 12px; color: #333; text-indent: 20px; cursor: pointer; margin-right: 15px; min-width: 15px;}

.pl_cai{display: block; width: auto; height: 17px; background:url(../../images/vote/voten_pl_cai1.png) no-repeat; background-size: 17px; font-size: 12px; color: #999; text-indent: 20px; cursor: pointer; min-width: 17px; margin-right: 10px;}
.pl_cai_hover,.pl_cai:hover{display: block; width: auto; height: 17px; background:url(../../images/vote/voten_pl_cai2.png) no-repeat; background-size: 17px; font-size: 12px; color: #333; text-indent: 20px; cursor: pointer; min-width: 17px; margin-right: 10px;}


.voteinfo_pl_pk_red_box{width: 46%; margin: 10px 20px 20px 0;}
.voteinfo_pl_pk_blue_box{width: 46%; margin: 10px 0 20px 0; }
.voteinfo_pl_pk_blue{background: #EBF2FE;}
.voteinfo_pl_pk_red{background: #FEF2F6;}

.voteinfo_pl_pk_red_kong{border-radius: 4px; border: 1px dashed #F9596B; background: rgba(254,242,246,0.6); padding: 36px 20px;}
.voteinfo_pl_pk_red_kong .kong_img{width: 36px; margin: 0 auto;}
.voteinfo_pl_pk_red_kong .kong_img img{width: 100%;}
.voteinfo_pl_pk_red_kong .kong_zi{width: 100%; text-align: center; font-size: 14px; color: #999; padding: 10px 0 0 0;}

.voteinfo_pl_pk_blue_kong{border-radius: 4px; border: 1px dashed #2C9DFA; background: rgba(235,242,254,0.6); padding: 36px 20px;}
.voteinfo_pl_pk_blue_kong .kong_img{width: 36px; margin: 0 auto;}
.voteinfo_pl_pk_blue_kong .kong_img img{width: 100%;}
.voteinfo_pl_pk_blue_kong .kong_zi{width: 100%; text-align: center; font-size: 14px; color: #999; padding: 10px 0 0 0;}

.pinglun_reply_box{width: 100%; border-top: #edf1f6 1px solid; display: flex; align-items: center; padding: 8px 6px 8px 0; background: #fff; box-sizing: border-box; position: sticky; bottom: 0; z-index: 999;}
.pinglun_reply_input{width: 100%; background: #F5F6FA; min-height: 40px; border:none; line-height: 1.5; padding: 9px 6px; box-sizing: border-box; font-size: 14px; color: #333; outline: none;}

.voteinfo_pl_btn{padding: 9px 15px; font-size: 14px; background: #328edc; color: #FFF;     text-decoration: none; border-radius: 4px;     flex-shrink: 0; margin: 0 10px; transition: width .3s ease;}
.voteinfo_pl_btn:hover{background:#1f7fd1; color:#fff;}

.pinglun_reply_zan{display: flex;}
.pl_zan_reply1{display: block; width: auto;     padding: 22px 10px 0 10px; background:url(../../images/vote/voten_pl_zan7.png) no-repeat center 0; background-size: 21px; font-size: 12px; color: #999; cursor: pointer;}
.pl_zan_reply2{display: block; width: auto;     padding: 22px 10px 0 10px; background:url(../../images/vote/voten_pl_fen.png) no-repeat center 0; background-size: 22px; font-size: 12px; color: #999; cursor: pointer;}



.voten_tan_content{width: 750px; background: #fff; display: flex; flex-direction: column; height: 100%;}
.voten_tan_content form{display: flex; flex-direction: column; height: 100vh;}
.voten_tan_mainbox{width: 750px; padding: 20px 20px 0 20px; overflow: auto; flex: 1; min-width: 0; box-sizing: border-box;}
.voten_tan_main_height{height: 587px; padding: 0 20px 20px 20px;}
.voten_tan_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.voten_tan_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.voten_tan_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.tjfs_box{width:100%; padding: 10px 0 0 0; display: flex; flex-direction: column;}
.tjfs_box h1{font-size:14px; color:#569dd8; width:100%;  padding:15px 0 5px 0;}
.fs_ipt1{width:98%; line-height:22px; color:#999; height:60px; border:#ebebeb 1px solid; padding:5px 1% 0 1%; box-shadow: 0 3px 10px rgba(239,239,239,0.9);}

.tjfs_box h2{font-size:14px; color:#569dd8; width:100%; padding:15px 0;}

.tjfs_box h3{width:100%; padding:15px 0 0 0; display: flex;}
.tjfs_box h3 a{background: linear-gradient(92deg, #ffab6b 1.15%, #fe8c37 123.37%); font-size:14px; color:#fff; padding:6px 20px; border-radius: 4px;}
.tjfs_box h3 a:hover{color:#fff; background:#fe8c37;}
.tjfs_box h3 span{float:left; font-size:14px; color:#999; padding:5px 0 0 15px;}

.loadmorefri{cursor: pointer;}
.loadmorefri span{display: inline-block; font-size: 12px; color: #569dd8; height: 30px; line-height: 30px; cursor: pointer;}
.loadmorefri span:after {
  display: inline-block;
    content: "";
    margin-left: 5px;
    margin-bottom: 2px;
    width: 5px;
    height: 5px;
    border-left: 1px solid #569dd8;
    border-bottom: 1px solid #569dd8;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.loadmorefri span:hover{text-decoration: underline; color: #1d85db;}


.yqfs_ul{width:100%; padding-top:10px; display: flex; align-items: center; gap:20px;}
.yqfs_ul li{min-width:70px; text-align:center; display: flex; align-items: center; justify-content: center;}
.yqfs_ul li a{color:#333; line-height:28px; display: flex; flex-direction: column; align-items: center;}
.yqfs_ul li a:hover{color:#ff472e;}

.invite_tanhaoyou{width: 100%; border: #ebebeb 1px solid; height: 180px; min-height: 60px; overflow: auto; border-radius: 3px;}
.invite_tanhaoyou form{display: flex; flex-direction: column; height: auto!important;}
.invite_tanhaoyou::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.invite_tanhaoyou::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.invite_tanhaoyou::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.surveyshare_tip{width:100%; float:left; padding: 10px 20px; margin-top: 30px; font-size: 14px; color: #666; line-height: 1.5; background: #f4f5f7; border: #ebebeb 1px solid; box-shadow: 0 3px 10px rgba(239, 239, 239, 0.9); border-radius: 3px; box-sizing: border-box;}
.surveyshare_tip em{display: inline-block; font-size: 14px; color: #ff472e; font-weight: bold;}

.bphy_list123{width:100%; padding:5px 20px; box-sizing: border-box; display: flex; align-items: center; flex-wrap: wrap;}
.bphy_list123 li{width:166px; padding:10px 0; display: flex; align-items: center;}
.bphy_list123 li label{cursor:pointer; display: flex; align-items: center; width: 100%;}
.bphy_list123 li small{flex-shrink: 0;  padding:0 10px 0 0;}
.bphy_list123 li i{flex-shrink: 0; width:30px; height: 30px;}
.bphy_list123 li i img{width: 100%; border-radius: 50%;}
.bphy_list123 li h6{flex: 1;min-width: 0; font-size:12px; color:#333; padding:0 5px 0 5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}


.tan_btn_box{width: 100%; text-align: center; border-top: #eee 1px solid; padding: 15px 0; flex-shrink: 0;}
.tan_btn1{display: inline-block; font-size:13px; color:#555; padding:6px 20px; border:#e4e4e4 1px solid; background:#fff; margin:0 10px; border-radius: 4px;}
.tan_btn1:hover{border:#4ea8eb 1px solid; color: #4ea8eb;}
.tan_btn2{display: inline-block; font-size:13px;     background: #4ea8eb; border:#4ea8eb 1px solid; color:#fff; padding:6px 20px; margin:0 10px; border-radius: 4px;}
.tan_btn2:hover{color:#fff; background:#3b99df; border:#3b99df 1px solid;}

.voten_tan_fbchose_box{width: 100%; padding: 0 0 50px 0;}
.voten_tan_fbchose_box h2{font-size: 20px; color: #222; display: block; width: 100%; text-align: center; padding: 30px 0 40px 0; }
.voten_tan_fbchose_nr{width: 100%; display: flex;     justify-content: center;}
.voten_tan_fbchose{width: 200px; background: linear-gradient(180deg, #F3F3FF 0%, #E5F6FE 100%); border-radius: 20px; margin: 0 20px;     text-align: center; padding: 30px 0; cursor: pointer;}
.voten_tan_fbchose i{display: block; width: 32px;     margin: 0 auto;}
.voten_tan_fbchose i img{width: 100%;}
.voten_tan_fbchose span{font-size: 22px; color: #222; font-weight: bold; padding: 8px 0 4px 0; display: block; width: 100%;}
.voten_tan_fbchose small{display: block; width: 100%; font-size: 14px; color: #999;}


.voten_tan_fblist{width: 100%; display: flex; padding: 0 0 10px 20px; flex-wrap: wrap; box-sizing: border-box; align-items: center;}
.voten_tan_fblist span{font-size: 15px; color: #222; width: 100px; flex-shrink: 0;}
.voten_tan_fblist2{width: 100%; display: flex; padding: 15px 0 0 20px; flex-wrap: wrap; box-sizing: border-box; align-items: flex-start;}
.voten_tan_fblist2 span{font-size: 15px; color: #222; width: 100px; flex-shrink: 0;}
.voten_tan_fb_input1{width: 480px; padding: 0 10px; font-size: 14px; color: #222; height: 40px;  border-radius: 4px; background: #fff; border: 1px solid #eee; outline: none;}
.voten_tan_fb_gdd_box{ flex: 1;}
.voten_tan_fb_gdd{width: 460px; padding: 0 10px;  height: 40px;  border-radius: 4px; background: #fff; border: 1px solid #eee; display: flex;     align-items: center; margin-bottom: 15px; position: relative;}
.voten_tan_fb_gdd small{  font-size: 12px; color: #333; height: 24px; min-width: 24px; border-radius: 4px; display: flex; justify-content: center; align-items: center; background: #f4f5f7;}
.voten_tan_fb_gdd .voten_tan_fb_gdd_red{background-color: rgba(255, 97, 97, .102); color: #ff5151; padding: 0 6px;}
.voten_tan_fb_gdd .voten_tan_fb_gdd_blue{background-color: rgba(85, 156, 253, .102); color: #559cfd; padding: 0 6px;}
.voten_tan_fb_input2{border: none; font-size: 14px; color: #222; height: 32px; outline: none; padding: 0 0 0 10px; flex: 1;}
.voten_tan_fb_input3{width: 200px; padding: 0 10px; font-size: 14px; color: #222; height: 40px;  border-radius: 4px; background: #fff; border: 1px solid #eee; outline: none; box-sizing: border-box;}
.voten_tan_fb_input4{width: 200px; padding:0 24px 0 10px; font-size: 14px; color: #222; height: 40px;  border-radius: 4px; border: 1px solid #eee; outline: none; background: url("../../images/down_jiantou.png") no-repeat scroll 180px center transparent; background-size: 10px auto; appearance:none; -moz-appearance:none; -webkit-appearance:none; background-color: #fff;}
.voten_tan_fb_textarea{width: 480px; padding: 5px 10px; font-size: 14px; color: #222; height: 65px; line-height: 1.5;  border-radius: 4px; background: #fff; border: 1px solid #eee; outline: none;}

.voten_tan_fb_del{position: absolute; right: -30px; background: url("../../images/close.png") no-repeat ; width: 16px; height: 16px; background-size: 16px; cursor: pointer;}
.voten_tan_fb_del:hover{background: url(../../images/close_hover.png) no-repeat; background-size: 16px;}

.voten_tan_fb_jia{width: auto; display: flex;     align-items: center; margin: 10px 0;}
.voten_tan_fb_jia a{font-size: 14px; color: #333; display: flex; align-items: center;}
.voten_tan_fb_jia i{background: url("../../images/jia.png") no-repeat ; background-size: 16px; width: 16px; height: 16px; margin: 0 5px 0 0;}

.voten_tan_fbcg{width: 100%; text-align: center; padding: 20px 0 0 0;}
.voten_tan_fbcg i{display: block; width: 80px; margin: 0 auto}
.voten_tan_fbcg i img{width: 100%;}
.voten_tan_fbcg span{display: block; font-size: 22px; color: #333; font-weight: bold; padding: 15px 0 0 0;}
.voten_tan_zd{width: 100%; padding: 0 85px; box-sizing: border-box;}
.voten_tan_zdfen{width: 100%; padding: 12px 20px; background: #F4F6F8; box-sizing: border-box; margin: 30px 0 30px 0; border-radius: 4px;}
.voten_tan_zdfen i{display: inline-block; width: 13px; padding: 0 3px 0 0;}
.voten_tan_zdfen i img{width: 100%;}
.voten_tan_zdfen span{font-size: 15px; color: #333; font-weight: bold;}
.voten_tan_zdfen span em{font-size: 16px; color: #fb5652;}
.voten_tan_zdnr{width: 100%; display: flex;  flex-wrap: wrap; box-sizing: border-box; align-items: center;}
.voten_tan_zdnr span{font-size: 15px; color: #222; width: auto; padding: 0 10px 0 0; flex-shrink: 0; font-weight: bold;}
.voten_tan_zdtip{width: 100%; font-size: 13px; color: #999; line-height: 1.6; padding: 10px 0 20px 0;}

.liaotian_vote{width: 100%; padding: 5px 5px 2px 5px; box-sizing: border-box;}
.liaotian_vote em{font-size: 12px; color: #fff; font-weight: bold; padding: 0 2px; border-radius: 2px; width: 28px; height: 16px; line-height: 16px; display: inline-block; text-align: center;}
.liaotian_vote_txt{font-size: 14px; color: #222; line-height: 1.6;}
.liaotian_vote_txt:hover{font-size: 14px; color: #333; line-height: 1.6;}
.liaotian_vote .voten_b2{background: linear-gradient(90deg, #4daaff .25%, #2f9cff 100%, #559dfd 0); font-style: italic;}
.liaotian_vote .voten_b1{background: linear-gradient(90deg, #ff6c79 .25%, #ff8e96 100%, #ff7767 0); width: 22px; font-style: italic;}
.liaotian_vote_btn{ width: 100%; margin-top: 10px;}
.liaotian_vote_btn a{display: block; width: 100%; border-top: #e8eaf1 1px solid; font-size: 14px; color: #4697e8; text-align: center; padding: 8px 0 0 0;}
.liaotian_vote_btn a:hover{color:#3e8cda;}

.voten_pk_liaotian{width: 100%; margin-top: 10px;}
.voten_pk_left_liaotian{height: 40px;     border-radius: 4px 0 0 4px; margin-right: 20px;}
.voten_pk_right_liaotian{height: 40px;     border-radius: 0 4px 4px 0;}
.pktxt_zi_liaotian{font-size: 14px;}
.voten_pk_biao_liaotian{width: 25px; height: auto;     margin: 0 20px 0 0;}
.voten_pk_biao_liaotian img{width: 100%;}

.loading{width: 100%; height:6px; margin: 20px auto; display: flex; justify-content:center;}
.loading span{display: inline-block; width: 6px; height: 100%; margin-right: 4px;border-radius: 50%; background: #999; -webkit-animation: load 1.04s ease infinite;}
.loading span:last-child{margin-right: 0px;}
@-webkit-keyframes load{
  0%{
    opacity: 1;
  }
  100%{
    opacity: 0;
  }
}
.loading span:nth-child(1){
  -webkit-animation-delay:0.13s;
}
.loading span:nth-child(2){
  -webkit-animation-delay:0.26s;
}
.loading span:nth-child(3){
  -webkit-animation-delay:0.39s;
}
.loading span:nth-child(4){
  -webkit-animation-delay:0.52s;
}
.loading span:nth-child(5){
  -webkit-animation-delay:0.65s;
}

.loadEffectbg{position: fixed; z-index: 999999; width: 100%; height: 100%; top: 0; left: 0;  background: rgba(215, 215, 215, 0.2); display: none;}
.loadEffectbox{width: 110px; position: absolute; top: 50%;  left: 50%; box-sizing: border-box; padding: 30px; margin: -60px 0 0 -60px; border-radius: 12px;}
.loadEffect{width: 50px; height: 50px; position: relative;}
.loadEffect span{display: inline-block;
    width: 8px; height: 8px; border-radius: 50%; background: #666; position: absolute; -webkit-animation: load 1.04s ease infinite;}
@-webkit-keyframes load{
  0%{
    opacity: 1;
  }
  100%{
    opacity: 0.2;
  }
}
.loadEffect span:nth-child(1){
  left: 0;
  top: 50%;
  margin-top:-4px;
  -webkit-animation-delay:0.13s;
}
.loadEffect span:nth-child(2){
  left: 7px;
  top: 7px;
  -webkit-animation-delay:0.26s;
}
.loadEffect span:nth-child(3){
  left: 50%;
  top: 0;
  margin-left: -4px;
  -webkit-animation-delay:0.39s;
}
.loadEffect span:nth-child(4){
  top: 7px;
  right:7px;
  -webkit-animation-delay:0.52s;
}
.loadEffect span:nth-child(5){
  right: 0;
  top: 50%;
  margin-top:-4px;
  -webkit-animation-delay:0.65s;
}
.loadEffect span:nth-child(6){
  right: 7px;
  bottom:7px;
  -webkit-animation-delay:0.78s;
}
.loadEffect span:nth-child(7){
  bottom: 0;
  left: 50%;
  margin-left: -4px;
  -webkit-animation-delay:0.91s;
}
.loadEffect span:nth-child(8){
  bottom: 7px;
  left: 7px;
  -webkit-animation-delay:1.04s;
}

.share_content{background-color: #ffffff;  height: 240px; width: 240px; box-sizing: border-box; margin: 15% auto; padding: 20px;}
.shary_tips_area{margin-top: -10%;}
.shary_tips{text-align: center; width: 100%; font-size: 20px; color: #ffffff; line-height: 32px;}

@media screen and (max-width: 1560px) and (min-width: 1400px) {
 .vote_right{width: 280px!important;} 
  }
@media screen and (max-width: 1100px) and (min-width: 520px) {
 .vote_right{display: none;} 
  }


/*redeemrule*/
.redeemrule{font-size: 14px; color: #666; display: flex; align-items: center; justify-content: center;}
.redeemrule:hover{color: #1673E8;}
.redeemrule i{width: 16px; margin-right: 3px;}
.redeemrule i img{width: 100%;}


.detail_mainbox{width: 100%; height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box; padding: 20px 10px 20px 0; display: flex; flex-direction: column;}
.detail_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.detail_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.detail_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}


.detail_ljbox{width: 100%; background: #f6f8f9; border-radius: 8px; padding: 20px 30px; box-sizing: border-box;}
.jflist1{width: 100%; display: flex; flex-direction: column;}
.jflist1 small{font-size: 16px; color: #333; padding: 0 0 8px 0; display: flex; align-items: center;}
.jflist1 small i{margin: 0 0 0 5px; cursor: pointer; width: 16px;}
.jflist1 small i img{width: 100%;}
.jflist1 span{font-size: 12px; color: #333; display: flex; align-items: baseline; gap:5px;}
.jflist1 span em{font-size:24px; color: #1673E8; font-family: Din;}


.jf_footlist{width: 100%; background: #fff; padding: 10px 30px 10px 20px; box-sizing: border-box; border-radius: 8px; display: flex; align-items: center; justify-content: space-around; margin-top: 12px; position: relative;}
.jf_footlist:after{content: ""; position: absolute; top: -8px; left: 15px; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff;}

.jf_footlist .jia{font-size: 15px; color: #999;}
.jflist2{display: flex; flex-direction: column;}
.jflist2>small{font-size: 13px; color: #666; padding: 6px 0 0 0; display: flex; align-items: flex-start;}
.jflist2>small i{margin: 0 0 0 4px; cursor: pointer; width: 15px;}
.jflist2>small i img{width: 100%;}
.jflist2>span{font-size: 12px; color: #666; display: flex; align-items: baseline; gap:3px;}
.jflist2>span em{font-size:22px; color: #444; font-family: Din;}
.jflist2>span>.hui{position: relative;}
.jflist2>span>.hui em{opacity: .4;}
.jflist2>span>.hui>small{position: absolute; top: -16px; right: -38px; background: #F0EFF0; font-size: 12px; color: #999; border-radius: 60px 60px 60px 5px; height: 18px; line-height: 18px; padding: 0 6px;     white-space: nowrap;}



.jflist_btn{background: linear-gradient(92deg, #ffab6b 1.15%, #fe8c37 123.37%); box-shadow: 0 10px 20px 0 rgba(254, 141, 56, .1); border-radius: 60px; text-align: center; font-size: 14px; color: #fff; height: 30px; line-height: 30px; padding: 0 16px; margin: 0 0 0 10px;}
.jflist_btn:hover{background: #fe8c37; color: #fff;}



.detail_xybox{width: 100%; display: flex; align-items: center; gap:10px; padding: 10px 0 0 0;}
@media screen and (max-width: 1480px) and (min-width: 520px) {
  .jf_footlist{justify-content: flex-start; gap:30px;}
  .detail_xybox{width: 100%; display: flex; align-items: center; gap:10px; padding: 10px 0 0 0; flex-wrap: wrap;}
  }

.points_detail_box{width: 100%; border: #ECECF0 1px solid; border-radius: 8px; box-sizing: border-box; margin: 20px 0; padding: 20px; flex: 1;}
.points_detail_box .titleduo{width: 100%; display: flex; align-items: center; justify-content: space-between; border-bottom: #ECECF0 1px solid; box-sizing: border-box; position: sticky; top: 0; z-index: 2; background: #fff; height: 47px;}
.points_detail_box .title{flex: 1; min-width: 0; display: flex; align-items: center; gap: 40px;}
.points_detail_box .title a{font-size: 16px; color: #666; position: relative; padding: 0 0 15px 0;}
.points_detail_box .title a:hover{color: #222;}
.points_detail_box .title .hover{font-weight: bold; color: #222;}
.points_detail_box .title .hover:after,.points_detail_box .title a:hover:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 3px;
    background: #333;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 3px;
    z-index: 100;
    bottom: -8px;    
    width: 62.5%
}


.points_detail_box .title a em{background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 14px; line-height: 14px; padding: 0 4px; display: flex; position: absolute; top: -12px; right: -15px;}


.redeem_nav_shaixuan{display: flex; align-items: center; justify-content:flex-end; flex-shrink: 0; padding-bottom: 10px;}
.redeem_nav_shaixuan span{font-size: 14px; color: #333; margin-right: 10px;}
.redeem_nav_select{width: 140px;}



.points_table{width:100%; border: none;  padding: 20px 0;}
.points_table .thth th{font-size: 14px; color: #999; font-weight: 400; background: #f6f8f9;  padding: 15px 0 15px 15px; text-align: left; line-height: 1.5; }
.points_table td{font-size: 14px; color: #333; border-bottom:#ECECF0 1px solid; padding: 15px 0 15px 15px; text-align: left; line-height: 1.5;}
.tdlan{font-size:15px; color:#53a000!important; font-weight:bold;}
.tdred{font-size:15px; color:#ff6d56!important; font-weight:bold;}
.td_width{max-width: 300px;}

.exp_tips{display: inline-block; background: url(../../images/wenhao2.png) no-repeat 0 1px; background-size: 16px; font-size: 12px; color: #fc5531; text-indent: 17px; margin-left: 8px;}
.exp_tips:hover{color: #fc5531; text-decoration: underline;}

.redeem_tan_width{width: 600px; margin-left: -300px;}
.redeem_tanbox{width: 100%; box-sizing: border-box; background: url(../../images/redeem_pic.png) no-repeat top right; background-size: 180px; border-radius: 0 8px 0 0;}
.redeem_tan_title{width: 100%; font-size: 22px; color: #333; font-weight: bold; position: relative; padding:35px 40px 0 40px; box-sizing: border-box;}
.redeem_tan_title:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 6px;
    background: linear-gradient(90deg, #2090FF 0%, #F1F8FF 100%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 3px;
    z-index: 100;
    left: 65px;
    bottom: -12px;
    opacity: .9;    
}
.redeem_tan_txt{width: 100%; font-size: 15px; color: #444; line-height: 1.7; padding: 30px 40px 30px 40px; box-sizing: border-box; overflow: auto; max-height: calc(100vh - 240px);}
.redeem_tan_txt::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 1px;
}
.redeem_tan_txt::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.redeem_tan_txt::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}
.redeem_tan_btn{width: 100%; display: flex; border-top: #f5f5f5 1px solid; margin-top: 5px;}
.redeem_tan_btn a{width: 100%; padding: 20px 0; font-size: 16px; color: #1673E8; text-align: center;}


.redeem_wechattan_width{width: 480px; margin-left: -240px;}
.redeem_wechattan_title{width: 100%; display: flex; justify-content: space-between;     align-items: center; border-bottom: 1px solid #eee; height: 60px; line-height: 60px; padding: 0 10px 0 30px; box-sizing: border-box;}
.redeem_wechattan_title span{font-size: 16px; color: #222; font-weight: bold;}
.redeem_wechattan_title i{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.redeem_wechattan_title i:hover{background: #eee; border-radius: 50%;}

.redeem_wechat_tanbd{width: 90%; display: flex; justify-content: center; flex-wrap: wrap; padding: 30px 5% 40px 5%;}
.redeem_wechat_tanbd i{width: 100%; display: flex; justify-content: center;}
.redeem_wechat_tanbd span{font-size: 15px; color: #222; line-height: 1.6; padding: 15px 0 0 0;}


.redeem_listbox{width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));  gap: 30px; padding: 20px 0 0 0;}
.redeem_nr_list{background: #FFFFFF; box-shadow: 0px 8px 16px rgba(204,204,204,0.2); border-radius: 8px; border: 1px solid #EFEFEF; display: flex; flex-wrap: wrap; justify-content: center; padding: 30px 0; cursor: pointer;}
.redeem_nr_list i{width: 100%;display: flex; justify-content: center; align-items: center;}
.redeem_nr_list i img{width: 100px;}
.redeem_nr_list .redeem_wximg{width: 120px;}
.redeem_nr_list .redeem_ppimg{width: 120px;}
.redeem_nr_list span{width: 100%; font-size: 16px; color: #ff472e; padding: 12px 0 8px 0; display: flex; justify-content: center; align-items: baseline;}
.redeem_nr_list span em{font-size: 22px; color: #ff472e; font-family:Din!important; margin-right:2px;}
.redeem_nr_list small{width: 100%; font-size: 14px; color: #666; text-align: center;}
.redeem_nr_list:hover{box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); transition: all .3s;}

.redeem_listtip{width: 100%; font-size: 14px; color: #1673E8; padding: 30px 0 0 0;}



.welfare_title{width: 100%; display: flex; align-items: center; gap:30px; padding: 20px 0 0 10px; box-sizing: border-box;}
.welfare_title a{font-size: 14px; color: #999;}
.welfare_title a:hover{color: #222;}
.welfare_title .hover{color: #222; font-weight: bold;}

.welfare_mainbox{width: 100%; display: grid; justify-content: space-between;grid-gap: 24px; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); padding: 20px 10px 40px 10px;  max-height: calc(100vh - 177px);  overflow: auto; box-sizing: border-box;}
.welfare_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.welfare_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.welfare_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.welfare_list{width: 400px; background: #fff; border: 1px solid #eee; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); padding: 10px; border-radius: 8px; transition: all .3s; cursor: pointer; display: flex; flex-direction: column; box-sizing: border-box; padding: 20px;}
.welfare_list:hover{box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); transition: all .3s;}
.welfare_list_top{width: 100%; box-sizing: border-box; display: flex; align-items: center;     justify-content: space-between; border-bottom: #DCDEDF 1px dashed; padding: 0 0 15px 0;}
.welfare_list_top .left{display: flex; flex-direction: column;}
.welfare_list_top .left span{font-size: 18px; color: #222;}
.welfare_list_top .left small{font-size: 14px; color: #666; padding: 8px 0 0 0;}
.welfare_list_top .right{display: flex; flex-direction: column; align-items: center; padding-right: 10px;}
.welfare_list_top .right span{font-size: 28px; color: #ff472e; font-family: Din !important;}
.welfare_list_top .right small{font-size: 14px; color: #ff472e;}
.welfare_list_foot{width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 16px 0 0 0;}
.welfare_list_foot .left{font-size: 12px; color: #999;}
.welfare_list_foot .right{flex-shrink: 0;}
.welfare_list_foot .right a{font-size: 12px; color: #ff472e; padding: 3px 10px; border: #ff472e 1px solid; border-radius: 4px;}

.welfare_list_hui{position: relative;}
.welfare_list i {position:absolute; bottom:30px; right:90px; z-index:9;}
.welfare_list_hui .welfare_list_top .left span{color: #c4c4c4;}
.welfare_list_hui .welfare_list_top .left small{color: #dadada;}
.welfare_list_hui .welfare_list_top .right span{color: #c4c4c4;}
.welfare_list_hui .welfare_list_top .right small{color: #c4c4c4;}
.welfare_list_hui .welfare_list_foot .left{color: #dadada;}
.welfare_list_hui .welfare_list_foot .right a{color: #c4c4c4; border: #dadada 1px solid;}


/*homepage*/
.homepage_mainbox{width: 100%; max-height: calc(100vh - 95px);  overflow: auto; box-sizing: border-box; padding: 0 10px 20px 10px;}
.homepage_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.homepage_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.homepage_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}


.mehome_top{width: 100%; border: #ECECF0 1px solid; border-radius: 8px; box-sizing: border-box; padding: 20px; display: flex; align-items: center;}
.mehome_ziliaobox{flex: 1; min-width: 0; display: flex; align-items: center;}
.mehome_ziliaobox .tx{width: 120px; height: 120px; border: #ECECF0 1px solid; border-radius: 50%; flex-shrink: 0;}
.mehome_ziliaobox .tx img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.mehome_ziliao{flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 0 0 15px;}
.mehome_ziliao>span{display: flex; align-items: center;}
.mehome_ziliao>span em{font-size: 22px; color: #222; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mehome_ziliao>span>i{width: 16px; margin: 0 0 0 5px; flex-shrink: 0;}
.mehome_ziliao>span>i img{width: 100%;}
.mehome_ziliao>small{font-size: 14px; color: #999; padding: 10px 0 0 0; display: flex; align-items: center;}
.mehome_ziliao>small>em{font-size: 13px; color: #999; padding: 0 20px 0 0;}
.mehome_jflist{display: flex; align-items: center; gap: 15px; padding: 18px 0 0 0;}
.mehome_jflist>span{font-size: 13px; color: #999; display: flex; align-items: baseline;}
.mehome_jflist>span>strong{font-size: 18px; color: #555; font-family: Din; font-weight: 500; margin: 0 0 0 3px;}
.mehome_jflist>em{width: 1px; height: 12px; background: #ddd;}

.mehome_zlbtn{display: flex; align-items: center; flex-shrink: 0; gap:20px;}
.mehome_zlbtn a{padding: 12px 24px; font-size: 14px; color: #333; border-radius: 60px; display: flex; align-items: center; box-sizing: border-box;}
.mehome_zlbtn a i{width: 14px; margin-right: 5px;}
.mehome_zlbtn a i img{width: 100%;}
.mehome_zlbtn .btn1{background: #F6F8FA;}
.mehome_zlbtn .btn2{background: linear-gradient(90deg, #16ADFD 0%, #0F8FFD 100%);box-shadow: 0px 6px 20px #CBE6FF; color:#fff;}
.mehome_zlbtn .btn2:hover{background: #0F8FFD; color:#fff;}
.mehome_zlbtn .btn3{background: #fff; border: #0F8FFD 1px solid; color: #0F8FFD;}

.mehome_nrbox{width: 100%; border: #ECECF0 1px solid; border-radius: 8px; box-sizing: border-box; padding: 20px; margin-top: 20px;}
.mehome_nrbox .title{width: 100%; display: flex; align-items: center; gap: 40px; border-bottom: #ECECF0 1px solid; position: sticky; top: 0; z-index: 2; background: #fff;}
.mehome_nrbox .title a{font-size: 16px; color: #666; position: relative; padding: 0 0 18px 0;}
.mehome_nrbox .title a:hover{color: #222;}
.mehome_nrbox .title .hover{font-weight: bold; color: #222;}
.mehome_nrbox .title .hover:after,.mehome_nrbox .title a:hover:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 3px;
    background: #333;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 3px;
    z-index: 100;
    bottom: 0px;    
    width: 62.5%
}


/*basic_box*/
.basic_box{width: 100%; padding: 10px 0 0 0;}
.account_list{width: 100%; display: flex; align-items: center;     border-bottom: #ECECF0 1px solid; padding: 20px 5px; box-sizing: border-box;}
.account_list:last-child{border-bottom:none; padding: 20px 5px 0 5px;}
.account_list .pic{flex-shrink: 0; width: 20px; margin-right: 20px;}
.account_list .pic img{width: 100%;}
.account_list .zi{flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 20px 0 0;}
.account_list .zi span{font-size: 14px; color: #444; font-weight: bold;}
.account_list .zi span em{font-size: 14px; color: #52C41A; padding: 0 0 0 15px; font-weight: 500;}
.account_list .zi small{font-size: 14px; color: #bbb; margin-top: 8px; line-height: 1.5;}
.account_list .btn{flex-shrink: 0; padding: 8px 25px; font-size: 14px; color: #333; border: #EDEFF0 1px solid; border-radius: 8px;}
.account_list .btn:hover{border: #0086F6 1px solid; background: #0086F6; color: #fff;}

.account_list p{display: inline-block;}
.account_list .layui-form-onswitch {width: 56px; border-color: #52c41a; background-color: #52c41a;}


.basic_tanbox{width: 100%;  padding:40px 30px 10px 30px; box-sizing: border-box;}
.basic_tanmian{width: 100%; max-height: 450px; min-height: 150px; overflow: auto;}
.basic_tanlist{width: 100%; padding: 0 0 0 0; box-sizing: border-box; display: flex; align-items: center; flex-wrap: wrap;}
.basic_tanlist span{width: 90px; flex-shrink: 0; font-size: 15px; color: #333;}
.basic_tanlist small{width: auto; flex: 1; min-width: 0; font-size: 15px; color: #333;}

.basic_taninputbox{flex: 1; min-width: 0;}
.basic_tanlist a{flex-shrink: 0; height:40px; line-height:40px;  padding:0 15px; border:#1673E8 1px solid; color: #1673E8; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #1673E8; margin-left: 10px;}
.basic_tanlist a:hover{border:#1673E8 1px solid; background:#1673E8;  color: #fff;}

.basic_tancuo{width: 100%; box-sizing: border-box; font-size: 13px; color:#f5222d; min-height: 25px; line-height: 1.5; padding: 3px 0 0 90px;}

.account_list .biaoti{width: 150px; flex-shrink: 0; font-size: 15px; color: #333;}
.duihuan_input{display: flex; align-items: center;}
.basic_cuo{display: inline-block; box-sizing: border-box; font-size: 13px; color:#f5222d;  line-height: 1.5; padding: 0 0 0 5px;}

.delzh_tanbox{width: 100%;  padding:10px 30px 10px 30px; box-sizing: border-box;}
.delzh_box{width:100%;}
.delzh_box dl{border-bottom:#f0f0f0 1px solid; width:100%; display: flex;}
.delzh_box dl label{display: flex; width: 100%; padding: 20px 0; align-items: center;}
.delzh_box dt{width: 20px; margin-right: 5px; display: flex; align-items: center;}
.delzh_box dd{font-size:14px; color:#444; line-height: 1.5;}
.del_ipt{width:200px; height:26px; line-height:26px; border-bottom:#ccc 1px solid; border-top:#fff 1px solid; border-left:#fff 1px solid; border-right:#fff 1px solid; color:#555;}


.personalinfo_box{max-width: 680px;  padding: 30px 0 0 10px; overflow: visible; gap: 25px;}

.touxiang_box{width:100%; display: flex; padding-bottom: 10px;}
.touxiang_box i{width:100px; height: 100px; flex-shrink: 0;}
.touxiang_box i img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.touxiang_box .zi{padding:20px 0 0 20px; flex: 1; min-width: 0; display: flex; flex-wrap: wrap;}
.touxiang_box .zi a{padding:5px 25px;  color:#333; font-size:14px; background: #EDF2F5; border-radius: 8px; display: flex; align-items: center; justify-content: center;}
.touxiang_box .zi a:hover{background: #0086F6; color:#fff;}
.touxiang_box .zi small{width: 100%; color:#999; font-size:13px; padding:10px 0 0 0;}

.personalinfo_jieshao{width: 100%!important;}
.personalinfo_jieshao textarea{width:100%; height:80px; line-height:1.5;  padding:10px; border:#e8e8e8 1px solid; border-radius: 8px; box-sizing: border-box; font-size: 14px; color: #222;}
.personalinfo_jieshao textarea:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}

.basic_btn{width: 100%; box-sizing: border-box; padding: 30px 0 20px 0; display: flex; align-items: center;}
.basic_btn a{min-width: 180px; padding: 0 20px; border-radius: 8px; text-align: center; font-size: 15px; color: #fff; height: 46px; line-height: 46px; }





.addval_box{width: 100%; display: grid; justify-content: space-between;grid-gap: 24px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); padding: 25px;  max-height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box;}
.addval_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.addval_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.addval_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.addval_list{background: #fff; border: 1px solid #F6F6F6; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .04); padding: 20px; border-radius: 8px; transition: all .3s; cursor: pointer; display: flex; align-items: center; box-sizing: border-box;}
.addval_list:hover{box-shadow: 0px 4px 16px 1px rgba(0,0,0,.12); transition: all .3s;}
.addval_list .pic{flex-shrink: 0; width: 40px;}
.addval_list .pic img{width: 100%;}
.addval_list .zi{flex:1; min-width: 0; display: flex; flex-wrap: wrap; padding: 0 0 0 25px;}
.addval_list .zi span{width: 100%; font-size:16px; color: #222; padding: 0 0 8px 0;}
.addval_list .zi small{background: #F0F0F2; border-radius: 4px; font-size: 12px; color: #666; padding: 3px 8px;}

.addval_box .hui .pic,.addval_box .hui .zi{opacity: 0.6;}



.zzxx_box{width: 100%;  padding: 10px; max-height: calc(100vh - 142px);  overflow: auto; box-sizing: border-box;}
.zzxx_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.zzxx_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.zzxx_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.zzxx_nrlist{width: 100%; font-size: 14px; color: #333; padding: 15px 0; box-sizing: border-box;}
.zzxx_nrlist em{display: inline-block; font-size: 14px; color: #333; font-weight: bold; margin: 0 2px 0 0;}
.zzxx_nrlist h1{display: inline-block; font-size: 14px; color: #333; margin: 0 15px 0 0;}
.zzxx_nrlist label{margin: 0 5px; cursor: pointer; font-size: 14px; color: #666;}
.zzxx_nrlist span{display: inline-block; width: 240px; margin: 0 10px 0 0; font-size: 14px; color: #666;}
.zzxx_nrlist p{display: inline-block; width: 100%; margin: 5px 0 0 0; font-size: 14px; color: #666;}
.zzxx_nrlist label input{margin: 0 5px 0 0;}
.zzxx_nrlist2{width: 100%; font-size: 14px; color: #333;  padding: 12px 0 12px 16px; box-sizing: border-box;}
.zzxx_nrlist2 em{display: inline-block; font-size: 14px; color: #333; font-weight: bold; margin: 0 2px 0 0;}
.zzxx_nrlist2 h1{display: inline-block; font-size: 14px; color: #333; margin: 0 10px 0 0;}
.zzxx_nrlist2 label{margin: 0 5px; cursor: pointer; font-size: 14px; color: #666;}
.zzxx_nrlist2 span{display: inline-block; width: 240px; margin: 0 10px 0 0; font-size: 14px; color: #666;}
.zzxx_nrlist2 p{display: inline-block; width: 100%; margin: 8px 0 0 0; font-size: 14px; color: #666;}
.zzxx_nrlist2 p span{margin: 0 10px;}
.zzxx_nrlist2 .layui-input, .layui-select, .layui-textarea{height: 36px; border-radius: 4px;}
.zzxx_nrlist2 .layui-form-select .layui-edge{right: 8px; top: 7px;}
.zzxx_nrlist2 label input{margin: 0 5px 0 0;}
.zzxx_nrlist2 a{display: inline-block; padding:0 15px; color:#f6953e; border:#f6953e 1px solid; font-size:14px; height:22px; line-height:22px; margin: 0 0 0 20px;}
.zzxx_nrlist2 a:hover{color:#fff; background:#ffa05e; border:#ffa05e 1px solid;}
.zzxx_info{width: 100%; font-size: 14px; color: #888;}
.zzxx_info small{display: inline-block; font-size: 14px; color: #888; margin: 6px 40px 0 0;}

.zzxx_input{width: 100%; height: 36px; line-height: 36px; padding: 0 5px; box-sizing: border-box; background: #fff; border: #e9ecf0 1px solid; border-radius:4px; font-size: 14px; color: #222;}
.zzxx_input:focus{border: 1px solid #1673E8; color: #222; background: #fff; box-shadow: 0 4px 8px rgb(0 78 236 / 15%);}


.zzxx_select1{border:#dddddd 1px solid; color:#666; width:100%; line-height:26px; height:26px; font-size:12px; border-radius: 3px;}
.zzxx_select2{border:#dddddd 1px solid; color:#666; width:300px; line-height:26px; height:26px; font-size:12px; border-radius: 3px;}
.zzxx_select3{border:#dddddd 1px solid; color:#666; width:200px; line-height:26px; height:26px; font-size:12px; border-radius: 3px;}
.zzxx_ulll{display: block; width: 100%; margin: 8px 0 0 0;}
.zzxx_ulll li{display: inline-block; width:301px; padding: 5px 10px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.zzxx_tannr{width: 710px; padding: 0 0 0 20px;}
.zzxx_tannr h1{display: block; width: 100%; font-size: 14px; color: #333; font-weight: bold; padding: 15px 0 5px 0;}
.zzxx_tannr ul{display: block; width: 710px;}
.zzxx_tannr li{display: inline-block; width: 210px; padding: 5px 15px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.zzxx_tannr li label{cursor: pointer;}
.zzxx_tannr li input{margin: 0 5px 0 0;}
.zzxx_tanbtn{text-align: center; padding: 25px 0;}
.zzxx_tanbtn a{background: #328edc; font-size: 14px; color: #fff; padding: 8px 25px;}
.zzxx_tanbtn a:hover{ background: #1f7fd1; color: #fff;}




/*chat*/
.chat_content{width: calc(100% - 20px); border: #ECECF0 1px solid; border-radius: 8px; box-sizing: border-box; margin: 0 10px;  height: calc(100vh - 110px); display: flex;}
.chat_content .left_box{width:260px; flex-shrink: 0; border-right: #ECECF0 1px solid; padding: 10px; box-sizing: border-box; border-radius: 8px 0 0 8px; overflow: auto;}
.chat_content .left_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.chat_content .left_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.chat_content .left_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}
.chat_content .left_list{width: 100%; display: flex;align-items: center; padding: 10px; margin: 0 0 3px 0; box-sizing: border-box;}
.chat_content .hover,.chat_content .left_list:hover{background: #f7f8fa; border-radius: 8px; cursor: pointer;}
.chat_content .left_list .tx{width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0;}
.chat_content .left_list .tx img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.chat_content .left_list .zibox{flex: 1; min-width: 0; padding: 0 0 0 10px;}
.chat_content .left_list .zibox .name{width: 100%; display: flex; align-items: center; justify-content: space-between;}
.chat_content .left_list .zibox .name span{font-size: 14px; color: #222; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex: 1; min-width: 0;}
.chat_content .left_list .zibox .name small{font-size: 12px; color: #ccc; flex-shrink: 0;}
.chat_content .left_list .zibox .zi{width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 5px 0 0 0;}
.chat_content .left_list .zibox .zi span{font-size: 12px; color: #999; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.chat_content .left_list .zibox .zi small{background: linear-gradient( 90deg, #FF0037 0%, #F301A4 100%); border-radius: 60px 60px 60px 5px; border: 1px solid #FFFFFF; font-size: 12px; color: #fff; height: 14px; line-height: 14px; padding: 0 4px; display: flex; margin-left: 8px;}


.xms_search{width: 100%; padding: 0 0 15px 0; display: flex; align-items: center; flex-shrink: 0;}
.xms_search input{width: 100%; font-size: 14px; color: 333; padding: 0 8px; line-height: 34px; box-sizing: border-box; border-radius: 8px; border-radius: 8px 0 0 8px; border: #ECECF0 1px solid; border-right: none;}
.xms_search a{background: #0086F6; border-radius: 0 8px 8px 0; height: 36px; padding: 0 10px; display: flex; align-items: center; }
.xms_search a:hover{background: #0f90fd; }

.xms_left_box{display: flex; flex-direction: column;}

.xms_mainbox{overflow: auto; min-width: 0; flex: 1;}
.xms_mainbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.xms_mainbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.xms_mainbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}


.chat_content .right_box{flex: 1; min-width: 0; background: #f7f8fa; border-radius: 0 8px 8px 0; display: flex; flex-direction: column;}
.liaotian_box{width: 100%; padding: 30px; box-sizing: border-box; overflow: auto; max-height: calc(100vh - 185px);  flex:1; min-width: 0;}
.liaotian_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.liaotian_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.liaotian_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.liaotian_left{display: flex; padding: 0 0 30px 0; flex-wrap: wrap;}
.liaotian_left .tx{width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;}
.liaotian_left .tx img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.liaotian_left .nrbox{flex: 1; min-width: 0; padding: 0 0 0 10px; display: flex; flex-wrap: wrap; max-width: 460px; }
.liaotian_left .nrbox .name{display: flex; align-items: center; padding: 0 0 8px 0; width: 100%;}
.liaotian_left .nrbox .name span{font-size: 14px; color: #222; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.liaotian_left .nrbox .name small{font-size: 14px; color: #999; padding: 0 0 0 10px;}

.liaotian_left .nrbox .content{background: #fff; border-radius: 2px 16px 16px 16px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.02); display: flex; flex-direction: column;}
.liaotian_left .nrbox .content>span{font-size: 14px; color: #222; line-height: 1.6}
.liaotian_left .nrbox .content>i{margin: 0 0 0 0; height: 100px;}
.liaotian_left .nrbox .content>i img{height: 100%;}


.liaotian_left .chat_yinyong{width: 100%; display: flex; padding: 0 0 0 50px; box-sizing: border-box;}
.liaotian_left .chat_yinyong>.content{background: #E8EBF6; border-radius: 2px 16px 16px 16px; padding: 8px 12px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); display: flex; flex-direction: column; margin-top: 6px;}
.liaotian_left .chat_yinyong>.content>span{font-size: 13px; color: #666; line-height: 1.5; overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; display:-webkit-box; display:box;}
.liaotian_left .chat_yinyong>.content>i{margin: 0 0 0 0; height: 30px;}
.liaotian_left .chat_yinyong>.content>i img{height: 100%;}


.liaotian_right{display: flex; padding: 0 0 30px 0; flex-wrap: wrap;}
.liaotian_right .tx{width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;}
.liaotian_right .tx img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.liaotian_right .nrbox{flex: 1; min-width: 0; padding: 0 10px 0 0; display: flex; flex-wrap: wrap;  justify-content: flex-end;}
.liaotian_right .nrbox .name{display: flex; align-items: center; padding: 0 0 8px 0; width: 100%; justify-content: flex-end;}
.liaotian_right .nrbox .name span{font-size: 14px; color: #222; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.liaotian_right .nrbox .name small{font-size: 14px; color: #999; padding: 0 10px 0 0;}

.liaotian_right .nrbox .content{background: #fff; border-radius: 16px 2px 16px 16px; padding: 10px 15px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.02); display: flex; flex-direction: column; max-width: 420px;}
.liaotian_right .nrbox .content>span{font-size: 14px; color: #222; line-height: 1.6}
.liaotian_right .nrbox .content>i{margin: 0 0 0 0; height: 100px;}
.liaotian_right .nrbox .content>i img{height: 100%;}

.liaotian_right .chat_yinyong{width: 100%; display: flex; justify-content: flex-end; padding: 0 50px 0 0; box-sizing: border-box;}
.liaotian_right .chat_yinyong>.content{background: #E8EBF6; border-radius: 16px 2px 16px 16px; padding: 8px 12px; box-sizing: border-box; box-shadow: 0 2px 12px 0 rgba(0,0,0,.04); display: flex; flex-direction: column; margin-top: 6px;}
.liaotian_right .chat_yinyong>.content>span{font-size: 13px; color: #666; line-height: 1.5; overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; display:-webkit-box; display:box;}
.liaotian_right .chat_yinyong>.content>i{margin: 0 0 0 0; height: 30px;}
.liaotian_right .chat_yinyong>.content>i img{height: 100%;}


.liaotian_left .nrbox .liaotian_bbgg{animation: flash-bg 1s linear 2;}
@keyframes flash-bg {
  0%, 100% {
    background: rgba(0, 0, 0, .2); /* 保持半透明黑色 */
  }
  50% {
    background: rgba(0, 0, 0, 0);  /* 中间变为完全透明，实现“消失” */
  }
}

.chatinput_box{  margin: 0 15px; display: flex; flex-wrap: wrap; flex-shrink: 0; padding: 0 0 10px 0;}
.chatinput_box form{width: 100%;}

.chatinput_srk{width: 100%; display: flex; align-items: center; justify-content: space-between;  background: #fff; border: #ECECF0 1px solid; border-radius: 8px; padding: 10px; box-sizing: border-box;}

.chatinput_box .input{flex:1; min-width: 0; display: flex; align-items: center; padding: 0; box-sizing: border-box;}
.chatinput_box .input>input{border: none; font-size: 14px; color: #222;  flex-grow: 1; padding: 10px 10px 10px 0;}
.chatinput_box .input>a{background: linear-gradient(90deg, #16ADFD 0%, #0F8FFD 100%); border-radius: 60px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 6px 12px;}
.chatinput_box .input>a i{width: 17px;}
.chatinput_box .input>a i img{width: 100%;}

.chatinput_box .pic{background: #FFFFFF; box-shadow: 0px 2px 10px 1px rgba(106,106,106,0.04); border-radius: 8px;  border: 1px solid #E9F0FF; display: flex; align-items: center; padding: 8px; box-sizing: border-box; cursor: pointer; margin-left: 10px;}
.chatinput_box .pic img{width: 20px;}
.chatinput_box .pic:hover{background: #F6F7F9; box-shadow: 0px 2px 10px 1px rgba(106,106,106,0.06); font-size: 14px; color: #666;}

.chatinput_box .chat_input_yinyong{ background: #fff; border: #ECECF0 1px solid; margin: 0 0 8px 0;}


.lt_msr_tip1{width: 100%; padding: 10px 15px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; background: #fffae8; border-radius: 8px; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .02); margin-bottom: 20px;}
.lt_msr_tip1 span{font-size: 14px; color: #333; flex-shrink: 0;}
.lt_msr_tip1_right{flex: 1; min-width: 0; display: flex; align-items: center; justify-content:flex-end; }
.lt_msr_tip1_right a{border-radius: 60px; font-size: 12px; padding: 2px 12px; border: #dde0e3 1px solid; background: #fff;}
.lt_msr_tip1_right i{width: 8px; height: 8px; cursor: pointer; margin: 0 0 0 10px; background: url(../../images/cuo.svg) no-repeat; background-size: 8px;}

.lt_msr_tip2{width: 100%;  padding: 20px 60px; box-sizing: border-box; display: flex; align-items: center; justify-content: center;}
.lt_msr_tip2 span{font-size: 12px; background: rgba(0,0,0,.3); color: #fff; line-height: 1.5; text-align: center; padding: 6px; border-radius: 8px;}


.chat_left_kong{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #666;}
.chat_right_kong{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.chat_right_kong i{display: inline-block; width: 180px;}
.chat_right_kong i img{width: 100%;}
.chat_right_kong span{display: inline-block; width: 100%; text-align: center; font-size: 14px; color: #999; padding: 10px 0 0 0;}

/*friend*/
.friend_btnbox{display: flex; align-items: center; justify-content:flex-end; flex-shrink: 0; padding-bottom: 10px; gap:10px;}
.friend_btnbox .btn{background: linear-gradient(92deg, #ffab6b 1.15%, #fe8c37 123.37%); box-shadow: 0 10px 20px 0 rgba(254, 141, 56, .1); border-radius: 60px; text-align: center; font-size: 14px; color: #fff; height: 34px; line-height: 34px; padding: 0 16px; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.friend_btnbox .btn:hover{background: #fe8c37; color: #fff;}

.friend_btnbox .seach{width: 220px; height: 34px; display: flex; align-items: center; border-radius: 60px; border: #e1e3e7 1px solid; }
.friend_btnbox .seach input{width: 100%; font-size: 14px; color: 333; padding: 0 10px; line-height: 34px; box-sizing: border-box; border: none; border-radius: 60px;}
.friend_btnbox .seach a{border-radius: 60px; height: 36px; padding: 0 10px; display: flex; align-items: center; }
.friend_btnbox .seach a img{width: 20px;}

/*.friend_box{width: 100%; display: grid; justify-content: space-between;grid-gap: 30px 50px; grid-template-columns: repeat(auto-fill, minmax(345px, 1fr)); padding: 30px 10px 20px 10px;  box-sizing: border-box;}*/

.friend_box{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px 20px; padding: 30px 10px 20px 10px;  box-sizing: border-box;}

.friend_list{display: flex; align-items: center;  box-sizing: border-box; width: 340px;}
@media screen and (max-width: 1500px) and (min-width: 340px) {  
.friend_box{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px 20px; padding: 30px 10px 20px 10px;  box-sizing: border-box;}
  .friend_list{display: flex; align-items: center;  box-sizing: border-box; width: 340px;}
}
@media screen and (max-width: 1600px) and (min-width: 1500px) {  
.friend_box{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px 20px; padding: 30px 10px 20px 10px;  box-sizing: border-box;}
  .friend_list{display: flex; align-items: center;  box-sizing: border-box; width: 360px;}
}
@media screen and (max-width: 1700px) and (min-width: 1600px) {  
.friend_box{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px 20px; padding: 30px 10px 20px 10px;  box-sizing: border-box;}
  .friend_list{display: flex; align-items: center;  box-sizing: border-box; width: 380px;}
}


.friend_list .tx{width: 56px; height: 56px; border: #ECECF0 1px solid; border-radius: 50%; flex-shrink: 0;}
.friend_list .tx img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.friend_list .ziliao{flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 0 0 15px;}
.friend_list .ziliao>span{display: flex; align-items: center;}
.friend_list .ziliao>span em{font-size: 15px; color: #222; font-weight: bold; line-height: 1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.friend_list .ziliao>span>i{width: 14px; margin: 0 0 0 5px; flex-shrink: 0;}
.friend_list .ziliao>span>i img{width: 100%;}
.friend_list .ziliao>small{font-size: 12px; color: #999; padding: 10px 0 0 0; display: flex; align-items: center;}
.friend_list .ziliao>small>em{font-size: 12px; color: #999; padding: 0 20px 0 0; background: url(../../images/add.png) no-repeat 0 0; padding-left: 12px;}

.friend_list .btnbox{display: flex; align-items: center; gap: 10px; flex-shrink: 0; padding: 0 0 0 10px;}
.friend_list .btnbox a{padding: 0 13px; height: 28px; line-height: 28px; font-size: 13px; color: #333; border: #e1e3e7 1px solid; border-radius: 60px; display: flex; align-items: center; box-sizing: border-box;}
.friend_list .btnbox a:hover{background: #EFF1F7;}


.find_box{padding: 20px 10px 20px 10px;}
.find_suijititle{width: 100%; padding: 20px 10px 0 10px; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box;}
.find_suijititle span{font-size:16px; color:#333; font-weight: bold; line-height: 32px;}
.find_suijititle small{cursor: pointer; display: flex; align-items: center;}
.find_suijititle small em{font-size:14px; color:#666; }
.find_suijititle small i{width: 14px; height: 14px; margin-left: 5px;}
.find_suijititle small i img{width: 100%;}
.find_suijititle small:hover em{color:#222;}
@keyframes spin{
  0% {
    transform:rotate(0)
  }
  to {
    transform:rotate(720deg)
  }
}
.rotate-active {
  animation: spin 0.8s linear;
  display: inline-block; /* 确保 transform 属性能正常工作 */
}

.nearby_box{width: 100%; padding: 20px 0 25px 0; display: flex; align-items: center; gap:15px;}
.nearby_select{display: flex; align-items: center; justify-content:flex-end; flex-shrink: 0;}
.nearby_select span{font-size: 14px; color: #333; margin-right: 5px;}
.nearby_select span em{font-size: 14px; color: #ff472e; font-weight: bold;}
.nearby_select small{font-size: 14px; color: #333; margin: 0 5px;}
.nearby_select_width{width: 75px;}
.nearby_slide_cont{width: 140px; margin: 0 8px 0 0 ;}

.nearby_btn{font-size: 14px; color: #fff; padding: 4px 12px; border-radius: 4px;}

.nearby_select .layui-input, .layui-select, .layui-textarea{height: 32px;}
.nearby_select .layui-form-select .layui-edge{top: 4px; right: 2px;}
.nearby_select .layui-form-select .layui-input{padding-right: 20px;}
.nearby_select .layui-form-select dl{top: 32px;}


/*invite*/
.tan_invite{display: none;}
.invite_box{width: 375px; height: 600px; background:#FEF1CE url(../../images/invite/bg.png) no-repeat top; background-size: 100%; border-radius: 8px; padding: 0 15px; box-sizing: border-box; overflow: auto;}
.invite_box::-webkit-scrollbar { /*滚动条整体样式*/
  width : 5px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 5px;
}
.invite_box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;  
  background-color: rgba(110, 89, 0, 0.2); 
}
.invite_box::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #FEF1CE;
}
.invite_banner{width: 100%; display: flex; align-items: center; position: relative; height: 120px;}
.invite_banner_zi{width: 200px; position: absolute; top: 30px; left: 0; z-index: 2;}
.invite_banner_zi .toptip{position: absolute; top: -22px; right: 10px; display: flex; align-items: center; background: linear-gradient( 90deg, #FFEB48 0%, #FFE93E 100%); border-radius: 40px 20px 20px 20px; border: 1px solid #FFFFFF; padding: 3px 3px 3px 5px;}
.invite_banner_zi .toptip i{width: 12px;}
.invite_banner_zi .toptip i img{width: 100%;}
.invite_banner_zi .toptip span{font-size: 12px; color: #782908; padding: 0 0 0 3px;}
.invite_banner_pic{width: 150px; position: absolute; top: 0; right: -10px; z-index: 1;}
.topgzbtn{position: absolute; top: 30px; right: -15px; background-color: rgba(253, 240, 216, 0.6); border-radius: 4px 0px 0px 4px; font-size: 13px; color: #AF4437; padding: 3px 2px; cursor: pointer;  z-index: 4;}
.topgzbtn:hover{color: #AF4437;}

.invite_jfbox{width: 100%; background: linear-gradient( 88deg, #F1FFFE 0%, #FEF7E8 46.44%, #FFF4FB 100%); border-radius: 8px; display: flex; align-items: center; justify-content: space-between; padding: 15px 30px 10px 30px; box-sizing: border-box; border: #fff 1px solid;}
.invite_jfbox .list{display: flex; flex-direction: column; cursor: pointer;}
.invite_jfbox .list small{font-size: 14px; color: #333;}
.invite_jfbox .list span{font-size: 24px; color: #ff472e; font-weight: 500; font-family: Din;}

.invite_jieshao{width: 100%; border-radius: 8px; margin: 10px 0 0 0}

.invite_jieshao .zibox{width: 100%; }
.invite_jieshao .zibox .title{width: 100%;  font-size: 18px; color: #222; font-weight: bold; padding: 20px 0 18px 80px; box-sizing: border-box; position: relative;  background:url(../../images/invite/bg2.png) no-repeat; background-size: 100%;}
.invite_jieshao .zibox .title span{color: #ff472e;}
.invite_jieshao .zibox .title:after {
    content: "";
    position: absolute;
    width: 100px;
    height: 12px;
    background:url(../../images/invite/line.png) no-repeat; 
    background-size: 100%;
    left: 100px;
    z-index: 100;
    bottom: 8px;    
}
.invite_jieshao .zibox .fuli{width: 100%;  box-sizing: border-box; background: #fff; padding: 10px 20px 10px 20px; border-radius: 0 0 0 0; position: relative;}
.invite_jieshao .zibox .fuli2{padding: 5px 20px 5px 20px;}

.invite_jieshao .zibox .fuli .biaoti{width: 100%; display: flex; flex-wrap: wrap; align-items: center; padding: 0 0 10px 0;}
.invite_jieshao .zibox .fuli .biaoti small{    background: linear-gradient(90deg, #FC5531 0%, #FF7700 100%); font-size: 12px; color: #fff; padding: 2px 4px; border-radius: 4px; margin-right: 3px; flex-shrink: 0;}
.invite_jieshao .zibox .fuli .biaoti span{font-size: 16px; color: #222; flex: 1;}
.invite_jieshao .invite_neirong{width: 100%; background: #FFF0F0; border-radius: 8px; padding: 15px 10px 15px 15px; box-sizing: border-box; display: flex; align-items: center;}
.invite_jieshao .invite_neirong .zi1{display: flex; flex-direction: column; flex: 1;}
.invite_jieshao .invite_neirong .zi1 span{font-size: 15px; color: #88320D;}
.invite_jieshao .invite_neirong .zi1 span em{font-size: 15px; color: #ff472e; font-weight: bold;}
.invite_jieshao .invite_neirong .zi1 small{font-size: 13px; color: #A9674B; padding: 5px 0 0 0;}
.invite_jieshao .invite_neirong .zi2{display: flex; flex-direction: column; align-items: center; flex-shrink: 0; padding: 0 8px 0 15px; position: relative;}
.invite_jieshao .invite_neirong .zi2 span{font-size: 22px; color: #ff472e;     font-weight: 500; font-family: Din;}
.invite_jieshao .invite_neirong .zi2 small{font-size: 13px; color: #FB5652; }
.invite_jieshao .invite_neirong .zi2:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 35px;
    background:#F5DFDB; 
    background-size: 100%;
    left: 0px;
    z-index: 100;
    bottom: 0;    
}


.invite_jieshao .invite_neirong .rightbiao{ position: absolute; top: -2px; right: 5px; width: 60px; height: 60px; background:url(../../images/invite/biao.png) no-repeat center center; background-size: 100%; }
.invite_jieshao .invite_neirong .rightbiao span{font-size: 14px; color: #222; font-weight: bold; transform: rotate(335deg); display: inline-block; padding: 20px 0 0 4px;}


.invite_jieshao .tipbox{width: 100%; background: #fff; box-sizing: border-box; padding: 5px 20px 20px 20px; border-radius: 0 0 20px 20px;}
.invite_jieshao .tipbox .tip{width: 100%; background: linear-gradient( 80deg, #FFF3F3 0%, rgba(255,255,255,0) 100%); border-radius: 8px; display: flex; align-items: center; padding: 5px; box-sizing: border-box;}
.invite_jieshao .tipbox .left{display: flex; align-items: center; background: #fff; border-radius: 8px; flex-shrink: 0; padding: 3px;}
.invite_jieshao .tipbox .left i{width: 14px;}
.invite_jieshao .tipbox .left i img{width: 100%;}
.invite_jieshao .tipbox .left span{font-size: 12px; color: #88320D; padding: 0 3px;}
.invite_jieshao .tipbox .rightzi{font-size: 12px; color: #88320D; flex: 1; padding: 0 0 0 5px;}

.invite_jieshao .btnbox{width: 100%; background: #fff; box-sizing: border-box; padding: 10px 20px 20px 20px; border-radius: 0 0 20px 20px; display: flex; align-items: center; justify-content: space-between;}
.invite_jieshao .btnbox a{display: flex; align-items: center; font-size: 14px; color: #fff; padding: 0 20px; line-height: 38px; border-radius: 8px;}
.invite_jieshao .btnbox a:hover{opacity: .9;}
.invite_jieshao .btnbox a i{width: 18px; margin-right: 5px;}
.invite_jieshao .btnbox a i img{width: 100%;}
.invite_jieshao .btnbox .btn1{background: linear-gradient( 90deg, #0DCD64 0%, #0DCD64 100%);}
.invite_jieshao .btnbox .btn2{background: linear-gradient( 90deg, #FF8814 0%, #FF4757 100%);}

.invite_gzbox{width: 100%; background: #fff; border-radius: 20px; margin: 10px 0; padding: 0 0 10px 0; position: relative;}
.invite_gzbox:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 40px;
    background:url(../../images/invite/line2.png) no-repeat; 
    background-size: 100%;
    left: 30px;
    z-index: 100;
    top: -20px;    
}
.invite_gzbox:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 40px;
    background:url(../../images/invite/line2.png) no-repeat; 
    background-size: 100%;
    right: 30px;
    z-index: 100;
    top: -20px;    
}
.invite_gzbox .title{width: 100%;   padding: 20px 0 10px 0; display: flex; justify-content: center;}
.invite_gzbox .title span{font-size: 18px; color: #222; position: relative;}
.invite_gzbox .title span:after {
    content: "";
    position: absolute;
    width: 35px;
    height: 10px;
    background:url(../../images/invite/line3.svg) no-repeat; 
    background-size: 100%;
    left: -42px;
    z-index: 100;
    top: 5px;    
}
.invite_gzbox .title span:before {
    content: "";
    position: absolute;
    width: 35px;
    height: 10px;
    background:url(../../images/invite/line4.svg) no-repeat; 
    background-size: 100%;
    right: -42px;
    z-index: 100;
    top: 5px;    
}

.invite_gzbox .gzmain{width: 100%; padding: 0 5%; box-sizing: border-box; display: flex; flex-direction: column;}
.invite_gzbox .gzmain span{font-size: 14px; color: #333; font-weight: bold; line-height: 1.5;}
.invite_gzbox .gzmain small{font-size: 12px; color: #666; line-height: 1.5; padding: 0 0 10px 0;}


.invite_yq_list{width: 100%; padding: 0 5%; box-sizing: border-box;}
.invite_yq_list span{display: block; width: 100%; font-size: 15px; color: #333; line-height: 1.5; font-weight: bold;}
.invite_yq_list small{display: block; width: 100%; font-size: 13px; color: #888; line-height: 1.5; padding: 2px 0 0 0;}
.invite_yq_txt{width: 100%; display: flex; flex-direction: column; padding: 10px 0 0 0;}
.invite_yq_txt textarea{display: block; width: 100%; background: #fff; border: #ebebeb 1px solid; box-shadow: 0 3px 10px rgba(239, 239, 239, 0.9); font-size: 13px; color: #666; line-height: 1.5; border-radius: 8px; padding: 5px 10px;     height: 63px; word-wrap: break-word; box-sizing: border-box;}
.invite_yq_txt a{background: linear-gradient(90deg, #FF8814 0%, #FF4757 100%); box-shadow: 0 10px 20px 0 rgba(254, 141, 56, .2); border-radius: 8px; text-align: center; font-size: 14px; color: #fff; height: 40px; line-height: 40px; padding: 0 20px; margin: 10px 0 20px 0; display: flex; align-items: center; justify-content: center;}
.invite_yq_txt a:hover{opacity: .9; color: #fff;}
.invite_yq_txt a i{width: 14px; margin-right: 5px;}
.invite_yq_txt a i img{width: 100%;}

.invite_ul{width:100%; padding:15px 0; display: flex; align-items: center; justify-content: space-between;}
.invite_ul li{width:auto;}
.invite_ul li a{display: flex; flex-wrap:wrap; justify-content:center;}
.invite_ul li a i{width: 30px;}
.invite_ul li a em{font-size: 14px; color: #333; width: 100%; text-align: center; padding: 6px 0 0 0;}
.invite_ul li a:hover em{color:#ff472e;}


.invite_tan_renbox{width: 100%; min-height: 260px; max-height: 500px; padding: 0 50px; box-sizing: border-box; overflow: auto;}
.invite_tan_renbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 1px;
}
.invite_tan_renbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.invite_tan_renbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}
.invite_tan_renlist{width: 100%; display: flex; justify-content: space-between; align-items: center; margin: 25px 0;}
.invite_tan_ren{display: flex; align-items: center;  flex: 1; min-width: 0;}
.invite_tan_ren i{width: 40px; height: 40px; flex-shrink: 0;}
.invite_tan_ren i img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.invite_tan_ren span{font-size: 14px; color: #333; margin-left: 15px; flex: 1; min-width: 0;  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height: 24px; line-height: 24px;}
.invite_tan_fen{display: flex; align-items: baseline; flex-shrink: 0;}
.invite_tan_fen span{font-size: 14px; color: #666; padding: 0 0 0 3px;}
.invite_tan_fen small{font-size: 18px; color: #ff472e; font-weight: bold;}



/*拖拽验证*/
.verify-wrap{width:350px;height:48px;background-color:#F1F1F2;border:1px solid #F1F1F2;position:relative;    border-radius: 8px; box-sizing: border-box; margin-bottom:25px;}
.verify-wrap .drag-btn{position:absolute;left:-1px;top:-1px;width:48px;height:48px;background:#fff url(../../images/download1.jpg) no-repeat center center;background-size:100% 100%;z-index:2;cursor:move;box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, .1);border-radius: 4px;}
.verify-wrap .suc-drag-btn{width:50px;height:50px;background:#fff url(../../images/download2.jpg) no-repeat center center;background-size:100% 100%;}
.verify-wrap .drag-progress{position:absolute;left:0;top:-1px;height:48px;border-top:1px solid #7ac23c;border-top:1px solid #7ac23c;width:0;background-color:#7ac23c;color:#fff;font-size:14px;text-align:center;line-height:48px;border-radius: 8px 0 0 8px; box-sizing: border-box;}
.verify-wrap .fix-tips,.verify-msg{width:100%;position:absolute;right:0;left:1px;top: -1px;height:100%;color:#999;z-index:1;height:48px;line-height:48px;font-size:14px;text-align:center;border-radius: 8px; box-sizing: border-box;}
.verify-wrap .verify-msg{background-color:#7ac23c;color:#fff;display:none}

/* 切换账号 */
.switch_accountbox{width: 100%; padding: 20px 0 25px 30px; box-sizing: border-box;}
.switch_account_listbox{width: 100%; display: flex; flex-direction: column; grid-gap: 8px; padding: 0 30px 0 0; box-sizing: border-box; overflow: auto; max-height: 380px;}
.switch_account_listbox::-webkit-scrollbar { /*滚动条整体样式*/
  width : 6px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}
.switch_account_listbox::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 10px;
  background: #d1d1d1;
}
.switch_account_listbox::-webkit-scrollbar-track { /*滚动条里面轨道*/
  background: #ededed;
}

.switch_account_list{width: 100%; display: flex; align-items: center; cursor: pointer; border: 1px solid transparent; box-sizing: border-box; padding: 10px;}
.switch_account_list:hover{background: #fff; border: #eee 1px solid;     border-radius: 4px; box-shadow: 0px 10px 20px rgba(204, 204, 204, 0.15);}

.switch_account_list>i{width: 50px; height: 50px; flex-shrink: 0;}
.switch_account_list>i img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
.switch_account_list>em{width: 20px; height: 20px; background: url(../../images/del.svg) no-repeat; background-size: 100%; cursor: pointer;}
.switch_account_list>em:hover{background: url(../../images/del2.svg) no-repeat; background-size: 100%;}

.switch_account_name{display: flex; flex-wrap: wrap; padding: 0 30px 0 10px; flex: 1; min-width: 0; box-sizing: border-box;}
.switch_account_txt{display: flex; align-items: center; width: 100%;  padding: 3px 0 5px 0; gap:10px;}
.switch_account_txt>span{max-width: calc(100% - 100px); font-size: 15px; color: #222; font-weight: bold; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height: 24px; line-height: 24px;}
.switch_account_txt>i{width: 18px; flex-shrink: 0;}
.switch_account_txt>i img{width: 100%;}

.switch_account_id{width: 100%; display: flex; align-items: center;}
.switch_account_guo{display: flex; align-items: center; flex-shrink: 0;}
.switch_account_guo>i{width: 18px; margin-right: 5px; flex-shrink: 0;}
.switch_account_guo>i img{width: 100%; border-radius: 2px;}
.switch_account_guo>span{font-size: 14px; color: #333; }
.switch_account_id>small{font-size: 14px; color: #333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-left: 15px; height: 24px; line-height: 24px;}
.switch_account_eml{display: flex; align-items: center; margin-left: 15px; flex: 1; min-width: 0; }
.switch_account_eml>i{width: 18px; margin-right: 5px; flex-shrink: 0;}
.switch_account_eml>i img{width: 100%;}
.switch_account_eml>span{font-size: 14px; color: #333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height: 24px; line-height: 24px;}


.switch_account_tianjia{width: calc(100% - 30px); display: flex; align-items: center; border-top: #eee 1px solid; padding: 20px 0 0 0; cursor: pointer; margin: 25px 30px 0 0;}
.switch_account_tianjia>i{width: 50px; height: 50px; flex-shrink: 0; background: #fafafa; border: #f4f2ef 1px solid; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.switch_account_tianjia>i img{width: 20px;}
.switch_account_tianjia span{font-size: 14px; color: #333; padding: 0 0 0 10px;}
.switch_account_tianjia:hover i{background: #F8F9FD; border: #EFF1F6 1px solid; transition: .3s;}
.switch_account_tianjia:hover span{    color: #1673E8; transition: .3s;}

.switchlogin_content{width: 500px; padding: 0 60px 30px 60px; margin: 0 auto; box-sizing: border-box;}
.switchlogin_content h1{width: 100%; text-align: center; font-size: 24px; color: #222; padding:45px 0; }
.switchlogin_content .login_title{    padding: 30px 0;}
.switchlogin_content .login_title .hover:after{background: #fff;}

/* 新手指引 */
.xszy1,.xszy2,.xszy3{position:fixed; height:100%; width:100%; z-index:999; top:0; left:0;}
.xszy4,.xszy5{position:absolute; height:100%; width:100%; z-index:999; top:0; left:0;}

/* 遮罩层 - 始终显示 */
#mask_index{position:absolute; z-index:1; background: rgba(0, 0, 0, 0.7); top:0; left:0; width:100%; height:100%;}

.xszy_main{min-width:280px; max-width:360px; position:absolute; z-index:2; top:100px; left:240px;}

/* nav_box - 出现时有动画 */
.xszy_main .nav_box{width: 189px; position: absolute; top: 20px; left: -215px; opacity:0; transform: translateX(-15px);    transition: opacity 0.35s ease, transform 0.35s ease;}

.xszy1.show .nav_box,
.xszy2.show .nav_box,
.xszy3.show .nav_box{opacity:1; transform: translateX(0);}
/* 消失时 nav_box 无延迟，立即一起消失 */
.xszy1:not(.show) .nav_box,
.xszy2:not(.show) .nav_box,
.xszy3:not(.show) .nav_box{transition: opacity 0.3s ease, transform 0.3s ease;}
.xszy_main .nav_box .nav_survey_hover,
.xszy_main .nav_box .nav_game_hover,
.xszy_main .nav_box .nav_vote_hover{box-shadow:none;}

/* xszy_zibox - 出现时延迟 */
.xszy_zibox{width: 100%; background: #fff; border-radius:8px; box-shadow:0 1px 10px rgba(0,0,0,.4); padding:20px 12px 15px 25px; opacity:0; transform: scale(0.92) translateY(10px); transition: opacity 0.4s ease 0.35s, transform 0.4s cubic-bezier(0.34,1.56,0.64,1) 0.35s; box-sizing: border-box;}
.xszy_zibox:after{content: ""; position: absolute; top:55px; left:-20px; border:10px solid #fff; border-top-color:transparent; border-right-color:#fff;border-bottom-color:transparent; border-left-color:transparent;}

.xszy1.show .xszy_zibox,
.xszy2.show .xszy_zibox,
.xszy3.show .xszy_zibox,
.xszy4.show .xszy_zibox,
.xszy5.show .xszy_zibox{opacity:1; transform: scale(1) translateY(0);}
/* 消失时 zibox 无延迟，立即一起消失 */
.xszy1:not(.show) .xszy_zibox,
.xszy2:not(.show) .xszy_zibox,
.xszy3:not(.show) .xszy_zibox,
.xszy4:not(.show) .xszy_zibox,
.xszy5:not(.show) .xszy_zibox{transition: opacity 0.3s ease, transform 0.3s ease;}

.xszy_main .zi1{width:100%; display: flex; flex-direction: column;}
.xszy_main .zi1 b{width:100%; font-size:18px; color:#222; font-weight:bold; padding:0 0 8px 0; display: flex; align-items: center;}
.xszy_main .zi1 b i{width: 18px; margin-right: 5px;}
.xszy_main .zi1 b i img{width: 100%;}
.xszy_main .zi1 span{font-size:16px; color:#222; line-height:1.6;}
.xszy_main .zi1 span em{font-size:16px; color:#ff7b4d; font-weight: bold;}
.xszy_main .btnbox{width:100%; padding:15px 0 5px 0; display: flex; align-items: center; justify-content: space-between;}
.xszy_main .btnbox small{font-size: 14px; color: #999;}
.xszy_main .btnbox .btn{display: flex; align-items: center; gap:15px;}
.xszy_main .btnbox .zy_btn1{ padding: 0 20px; height: 34px; line-height: 34px; font-size: 14px; border-radius: 8px; box-sizing: border-box; transition: transform 0.2s ease, box-shadow 0.2s ease;}
.xszy_main .btnbox .zy_btn1:hover{transform: scale(1.05); box-shadow: 0 2px 8px rgba(0,0,0,.15);}
.xszy_main .btnbox .zy_btn1:active{transform: scale(0.97);}

#mask_index_top{position:absolute; z-index:1; background: rgba(0, 0, 0, 0.7); top:0; right:0; width:0; height:0;}
#mask_index_top::before{width:100%; height:100%; position:absolute;}

.xszy_main_top{min-width:280px; max-width:320px; position:absolute; z-index:2; left: auto; top:80px; right:137px;}

.xszy_main_top .xszy_zibox:after{content: ""; position: absolute; top:-20px; left:40px; border:10px solid #fff;border-top-color:transparent; border-right-color:transparent; border-bottom-color:#fff; border-left-color:transparent;}

.xszy_main .head_right{width: 97px; position: absolute; top: -50px; left:0px; opacity:0; transform: translateY(10px); transition: opacity 0.35s ease, transform 0.35s ease;}
.xszy4.show .head_right{opacity:1; transform: translateY(0);}

.xszy_main_right{top: 280px; right: 360px; left: auto;}
.xszy_main_right .xszy_zibox:after{content: ""; position: absolute; top:55px; right:-20px; left: auto; border:10px solid #fff;border-top-color:transparent; border-left-color:#fff; border-bottom-color:transparent; border-right-color:transparent;}

.xszy_main_right .points_activity_box{width: 289px; position: absolute; top: -44px; right:-346px;}
.xszy_main_right .points_activity_title .zi1 span{font-size: 18px;}


/*tan*/
.tan_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.6); z-index:998; top: 0; left: 0;}
.tanmain_box{width: 480px; margin-left: -240px; position: fixed; z-index: 99999; top: 0; left: 50%; background:#fff;  border-radius: 20px; padding: 20px; box-sizing: border-box;}

.tan_close{width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; position: absolute; top: 15px; right: 15px; z-index: 33;}
.tan_close:hover{background: #F7F9FD; border-radius: 50%;}

.tan_quanbox{background: url(../../images/tan/bg.png) no-repeat #fff; background-size: 100%; }
.tan_quanmain{width: 100%; padding: 10px 40px 0 40px; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: center;}
.tan_quanmain .toppic{width: 100px;}
.tan_quanmain .toppic img{width: 100%;}
.tan_quanmain .title1{width: 100%; font-size: 22px; color: #222; font-weight: bold; line-height: 1.5; text-align: center; padding: 15px 0 5px 0;}
.tan_quanmain .title2{width: 100%; font-size: 28px; color: #222; font-weight: bold; line-height: 1.5; text-align: center; padding: 10px 0 10px 0;}
.tan_quanmain .zi1{width: 100%; font-size: 16px; color: #666; line-height: 1.7; text-align: center;}
.tan_quanmain .zi1 em{font-size: 16px; color: #ff472e; font-weight: bold;}

.tan_quanmain .zi2{width: 100%; font-size: 15px; color: #666; line-height: 1.7; text-align: center;}

.tan_quan_btn{width: 100%; display: flex; justify-content: center; padding: 30px 0 0 0; flex-wrap: wrap;}
.tan_quan_btn .btn1{font-size: 16px; padding: 14px 60px; border-radius: 60px;}
.tan_quan_btn small{width: 100%; font-size: 14px; color: #999; text-align: center; padding: 20px 0 0 0;}
.tan_quan_btn .btn2{width: 100%; padding: 20px 0 0 0; text-align: center; }
.tan_quan_btn .btn2 a{font-size: 14px; color: #999; }
.tan_quan_btn .btn2 a:hover{text-decoration: underline;}

.tan_quannr{width: calc(100% - 80px); box-sizing: border-box; display: flex; align-items: center; background: #FFF6F6; border:#FFBBBB 1px solid; border-radius: 8px; padding: 15px 20px; margin: 20px auto;}
.tan_quannr i{width: 38px; flex-shrink: 0;}
.tan_quannr i img{width: 100%;}
.tan_quannr .quannr{flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 0 0 15px;}
.tan_quannr .quannr span{font-size: 18px; color: #FB5652; font-weight: bold;}
.tan_quannr .quannr small{font-size: 14px; color: #999; padding: 5px 0 0 0;}