@charset "utf-8";

.newwrap{width: 700px;position: absolute;left:50%;margin-left: -580px;}
.bs4,.bs5,.bsx{color:#fff; display:block;border-radius: 8px;width: 284px;height: 58px;text-align: center;align-items: center;line-height: 26px;padding-top: 10px; }
.bs4{background-image: linear-gradient(90deg, #9BCE5B 0%, #5BCE66 100%);border: 1px solid rgba(255,255,255,0.36);box-shadow: 0 4px 10px 0 rgba(19,167,33,0.30);}
.bs4:hover{background: #A3DE59;border: 1px solid rgba(255,255,255,0.40);box-shadow: 0 4px 10px 0 rgba(95,167,19,0.60);}
.bs5{background-image: linear-gradient(90deg, #14B9FF 0%, #159AFF 100%);border: 1px solid rgba(255,255,255,0.36);box-shadow: 0 4px 10px 0 rgba(19,131,214,0.30);}
.bs5:hover{background: #3CC5FF;	border: 1px solid rgba(255,255,255,0.40);	box-shadow: 0 4px 10px 0 rgba(19,139,214,0.60);}
.bsx{border: 1px solid rgba(255,255,255,0.36);}
.bsx:hover{border: 1px solid #159AFF;}
.new_download_box{display:flex;    justify-content: center;  padding: 0 20px;gap: 24px;}
.bs4 i,.bs5 i,.bsx i{ font-style: normal;}
.bs4 p,.bs5 p,.bsx p{font-size: 24px;}
.bs4 i,.bs5 i,.bsx i{font-size: 12px;}
.bsx i {color:rgba(255,255,255,0.4)}
.index_download_package{margin: 32px auto;padding-left: 0;width: 520px;display: flex;justify-content: space-between;}
.index_download_package a{margin-right: 0;height: 20px;}
.newline{background-image: linear-gradient(90deg, #1499FF 0%, #EE071A 100%);border-radius: 2px;height: 4px;margin: 0 auto 14px;}
h2{border:none;padding-bottom: 14px;margin-bottom: 0;}
.index_animate{width: 500px;}
.new_propertybox{margin:0 auto 80px;width:1200px}
.new_property img{width:492px;height:400px}
.new_property{display:flex; justify-content: space-around; color: #2B416C; align-items: center;margin-bottom: 40px;}
.new_property div{flex:1}
.new_property p{font-size: 18px;line-height: 26px;color: #566889;flex:1;padding-right:20px}
.new_property p span{font-size: 28px;display: block;margin-bottom: 22px;color: #2B416C;font-weight: bold;}
.new_config{width: 100%;background: #20243A; color:#fff;font-size: 18px;}
.config_list img{width: 50px;height: 50px;}
.new_propertybox h1{font-size: 40px;text-align: center;color: #2B416C;margin: 44px 0 40px;line-height: 40px;font-weight: bold;}
h1.config{color: #fff;text-align: left;margin: 8px 0 20px;font-size: 40px;font-weight: bold;}
.config_list{display:flex;font-size: 18px;margin: 80px 0;}
.config_list p{display: flex;flex-direction: column;margin-right: 80px;font-size: 16px;line-height: 20px;width: 180px;}
.config_list p span{font-size: 18px;display: block;margin: 24px 0 10px;font-weight: bold;}
.congig_des{font-size: 18px;line-height: 24px;}
.tention span{color: #DF4B38;font-size: 18px;}
.tention{font-size: 18px;}
.tention b{display:none;color:#DF4B38;text-align:center;font-size: 18px;font-weight: normal;}
h1.new_video{line-height: 60px;margin-bottom: 56px;margin-top: 80px;}
.videobox{width: 1000px;margin: 0 auto;text-align: center;position: relative;}
.videobox .shadow{width: 100%;}
.videobox div{background: #F0EFF2; color: #ABAEBD; text-align: center;width: 1000px;height: 648px;display: flex;align-items:center;justify-content: center;}
.videobox iframe{position: absolute;z-index: 10;left: 0;top:0}
.videobox p span{font-size: 20px ;margin-top:10px;display: block;}

/******************************************************************keymaping********************************************************************************* */
.keyboard{margin-bottom: 20px;}
.scale_notice{color: #677A8F;    line-height: 26px; margin: 30px 0;}
.scale_notice span{color: #e04a39;}
.new_script ul li p:first-child{width: 18%;}
.new_script ul li p:nth-child(2){width: 32%;float: left;color: #FFF;}
.feature_key a{color: #0091FF;padding: 20px 0;display: block;}
.keymap_topbg{background:#010103 url("../images/keymaping/keymapbg.jpg") center bottom no-repeat;}
.moba_topbg{background:#010103 url("../images/feature/mobabg.jpg") center bottom no-repeat;}
.shooting_topbg{background:#010103 url("../images/feature/shootingbg.jpg") center bottom no-repeat;}
.script_topbg{background:#010103 url("../images/feature/scriptbg.jpg") center bottom no-repeat;}
.duokai_topbg{background:#010103 url("../images/feature/duokaibg.jpg") center bottom no-repeat;}
.duokai_synchro_topbg{background:#010103 url("../images/feature/duokai_syncbg.jpg") center bottom no-repeat;}
.fps_topbg{background:#010103 url("../images/feature/duokai_fpsbg.jpg") center bottom no-repeat;}
.graphic_topbg{background:#010103 url("../images/feature/graphic_bg.jpg") center bottom no-repeat;}

.feature_top{ padding: 125px 0 50px;height:505px;}
/*.moba_top{ padding: 170px 0 136px;}*/
.feature_top img{margin-right: -270px;}
.feature_sec_con3{width:1200px ;margin: 0 auto;position: relative;margin-top:50px;}
.feature_stepbox{margin-bottom: 50px;}
.feature_titbox{width: 600px;}
.feature_phone{position: relative;display: none;}
.feature_play{text-align: center;line-height: 240px; width: 90px;height: 90px;position: absolute;top:220px;left:920px; background: url(../images/keymaping/icon/keymap_play1.svg) 0 0 no-repeat; cursor: pointer;color: #fff;font-size: 22px;}
.feature_phone_play{text-align: center;line-height: 230px; color: #fff;font-size: 20px;width: 90px;height: 90px;position: absolute;top:50%;margin-top:-45px;left:50%;margin-left: -45px; background: url(../images/keymaping/icon/keymap_play.svg) 0 0 no-repeat; cursor: pointer;}
.feature_play:hover{ width: 90px;height: 90px;cursor: pointer;}
.feature_phone_play:hover{ width: 90px;height: 90px;cursor: pointer;}
.feature_play.duokai_sync{top:149px;}
.feature_play.keymap{top:178px;}
.feature_play.shooting{top:168px;}
.feature_play.moba{top:122px;}
.feature_play.duokai{top:196px;}
.feature_play.script{top:136px;}
.feature_play.fps{top:184px;}
.feature_play.graphic{top:115px;}

.pop_videobox{display: none; width: 100%;height: 100%;background: rgba(35,51,76,.9);position: fixed;z-index: 400;top:0;left:0}
.pop_videobox iframe,.pop_videobox p{position: absolute;top:50%;left: 50%;margin-left: -500px;margin-top: -324px;}
.pop_videobox iframe{z-index: 20;}
.pop_videobox p{background: #F0EFF2;  color: #ABAEBD; text-align: center; width: 1000px; height: 648px; display: flex; align-items: center; justify-content: center;z-index: 19;flex-direction: column;}
.pop_videobox p span{font-size: 20px;margin-top: 20px; }
.closepop{position: absolute;right:50px;top:50px;background: url(../images/keymaping/icon/close.svg) 0 0 no-repeat;width: 24px;height:24px ;}
.feature_key ul li p:first-child{width: 36%;}

.attention{color: #677A8F;}
.attention span{color: #e04a39;}
.p_40 p:first-child{ width: 40% !important;}









@media screen and (max-width: 1219px)  { 
    .newwrap{position: static;margin: 0 auto;}
    .new_propertybox{width: auto;margin: 0 20px 80px;}
    .new_property img{width:416px;height:338px;margin-right: 20px;}
    .configbox{width:auto;margin: 0 60px;}
    .videobox,.videobox iframe,.videobox div{width: 100%;}
    .xuanzhuan,.feature_play{display: none;}
    .feature_sec_con3{width: auto;margin-top:0;}
    .feature_phone{display: block;}
    .feature_video_pic{width: 100%;}
    .keymap_topbg,.moba_topbg,.shooting_topbg,.script_topbg,.duokai_topbg,.duokai_synchro_topbg,.fps_topbg,.graphic_topbg{background: #010103;}
    .feature_titbox{margin: 0 20px;width: auto;}
    .feature_top{ padding: 121px 0 0;height:auto;}
}
@media screen and (max-width: 1000px)  { 
    .configbox{width:600px;text-align: center; margin: 0 auto;}
    h1.config{text-align: center;}
    .congig_des{line-height: 26px;}
    .config_list p{flex: 0 0 44%;text-align: center;margin-right: 0;margin-bottom: 40px;}
    .tention b{display:block}
    .tention span{display:none}
    .config_list{width: 560px; margin: 80px auto;flex-wrap: wrap;justify-content: space-between;}
    .configbox img{margin: 0 auto;}
    .new_propertybox h1{line-height: 60px;}
    .feature_top{ padding: 121px 0 0;height:auto;}
    .feature_sec_con3{margin-top:0;}
}
@media screen and (max-width: 860px)  { 
    .new_propertybox  p{order: 1;}
    .new_propertybox  img{order: 0;}
    .new_property{text-align: center;flex-direction: column;}
    .new_property img{width:90%;height:auto;}
    .new_property p{margin:20px 0 30px;}
    .new_property h1{margin: 24px 0 30px;}
    .new_property{margin-bottom: 0;}
    .new_propertybox{margin: 0 20px 18px;}
    .congig_des{font-size: 16px;}
    .new_config {padding: 60px 0;}
    .config_list{margin: 60px 0 20px;}
    h1.new_video{margin-top: 50px;}
    .feature_top{ padding: 121px 0 0;height:auto;}
    .feature_sec_con3{margin-top:0;}
}
@media screen and (max-width: 750px)  { 
    .newwrap{width: auto;margin-bottom: 70px;}
    .feature_key ul li p:nth-child(2),.feature_key ul li p:first-child{float:none;width: auto;}
    .closepop{top:75%;left:50%;margin-left:-12px ;}
    .feature_stepbox {  margin-bottom: 0;  }
    .feature_top{ padding: 121px 0 0;height:auto;}
    .feature_sec_con3{margin-top:0;}
}
@media screen and (max-width: 700px)  { 
    .bs4{display: none;}
    .bs5{margin: 0 auto;width: 80%;}
    .index_download_package{width: 320px;margin:32px auto 70px;flex-wrap: wrap;justify-content: space-around;}
    .index_download_package a{line-height: 14px;width: 45%;}
    .index_download_package a{font-size: 14px;}
    .index_download_package a:nth-child(1){order: 0;width: 120px;margin-bottom: 12px;}
    .index_download_package a:nth-child(2){order: 2;width: 170px;}
    .index_download_package a:nth-child(3){order: 1;width: 150px;height: 20px;}
    .videobox p img{width: 50%;}
    .feature_top{ padding: 121px 0 0;height:auto;}
    .feature_sec_con3{margin-top:0;}

}
@media screen and (max-width: 624px)  { 
    .new_property{margin:0 20px}
    .new_property img{width:70%;}
    .configbox,.index_animate{width:auto;margin: 0 20px;}
    .config_list{display: inherit;width: auto;}
    .new_propertybox h1{line-height: 40px;font-size: 26px;}
    .newwrap h2{font-size: 20px;}
    .config_list p{display:inherit;margin: 0 auto 40px;}
    h1.config{font-size: 26px;}
    .new_propertybox p span{font-size: 22px;}
    .new_propertybox p,.tention{font-size: 16px;}
    h1.new_video{line-height: 40px;margin-bottom: 40px;}
    .feature_top{ padding: 121px 0 0;height:auto;}
    .feature_sec_con3{margin-top:0;}
}

@media screen and (max-width: 500px)  { 
    .feature_phone_play,.feature_phone_play:hover{width: 20%;background-size: 90%;line-height: 210px;font-size: 16px;}
    .feature_sec_con3{margin-top:0;}
}