*{padding: 0;margin: 0}
.header{background: #3366FF}
.common_width{width:1000px;margin: 0 auto;}
.head_nav{width:1000px;height: 60px;line-height: 60px;position: absolute;top: 0;left: 50%;margin-left: -500px;z-index: 6;}
.logoimg{height: 40px;display: inline-block;vertical-align: middle;}
.dowload_group{float: right;margin-top: 11px;}
.dowload_btn{height: 38px;width:134px;background: #3366FF;border: 1px solid #FFFFFF;border-radius: 4px;display: flex;align-items: center;justify-content: center;font-size: 18px;color: #fff;float: left;margin: 0 10px;}
.dowload_btn:last-child img{max-height: 28px;vertical-align: sub;}
.modal-box{width: 100vw;height: 100vh;background: rgba(0, 0, 0, .5);position: fixed;top: 0;left: 0;z-index: 9;display: none;}
.modal-panel{width: 400px;height: 400px;border-radius: 4px;background: #fff;position: absolute;left: 50%;top: 50%;margin-left:-300px;margin-top: -210px;}
.modal-header{height: 46px;line-height: 46px;width: 100%;padding: 0 15px;box-sizing: border-box;text-align: right;}
.modal-header img{height: 20px;cursor: pointer;}
.modal-header img:hover{background: #eee;}
.modal-body{height: calc(100% - 46px);box-sizing: border-box;padding: 20px;padding-top:0px;text-align: center;font-size: 16px;}
.modal-body img{height: 70%;}
.tips{height: 40px;line-height: 40px;}

.main{color: #434343;font-size: 16px;}
.font_small{font-size: 14px}
.font_medium{font-size: 18px}
.font_big{font-size: 24px}
/* .codestyle{cursor: pointer;float: left;max-height: 38px;} */
.weight{font-weight: bold;}
.textitem{height: 26px;line-height: 26px;text-align: center;}
.padding_20{padding: 20px 0}
.titlebefor:before{display: inline-block;content: '';width:70px;height: 6px;background: #ccc;border-radius: 3px;float: left;margin-left: 50%;transform: translateX(-35px);margin-top: 10px}
.limitview{overflow: hidden;width: 100%;margin-top:40px;}
.btn_pack{border: 1px solid #e5e4e2;border-radius: 8px;width:230px;height: 84px;background: #fff;text-align: center;float: left;margin: 10px;box-sizing: border-box;}
.btn_pack .textitem{height: 40px;line-height: 40px}
.pointer{cursor: pointer;}
.backgrey{background: #f8f8f8;padding: 20px 0;}
.mod_pack{float:left;width: 16%;}
.mod_item{width:95px;height: 99px;display: flex;align-items: center;justify-content: center;margin: 10px auto;box-shadow: 4px 9px 10px 0px rgba(0, 0, 0, 0.2);border-radius: 19px;}
.mod_pack:nth-child(1) .mod_item{background: #2C8CF0;}
.mod_pack:nth-child(2) .mod_item{background: #FEA307;}
.mod_pack:nth-child(3) .mod_item{background: #40AA7B;}
.mod_pack:nth-child(4) .mod_item{background: #ED433F;}
.mod_pack:nth-child(5) .mod_item{background: #CC2686;}
.mod_pack:nth-child(6) .mod_item{background: #8742DF;}
.mod_pack:nth-child(7) .mod_item{background: #CC2686;}
.mod_pack:nth-child(8) .mod_item{background: #8742DF;}
.mod_pack:nth-child(9) .mod_item{background: #FEA307;}
.mod_pack:nth-child(10) .mod_item{background: #8742DF;}
.mod_pack:nth-child(11) .mod_item{background: #40AA7B;}
.mod_pack:nth-child(12) .mod_item{background: #ED433F;}
.mod_pack p{text-align: center;}
.more{text-align: center;margin: 15px 0;}
.imgpack{margin: 40px 0;}
.footer{color: #fff;font-size: 18px;height: 144px;background: #1B1B1B;box-sizing: border-box;}
.footer .textitem{height: 36px;line-height: 30px;}
.footer a{color: #fff;text-decoration: none;}

.swiper-container { z-index: 1;}
.swiper-slide { background-position: 50% 0;}
.swiper-slide a { display: block;}

.swiper-pagination-bullet { width: 6px; height: 6px; border-width: 1px; border-style: solid; opacity: 1;}

.gray .swiper-pagination-bullet { border-color: #666; background-color: #666;}
.gray .swiper-pagination-bullet-active { background-color: transparent;}

.white .swiper-pagination-bullet { border-color: #fff; background-color: #fff;}
.white .swiper-pagination-bullet-active { background-color: transparent;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom:0px!important}
.swiper-pagination-bullet{width:40px!important;border-radius: 0!important;background: rgba(0, 0, 0, .8)!important;border: none!important;}
.swiper-pagination-bullet-active{background: #fff!important;}
#wechat-mask {position:absolute; left: 0; top: 0; z-index: 999; background-color: #1B1B1B; filter: opacity(0.8); width: 100%; height: 100%; display: none;}
#wechat-mask-img {background: url('../image/live_weixin.png') no-repeat no-repeat; background-size: 80%; position: absolute; left: 10%; top: 5%; width: 100%; height: 100%; z-index: 1000; display: none;}

@media screen and (max-width: 1000px){
    .font_small{font-size: 11px}
    .font_medium{font-size: 12px}
    .font_big{font-size: 14px}
    .common_width{width: 100%;}
    .head_nav{width: 100%;left: 0;margin-left: 0;height: 40px;line-height: 40px}
    .dowload_group{margin: 0 auto;}
    .head_nav .logoimg{height: auto;width: 32%;}
    .dowload_group{width:66%;margin-top:6px}
    .dowload_btn{height:30px;width:48%;font-size: 14px;margin: 0;}
    .dowload_btn img{height: 14px;}
    .dowload_btn:last-child img{height: 18px;}
    .btn_pack{width: calc(50% - 16px);margin: 6px 8px;}
    .mod_pack{width:48%}
    .imgpack img{width: 100%;}
    .swiper-slide img{width: 100%}
    .textitem{height: 22px;line-height: 22px;}
    .common_width .titlebefor:before{margin-top: 25px}
    .mobile_before:before{margin-top:10px!important;}
    .footer{height: auto}
    .footer .textitem{line-height: 30px;height: auto}
    .swiper-container{padding-top:20px!important;}
    .modal-panel{width: 100%;left: 0;margin-left:0;}
}