@charset "utf-8";
/* CSS Document */

/*banner*/
.index_bannerbox{width: 100%; height: auto; position: relative; background: url(../../images/banner_bg.png) center #ff3407; margin-top: 60px;}
.index_bannerbox .main{width: 100%; }
.index_bannerbox .left{width: 100%; padding: .4rem 5% 0 5%; box-sizing: border-box;}
.index_bannerbox .left>h1{display: block; width: 100%; font-size: .53rem; color: #fff; font-weight: 500; line-height: 1.4; text-align: center;}
.index_bannerbox .left>h2{display: block; width: 100%; font-size: .28rem; color: #fff; font-weight: 400; padding: .1rem 0 .4rem 0; text-align: center;}

.index_bannerbox .left .btnbox{width: 100%; display: flex; align-items: center; gap:.2rem;}
.index_bannerbox .left .btnbox>a{display: inline-block;  font-size:.24rem; color: #fff; border-radius: 60px; padding: 0 .4rem; line-height: 48px;}
.index_bannerbox .left .btnbox .btn1{background: #101521;}
.index_bannerbox .left .btnbox .btn1:hover{background: #323948;}
.index_bannerbox .left .btnbox .btn2{background: url(../../images/download.svg) no-repeat .4rem center #EFEFF1; background-size: 14px; color: #222; text-indent: .3rem}
.index_bannerbox .left .btnbox .btn2:hover{background: url(../../images/download.svg) no-repeat .4rem center #fff; background-size: 14px;}

.index_bannerbox .banner_img{width: 100%;}
.index_bannerbox .banner_img img{width: 100%;}


.index_bannerbox .foot{width: 100%; background: #fff; padding: .3rem 5% .2rem 10%; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap:.2rem 0;}
.index_bannerbox .foot .zi{display: flex; flex-direction: column; width: 50%;}
.index_bannerbox .foot .zi>span{font-size: .26rem; color: #222; padding: 0 0 .05rem 0;}
.index_bannerbox .foot .zi>span>em{font-family: 'Din', sans-serif; font-size: .44rem;}
.index_bannerbox .foot .zi>small{font-size: .24rem; color: #666; }


/*index_surveybox*/
.index_surveybox{width: 100%; padding: .3rem 5%; box-sizing: border-box; }
.index_surveybox .title{width: 100%; display: flex; align-items: center; justify-content: space-between;}
.index_surveybox .title>span{font-size: .3rem; color: #222;}
.index_surveybox .title>a{font-size: .24rem; color: #1673e8;}

.index_surveybox .main{width: 100%; box-sizing: border-box; display: flex; justify-content: space-between; flex-wrap: wrap; gap: .2rem 0; padding-top: .2rem;}

.index_surveybox .survey_list{width: 48%;}
.index_surveybox .survey_pic{width: 100%; height: 88px; display: flex; position: relative;}
.index_surveybox .survey_pic>i{width: 100%; height: 88px;}
.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: .1rem .05rem;display: flex; flex-direction: column;}
.index_surveybox .survey_zi>small{width: 100%; font-size: .2rem; color: #666;}
.index_surveybox .survey_zi>span{width: 100%; font-size: .26rem; color: #222; padding: .05rem 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:.28rem; color:#ff472e; margin-right:.15rem; display: flex; align-items: center;}
.index_surveybox .survey_jf>span>i{width: 16px; margin: 0 .03rem 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:.3rem; color:#ff472e;     font-weight: 500;  font-family: Din;}
.index_surveybox .survey_jf>span>p>em{font-size:.2rem; color: #FB5652; margin-left: .02rem;}
.index_surveybox .survey_jf>small{font-size:.2rem; color:#666; display: flex; align-items: center;}
.index_surveybox .survey_jf>small>i{width: 16px; margin: 0 .03rem 0 0;}
.index_surveybox .survey_jf>small>i img{width: 100%;}

/*index_jieshao*/
.index_jieshao{width: 100%;}
.index_jieshao .left{width: 100%; background-color: #E6F8FE; display: flex; justify-content: center; align-items: end; flex-direction: column; padding: .3rem 0;}
.index_jieshao .right{width: 100%; background-color: #EAFBF1; display: flex; justify-content: center; align-items: flex-start; flex-direction: column; padding: 40px 0;}
.index_jieshao .jieshao_img{width: 100%; display: flex; justify-content: center; padding: 0 0 .3rem 0;}
.index_jieshao .jieshao_img img{width: 80%;}
.index_jieshao .jieshao_zi1{width: 100%; font-size: .34rem; color: #222; line-height: 1.5; text-align: center; padding: 0 5% .1rem 5%; box-sizing: border-box;}
.index_jieshao .jieshao_zi2{width: 100%; font-size: .26rem; color: #666; line-height: 1.5; text-align: center; padding: 0 5% 0 5%; box-sizing: border-box;}
.index_jieshao .jieshao_aa{width: 100%; padding: 0 5%; box-sizing: border-box; text-align: center;}
.index_jieshao .jieshao_aa a{display: inline-block; background: #1e1f23; font-size:.24rem; color: #fff; border-radius: 60px; padding: 0 .6rem; line-height: 46px; margin: .4rem auto 0 auto;}
.index_jieshao .jieshao_aa a:hover{background: #323948;}

/*index_liuchengbox*/
.index_liuchengbox{width: 100%; margin: 0 auto; padding: .4rem 0 0 0;}
.index_liuchengbox>h2{display: block; width: 100%; font-size: .36rem; color: #222; font-weight: 500; text-align: center; padding: .2rem 0 .3rem 0;}

.index_liucheng{width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.index_liucheng .list{display: flex; align-items: center; justify-content: center; flex-direction: column; }


.index_liucheng .list>i{width: 100px;}
.index_liucheng .list>i img{width: 100%;}
.index_liucheng .list>span{font-size: .32rem; color: #222; padding: .1rem 0;}
.index_liucheng .list>small{font-size: .24rem; color: #666;}
.index_liucheng .list>em{font-size: .4rem; color: #dbdbe7; font-family: Din; font-weight: 500; padding: .1rem 0 0 0;}

/*foot*/
.foot_login{width: 100%; height: auto;  background: url(../../../images/index/foot_login.png) center top;}
.foot_login .main{width: 100%; height: auto; padding: 0 8%; box-sizing: border-box; display: flex; align-items: flex-start;  flex-direction: column;}
.foot_login .left{width: 100%; display: flex; flex-direction: column; padding: 120px 0 0 0; box-sizing: border-box;}
.foot_login .left>span{font-size: .38rem; color: #222;}
.foot_login .left>small{font-size: .24rem; color: #222; line-height: 1.5; padding: .2rem 0 0 0;}
.foot_login .main>a{font-size:.24rem; color: #fff; border-radius: 60px; padding: 0 .6rem; line-height: 46px; margin: .3rem 0 .5rem 0;}


.foot_box{width: 100%; border-top: #eee 1px solid; padding: 0 5%; box-sizing: border-box;}

.foot_box .left{width: 100%; display: flex; flex-direction: column; padding: .4rem 0;}
.foot_box .left>i{width: auto; padding: 0 0 .15rem 0;}
.foot_box .left>span{font-size: .22rem; color: #222; line-height: 1.6;}
.foot_box .left>span a{display: inline-block; font-size: .22rem; color: #1e81cd;}
.foot_box .left>span a:hover{color: #ed4731; text-decoration: underline;}

.foot_box .ewm_box{width: 100%; display: flex; flex-direction: column; padding: .1rem 0 0 0; gap:.2rem;}
.foot_box .ewm{width: 100%; display: flex; align-items: center;}
.foot_box .ewm>i{width: 60px; flex-shrink: 0;}
.foot_box .ewm>i img{width: 100%; height: 100%;}
.foot_box .ewm>p{display: flex; flex-direction: column; padding: 0 0 0 .15rem; flex: 1;}
.foot_box .ewm>p span{font-size: .24rem; color: #666;}
.foot_box .ewm>p small{font-size: .2rem; color: #999; line-height: 1.5; padding: .1rem 0 0 0;}


/*main survey*/
.mainbox{width: 100%; padding: 60px 3% 0 3%; box-sizing: border-box;}
.main_title{width: 100%; flex-direction: column; display: flex; padding: .3rem 0 0 0;}
.main_title span{width: 100%; font-size: .34rem; font-weight: bold;}
.main_title small{width: 100%; font-size: .24rem; color: #555; line-height: 1.5; padding: .1rem 0 0 0;}

.mainbox .index_surveybox{ padding:0; }
.mainbox .index_surveybox .survey_list{box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px;     background: #fff;}
.mainbox .index_surveybox .survey_zi{    padding: .1rem .2rem;}

/*game*/
.gamebox .survey_pic{position: relative;}
.gamebox .game_biao{position: absolute; top: 5px; left: 5px; padding: 4px 6px; background-color: rgba(0, 0, 0, .6); border-radius:20px;}
.gamebox .survey_zi>small{overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.gamebox .survey_jf{padding: .1rem 0 0 0;}


.game_tan_bgbg{ position: fixed; height: 100%; width: 100%;  background: rgba(0,0,0,0.6); z-index:998; top: 0; left: 0;}
.game_tanmainbox{width: 90%; background: #fff; position: fixed; z-index: 999; box-sizing: border-box; border-radius: 8px; top: 0; left: 5%;}

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


.game_tanbox{width: 100%;  padding:0; box-sizing: border-box; border-radius: 8px;}

.game_zi{width:100%; padding: 0 8%; box-sizing: border-box; display: flex; flex-direction: column;}
.game_zi h2{ width:100%; text-align:center; font-size:.44rem; color:#333; padding:.5rem 0 .15rem 0;}
.game_zi h2 em{font-size:.42rem; color:#FE8A34;}
.game_zi h3{width:100%; text-align:center; font-size:.24rem; color:#666; line-height:1.6;}

.game_ewm{width:100%; padding: 0 5%; box-sizing: border-box; display: flex; flex-direction: column;}
.game_ewm em{width: 100%;}
.game_ewm em img{width: 100%;}
.game_ewm i{display:block; width:2rem; margin:0 auto;}
.game_ewm i img{width: 100%;}
.game_ewm small{display:block; width:100%; text-align:center; font-size:.22rem; color:#666; padding:0 0 .4rem 0;}







/*about*/
.about_box{width: 100%; background: linear-gradient(178deg, #f3f6fb 0%, #FFFFFF 300px); padding: 60px 3% 0 3%; box-sizing: border-box;}
.about_nr{width: 100%; padding: .2rem 0 0 0;}
.about_left{width: 100%; display: flex;  gap:.15rem;}
.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; text-align: center;}
.about_left .hover,.about_left a:hover{background:#ebf4fe;  border: #e0efff 1px solid; color: #222;}

.about_right{width: 100%; background: #fff; border: 1px solid #eee; box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, .06); border-radius: 8px; padding: .3rem; box-sizing: border-box; margin-top: .2rem;}
.about_right .title{ padding: 0 0 .4rem 0; }
.about_right .title span{position: relative; font-size: .36rem; color: #1673e8; font-weight: bold;}
.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 .185rem 0;}
.about_right .zi1 span{width: 100%; font-size: .3rem; color: #333; font-weight: bold; padding: 0 0 .1rem 0;}
.about_right .zi1 small{width: 100%; font-size: .24rem; color: #444; line-height: 1.7;}


.contact_box{width: 100%;}
.contact_box .contact_leftzi{width: 100%; padding: 0 0 .3rem 0; font-size: .24rem; color: #222; line-height: 1.7;}

.contact_box .contact_right{width: 100%;}
.contact_box .contact_right .list{width: 100%; padding: 0 0 .15rem 0;}
.contact_box .contact_right .list input{width: 100%; height: 48px; line-height: 48px; padding: 0 .05rem 0 .1rem; box-sizing: border-box; background: #fff; border: #eee 1px solid; border-radius:8px; font-size: .24rem; 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: .05rem .05rem .05rem .1rem; box-sizing: border-box; background: #fff; border: #eee 1px solid; border-radius:8px; font-size: .24rem; 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; padding: 0 0 .2rem 0;}
.contact_box .contact_right .btn a{width: 100%; height: 48px; line-height: 48px; font-size: .24rem; 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%;}

/*拖拽验证*/
.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}


/*m_custom_box*/
.m_custom_box{width: 100%; box-sizing: border-box; padding: .5rem 5%; font-size: .24rem; line-height: 1.5; color: #222;}
.m_custom_box span{font-size: .24rem; color: #222;}
.m_custom_box p{font-size: .24rem; color: #222;}