*{
    padding: 0;
    margin: 0;
}

img{
    border: none;
}
.layout{
    width: 1200px;
    margin: 0 auto;
}
.clearfix:after{
    content: '';
    display: block;
    clear: both;
}
.floatL{
    float: left;
}
.floatR{
    float: right;
}
ul{
    list-style: none;
}
a{
    text-decoration: none;
}
.icons{
    background: url("https://resource.bear20.com/bear_download/images/indexIcons.png") no-repeat;
}

/* 轮播 */
.swiperWrap{
    width: 100%;
    background: #f8fafc;
    overflow: hidden;
}
.swiperWrap .layout{
    position: relative;
    overflow: hidden;
    margin-top: 25px;
}
.swiperWrap .prev,.swiperWrap .next{
    width: 36px;
    height: 36px;
    background: #e7e8ea;
    border-radius: 50%;
    cursor: pointer;
    z-index: 999;
}
.swiperWrap .prev:hover,.swiperWrap .next:hover{
    background: #cccfd2;
}
.swiperWrap .prev{
    position: absolute;
    top: 50%;
    margin-top: -18px;
    left: 20px;
    z-index: 999;
}
.swiperWrap .next{
    position: absolute;
    top: 50%;
    margin-top: -18px;
    right: 20px;
}
.swiperWrap .prev .previcon{
    display: inline-block;
    width: 5px;
    height: 9px;
    background-position: -32px -4px;
    position: absolute;
    left: 16px;
    top: 50%;
    margin-top: -4.5px;
}
.swiperWrap .next .nexticon{
    display: inline-block;
    width: 5px;
    height: 9px;
    background-position: -41px -4px;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -4.5px;
}
.swiperWrap ul {
    width: 2400px;
    height: 410px;
}
.swiperWrap ul li{
    width: 1200px;
    float: left;
}
.swiperWrap ul li a{
    display: block;
}
.swiperWrap ul li img{
    display: block;
    width: 1200px;
    height: 410px;
}
.swiperWrap .pagination{
    width: 50%;
    position: absolute;
    bottom: 0px;
    left: 25%;
    text-align: center;
    z-index: 999;
}
.swiperWrap .pagination span{
    display: inline-block;
    width: 30px;
    height: 2px;
    background: #f1f2f4;
    margin: 0px 4px;
}
.swiperWrap .pagination span.active{
    background: #cccfd5;
}
/* 精品软件 */
.BoutiqueSoft{
    width: 100%;
    background:#f8fafc;
    overflow: hidden;
    padding-bottom: 20px;
}
.BoutiqueSoft .layout{
    margin-top: 40px;
}
.BoutiqueSoft .title .floatL span.icons{
    width: 25px;
    height: 25px;
    display: inline-block;
    background-position: -53px -1px;
    vertical-align: middle;
}
.BoutiqueSoft .title .floatL span.icons:hover{
    /* transform: rotateZ(360deg); */
    transition: transform .5s ease-in-out 0s;
    -webkit-transition: transform .5s ease-in-out 0s;
}
.BoutiqueSoft .title .floatL h2{
    display: inline;
    color: #3c4248;
    font-size: 27px;
    font-weight: 400;
    vertical-align: middle;
    margin-left: 5px;
}
.BoutiqueSoft .title .floatL ul{
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
}
.BoutiqueSoft .title .floatL ul li{
    float: left;
    font-size: 17px;
    color: #a3a3a3;
    cursor: pointer;
    margin-left: 25px;
}
.BoutiqueSoft .title .floatL ul li:hover{
    color: #5c97ff;
}
.BoutiqueSoft .title .floatL ul li.active{
    color: #5c97ff;
}
.BoutiqueSoft .title .floatR a{
    font-size: 17px;
    color: #a3a3a3;
}
.BoutiqueSoft .title .floatR span{
    display: inline-block;
    width: 8px;
    height: 13px;
    background-position: -309px -38px;
    margin-left: 7px;
}
.BoutiqueSoft .title .floatR{
    margin-top: 5px;
}
.BoutiqueSoft .title .floatR a:hover{
    color: #5c97ff;
}
.BoutiqueSoft .title .floatR a:hover span{
    background-position: -295px -38px;
}
.BoutiqueSoft .SoftList{
    padding-top: 15px;
    padding-bottom: 20px;
}
.BoutiqueSoft .SoftList ul{
    display: none;
}
.BoutiqueSoft .SoftList ul:nth-child(1){
    display: block;
}
.BoutiqueSoft .SoftList ul li{
    width: 223px;
    height: 298px;
    border: 1px solid #f2f3f4;
    background: #fff;
    margin-top: 22px;
    border-radius: 5px;
    margin-right: 18px;
    transition: transform .3s ease-in-out,translateY .3s ease-in-out,box-shadow .3s ease-in-out;
    overflow: hidden;
}
.BoutiqueSoft .SoftList ul li:nth-child(5n){
    margin-right: 0px;
}
.BoutiqueSoft .SoftList ul li a{
    height: 298px;
    display: block;
    padding: 0px 24px 0px 27px;
}
.BoutiqueSoft .SoftList ul li img{
    width: 63px;
    height: 63px;
    margin-top: 29px;
    border-radius: 10px;
    transition: transform .3s ease-in-out,translateY .3s ease-in-out;
}
.BoutiqueSoft .SoftList ul li h3{
    font-size: 20px;
    color: #24292f;
    font-weight: 500;
    margin-top: 20px;
    width: 172px;
    white-space: nowrap;
    overflow: hidden;
}
.BoutiqueSoft .SoftList ul li p.describe{
    font-size: 16px;
    color: #aaaaaa;
    line-height: 24px;
    text-align: justify;
    margin-top: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 48px;
}
.BoutiqueSoft .SoftList ul li .detail{
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
}
.detail span{
    color: #aaaaaa;
    font-size: 13px;
    /* margin-right: 14px; */
}
.detail i.download{
    display: inline-block;
    width: 11px;
    height: 11px;
    background-position: -82px -4px;
    margin-right: 4px;
}
.detail i.comment{
    display: inline-block;
    width: 13px;
    height: 11px;
    background-position: -98px -4px;
    margin-right: 4px;
}
.detail i.time{
    display: inline-block;
    width: 11px;
    height: 11px;
    background-position: -118px -4px;
    margin-right: 4px;
}
.BoutiqueSoft .SoftList ul li span.jt{
    display: block;
    width: 38px;
    height: 10px;
    background-position: -135px -5px;
    margin-top: 25px;
}
.BoutiqueSoft .SoftList ul li:hover{
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgb(84 81 81 / 15%);
    z-index: 1;
}
.BoutiqueSoft .SoftList ul li:hover h3{
    color: #3e8dff;
}
.BoutiqueSoft .SoftList ul li:hover span.jt{
    background-position: -177px -5px;
}
.BoutiqueSoft .SoftList ul li:hover img{
    transform: scale(1.1);
    /* transform: rotateZ(360deg); */
    transition: transform .5s ease-in-out 0s;
    -webkit-transition: transform .5s ease-in-out 0s;
}
.softIcon {
    position: relative;
}
.softIcon .softIcon-hover {
    background-color: var(--color);
    background-size: cover;
    background-repeat: no-repeat;
}

.softIcon .softIcon-hover{
    --size: 83px;
    width: var(--size);
    height: var(--size);
    position: absolute;
    top: 19px;
    left: -10px;
    background-image: var(--img);
    border-radius: 55px;
    opacity: .6;
    transform: scale(0) translateX(-50%);
    filter: blur(20px) opacity(70%);
    z-index: -1;
    transition-delay: .05s;
    transition: transform .3s ease-in-out;
}
.BoutiqueSoft .SoftList ul li:hover .softIcon-hover {
    transform: scale(1);
}
/* .xrbb{
    background-image: linear-gradient(90deg,#9dde98,#9cde98,#9cde97,#9bdd97,#9add97,#9add96,#99dd96,#99dc96,#98dc96,#98dc95,#97dc95,#96dc95,#96db95,#96db94,#95db94);
    margin-right: 30px;
}
.txcl{
    background-image: linear-gradient(90deg,#e8977b,#e8987b,#e8997b,#e89a7c,#e79b7c,#e79c7c,#e79d7c,#e79e7c,#e7a07d,#e6a17d,#e6a27d,#e6a47d,#e6a57e,#e6a67e,#e5a77e,#e5a87e,#e5ab7f,#e5ac7f,#e4ad7f,#e4af80,#e4b080,#e4b180,#e4b280,#e3b380,#e3b481,#e3b581,#e3b681);
    margin-right: 30px;
}
.cpjl{
    background-image: linear-gradient(90deg,#88b1f9,#89b2f9,#8ab2f9,#8ab3f9,#8bb3f9,#8bb4f9,#8cb4f9,#8cb5f9,#8db5f9,#8db6f9,#8eb6f9,#8fb7f9,#90b7f9,#90b8f9,#91b8f9,#92bafa,#93bafa,#93bbfa,#94bbfa,#95bcfa,#96bdfa,#97bdfa,#97befa,#98befa,#98bffa,#99bffa,#99c0fa,#9ac1fa);
    margin-right: 30px;
}
.gdzt{
    background-image: linear-gradient(90deg,#a28be1,#a28be1,#a28ce1,#a38ce1,#a38de1,#a48de1,#a48ee1,#a58ee1,#a58fe1,#a68fe2,#a690e2,#a791e2,#a792e2,#a892e2,#a893e2,#a993e2,#a994e2,#aa94e2,#aa95e2,#ab96e2,#ab96e3,#ac97e3,#ac98e3,#ad99e3,#ae99e3,#ae9ae3,#af9ae3,#af9be3,#b09ce3,#b19de3,#b19de4,#b19ee4,#b29ee4,#b29fe4,#b39fe4,#b3a0e4,#b4a0e4,#b4a1e4);
} */
/* 四个彩色板块新增样式 */
.wrap {
    width: 100%;
    background: #f8fafc;
}
.wrap .box:nth-child(4){
    margin-right: 0px;
}
.wrap .box {
    width: 277px;
    perspective: 1000px;
    -webkit-perspective: 1000px;
    margin-right: 30px;
}

.box1 {
    margin: 20px auto;
    width: 277px;
    height: 82px;
    transition: all .3s ease-in-out;
    /* transition: all 0.5s; */
    border-radius: 5px;
    font-size: 18px;
    color: #fff;
    line-height: 82px;
    text-align: center;
}

.box1 a {
    font-size: 18px;
    color: #fff;
    display: block;
    width: 277px;
    height: 82px;
}

.box1:hover {
    box-shadow: 0 0 36px rgb(0 0 0 / 6%);
    transform: scale3d(1.05, 1.05, 1.05);
}

.xrbb {
    width: 277px;
    height: 82px;
    background-position: -8px -34px;
    margin-right: 30px;
}

.txcl {
    width: 277px;
    height: 82px;
    background-position: -8px -127px;
    margin-right: 30px;
}

.cpjl {
    width: 277px;
    height: 82px;
    background-position: -8px -223px;
    margin-right: 30px;
}

.gdzt {
    width: 277px;
    height: 82px;
    background-position: -8px -314px;
}

.xrbb span {
    display: inline-block;
    width: 23px;
    height: 23px;
    background-position: -225px -5px;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 15px;
}

.txcl span {
    display: inline-block;
    width: 25px;
    height: 24px;
    background-position: -260px -5px;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 15px;
}

.cpjl span {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-position: -295px -7px;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 15px;
}

.gdzt span {
    display: inline-block;
    width: 24px;
    height: 22px;
    background-position: -333px -9px;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 15px;
}
/* 下载榜 */
.rankling_list{
    width: 100%;
    background: #fff;
    padding-top: 40px;
}
.rankling_list .soft_weeklyRanking{
    width: 382px;
    /* height: 612px; */
    border: 1px solid #e6e6e6;
    border-radius: 20px;
    margin-right: 23px;
    overflow: hidden;
}
.rankling_list .soft_weeklyRanking:nth-child(3){
    margin-right: 0px;
}
.rankling_list .title{
    font-size: 27px;
    color: #24292f;
    padding: 18px 20px;
    display: block;
}
.rankling_list .soft_weeklyRanking .title span.icon1{
    display: inline-block;
    width: 25px;
    height: 25px;
    background-position: -369px -10px;
    margin-right: 15px;
    vertical-align: middle;
    margin-top: -5px;
}
.rankling_list .soft_weeklyRanking .title span.icon2{
    display: inline-block;
    width: 35px;
    height: 25px;
    background-position: -407px -6px;
    margin-right: 15px;
    vertical-align: middle;
    margin-top: -5px;
}
.rankling_list .soft_weeklyRanking .title span.icon3{
    display: inline-block;
    width: 23px;
    height: 25px;
    background-position: -454px -3px;
    margin-right: 15px;
    vertical-align: middle;
    margin-top: -5px;
}
.rankling_list ul li{
    transition: transform .3s ease-in-out,translateY .3s ease-in-out,box-shadow .3s ease-in-out;
    overflow: hidden;
    border-top: 1px solid #f0f2f4;
    border-radius: 20px 20px 0px 0px;
}
.rankling_list ul li a{
    padding: 24px 12px 0px 12px;
    display: block;
    padding-bottom: 20px;
    /* border-bottom: 1px dotted #ebebeb; */
}
.rankling_list .soft_weeklyRanking ul li:nth-child(5) a{
    border: none;
}
.rankling_list ul li a img{
    width: 63px;
    height: 63px;
    border-radius: 10px;
    margin-left: 7px;
}
.rankling_list ul li a h3{
    width: 204px;
    white-space: nowrap;
    font-size: 20px;
    color: #24292f;
    font-weight: 500;
    margin-top: 3px;
    overflow: hidden;
}
.rankling_list ul li .middle{
    margin-left: 13px;
    display: block;
}
.rankling_list ul li .middle .detail{
    margin-top: 10px;
}
.rankling_list ul li .middle .detail span{
    margin-right: 15px;
}
.rankling_list ul li span.jt{
    display: block;
    width: 38px;
    height: 10px;
    background-position: -135px -5px;
    margin-top: 25px;
}
.rankling_list ul li .softIcon .softIcon-hover{
    top: -10px;
    left: -3px;
}
.rankling_list ul li:hover .softIcon-hover {
    transform: scale(1);
}
.rankling_list ul li:hover{
    transform: translateY(-1px);
    background-color: transparent;
    border-top-style: solid!important;
    background-image: linear-gradient(#fff,hsla(0,0%,100%,.5) 30%,#fff);
    box-shadow: 0 0 26px rgb(0 61 131 / 10%);
}
.rankling_list ul li:hover h3{
    color: #3e8dff;
}
.rankling_list ul li:hover span.jt{
    background-position: -177px -5px;
}
.rankling_list ul li:hover img {
    transform: scale(1.1);
    transition: transform .5s ease-in-out 0s;
    -webkit-transition: transform .5s ease-in-out 0s;
}
/* banner图样式 */
.swiperWrap ul li.one{
    width: 1200px;
    height: 410px;
    background: url("https://resource.bear20.com/bear_download/images/aqybg.png") no-repeat;
    background-size: 100% 100%;
}
.swiperWrap ul li.one .floatL h2{
    font-size: 38px;
    color: #3a3f45;
}
.swiperWrap ul li.one .floatL p:nth-of-type(1){
    font-size: 20px;
    color: #989898;
    letter-spacing: 10px;
    margin-top: 25px;
}
.swiperWrap ul li.one .floatL p:nth-of-type(2){
    font-size: 16px;
    color: #989898;
    margin-top: 15px;
}
.swiperWrap ul li.one .floatL p:nth-of-type(2) span{
    padding: 0px 15px;
}
.swiperWrap ul li.one .floatR img{
    width: 460px;
    height: 280px;
    margin-right: 120px;
    margin-top: 68px;
}
.swiperWrap ul li.one .floatL button{
    width: 200px;
    height: 50px;
    background: linear-gradient(left,#39cf3b,#60d861);
    background: -webkit-linear-gradient(left,#39cf3b,#60d861);
    background: -moz-linear-gradient(left,#39cf3b,#60d861);
    background: -o-linear-gradient(left,#39cf3b,#60d861);
    background: -ms-linear-gradient(left,#39cf3b,#60d861);
    border: none;
    border-radius: 30px;
    font-size: 18px;
    color: #fff;
    margin-top: 25px;
    cursor: pointer;
}
.swiperWrap ul li.one a,.swiperWrap ul li.two a{
    display: block;
    width: 1200px;
    height: 410px;
}
.swiperWrap ul li.one .floatL{
    margin-top: 95px;
    margin-left: 165px;
}
.swiperWrap ul li.two{
    width: 1200px;
    height: 410px;
    background: url("https://resource.bear20.com/bear_download/images/360bg.png") no-repeat;
    background-size: 100% 100%;
}
.swiperWrap ul li.two .floatL p:nth-of-type(1){
    font-size: 16px;
    color: #989898;
    letter-spacing: 5px;
}
.swiperWrap ul li.two .floatL p:nth-of-type(2){
    font-size: 20px;
    color: #989898;
    letter-spacing: 22px;
    margin-top: 15px;
}
.swiperWrap ul li.two .floatL h2{
    font-size: 38px;
    color: #3a3f45;
    margin-top: 20px;
}
.swiperWrap ul li.two .floatL button{
    width: 200px;
    height: 50px;
    background: linear-gradient(left,#3bb4ff,#3ed2fa);
    background: -webkit-linear-gradient(left,#3bb4ff,#3ed2fa);
    background: -moz-linear-gradient(left,#3bb4ff,#3ed2fa);
    background: -o-linear-gradient(left,#3bb4ff,#3ed2fa);
    background: -ms-linear-gradient(left,#3bb4ff,#3ed2fa);
    border: none;
    border-radius: 30px;
    font-size: 18px;
    color: #fff;
    margin-top: 38px;
    cursor: pointer;
}
.swiperWrap ul li.two .floatL{
    margin-left: 205px;
    margin-top: 130px;
}
.swiperWrap ul li.two .floatR img{
    width: 296px;
    height: 180px;
    margin-top: 132px;
    margin-right: 230px;
}
/* 教程文章 */
.article{
    width: 100%;
    background:#fff;
    overflow: hidden;
    padding-bottom: 10px;
}
.article .layout{
    margin-top: 40px;
}
.article .title .floatL span.icons{
    width: 27px;
    height: 24px;
    display: inline-block;
    background-position: -205px -414px;
    vertical-align: middle;
}
.article .title .floatL span.icons:hover{
    /* transform: rotateZ(360deg); */
    transition: transform .5s ease-in-out 0s;
    -webkit-transition: transform .5s ease-in-out 0s;
}
.article .title .floatL h2{
    display: inline;
    color: #24292f;
    font-size: 27px;
    font-weight: 500;
    vertical-align: middle;
    margin-left: 5px;
}
.article .title .floatL ul{
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
}
.article .title .floatL ul li{
    float: left;
    font-size: 17px;
    color: #a3a3a3;
    cursor: pointer;
    margin-left: 25px;
}
.article .title .floatL ul li:hover{
    color: #5c97ff;
}
.article .title .floatL ul li.active{
    color: #5c97ff;
}
.article .title .floatR a{
    font-size: 17px;
    color: #a3a3a3;
}
.article .title .floatR span{
    display: inline-block;
    width: 8px;
    height: 13px;
    background-position: -309px -38px;
    margin-left: 7px;
}
.article .title .floatR{
    margin-top: 5px;
}
.article .title .floatR a:hover{
    color: #5c97ff;
}
.article .title .floatR a:hover span{
    background-position: -295px -38px;
}
.article .articleList ul{
    padding-top: 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.article .articleList ul li{
    width: 586px;
    height: 139px;
    border: 1px solid #f1f1f1;
    border-radius: 5px;
    margin-top: 20px;
    transition: transform .3s ease-in-out,translateY .3s ease-in-out,box-shadow .3s ease-in-out;
}
.article .articleList ul li a{
    display: block;
}
.article .articleList ul li img{
    width: 145px;
    height: 100px;
    border-radius: 5px;
    margin: 20px 0px 0px 20px;
}
.article .articleList ul li span.floatL{
    width: 280px;
    margin-left: 38px;
    margin-top: 23px;
}
.article .articleList ul li span.floatL .articleTitle{
    font-size: 20px;
    color: #24292f;
    line-height: 30px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.article .articleList ul li span.floatL .articleTime{
    font-size: 16px;
    color: #aaaaaa;
    line-height: 24px;
    margin-top: 11px;
}
.article .articleList ul li span.jt{
    display: block;
    width: 38px;
    height: 10px;
    background-position: -135px -5px;
    margin-top: 64px;
    margin-right: 32px;
}
.article .articleList ul li:hover{
    box-shadow: 0 0 26px rgb(0 61 131 / 10%);
    transform: translateY(-5px);
}
.article .articleList ul li:hover span.jt{
    background-position: -177px -5px;
}
.article .articleList ul li:hover span.floatL .articleTitle{
    color: #3e8dff;
}
/* 新增友链板块样式  2023-06-13新增*/
.links {
    width: 100%;
    background: #fff;
    overflow: hidden;
    padding-bottom: 10px;
}

.links .layout {
    margin-top: 25px;
}

.links .title span.icons {
    width: 25px;
    height: 25px;
    display: inline-block;
    background-position: -250px -412px;
    vertical-align: middle;
}

.links .title span.icons:hover {
    transition: transform .5s ease-in-out 0s;
    -webkit-transition: transform .5s ease-in-out 0s;
}

.links .title h2 {
    display: inline;
    color: #24292f;
    font-size: 27px;
    font-weight: 500;
    vertical-align: middle;
    margin-left: 5px;
}

.links ul {
    border: 1px solid #f1f1f1;
    padding: 5px 20px 20px 20px;
    border-radius: 5px;
    margin-top: 30px;
}

.links ul li {
    width: 128px;
    float: left;
    margin-right: 34px;
    margin-top: 15px;
}

.links ul li a {
    font-size: 14px;
    color: #24292f;
}

.links ul li a:hover {
    color: #3e8dff;
}

/* 2024-08-08 关于我们 chenlq*/
.contact{
    margin-top: 20px;
    width: 100%;
    padding:0 90px;
    border:#eee solid 1px;
    background:#fff;
    box-sizing: border-box;
}
.contact dl{
    margin-top: 30px;
    padding:0 25px 15px;
    height: 46px;
    border-bottom:#e4e4e4 solid 1px;
    display: flex;
    justify-content: center;
    align-items: center;
    justify-content: space-between;
}
.contact dl dd{
    width: 207px;
    height: 46px;
    font-size: 20px;
    color:#666;
    font-weight: bold;
    text-align: center;
    line-height: 46px;
    background:#eee;
    border-radius: 46px;
    float:left;
    position:relative;
    cursor: pointer;
}
.contact dl dd:after{
    content:'';
    width: 5px;
    height: 5px;
    border:#fff solid 5px;
    background:#d6d6d6;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    bottom: -22px;
    left: 50%;
    margin-left: -3px;
}
.contact dl dd.on{
    color:#fff;
    background-image:-webkit-linear-gradient(90deg, #009cff, #67c4ff);
    background-image:linear-gradient(90deg, #009cff, #67c4ff);
}
.contact dl dd.on:before{
    content:'';
    width:95px;
    height: 3px;
    background:#009cff;
    position: absolute;
    bottom: -17px;
    left: 50%;
    margin-left: -43px;
}
.contact dl dd.on:after{
    background:#009cff;
}
.contact dl dd a{
    font-size: 20px;
    color:#666;
    font-weight: bold;
}
.contact dl dd.on a{
    color:#fff;
    transition: all 0s;
}
.contact dl dd.on a:after{
    content: '';
    border-width: 10px;
    border-style: solid;
    border-color: #32afff transparent transparent transparent;
    position: absolute;
    bottom: -17px;
    left: 50%;
    margin-left: -5px;
    display: inline-block;

}
.contact dl dd:hover{
    transition: all 0s;
}
.contact ul{
    padding: 0 0 30px;
    display: inline-block;
}
.contact ul li{
    display:none;
}
.contact ul li p{
    padding-top: 30px;
    font-size: 14px;
    color:#1d1d1d;
    line-height: 34px;
}
.contact ul li b{
    font-size:16px;
    font-weight: bold;
}
.tool-list-container-wrap {
    width: 100%;
    box-sizing:content-box;

}
.tool-list-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    box-sizing:content-box;
}
.tool-list-container:after {
    display: block;
    content: "";
    width: 28%;
    padding: 20px;
    box-sizing:content-box;
}
.tool-list-container .tool-dom{
    position: relative;
    display: flex;
    width: 32%;
    max-width: 359px;
    overflow: hidden;
    margin-top: 30px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;

    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.tool-list-container .tool {
    display: flex;
    width: 100%;
    padding: 20px;
    max-height: 100px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.tool-list-container .tool-dom:hover .extension-status{
    display: block;
}
.tool-list-container .tool-dom  .extension-status{display: none}
.tool-list-container .tool-dom .extension-center{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(246,247,250,.96);
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}
.extension-status  .extension-btn1, .extension-status  .extension-btn2{
    text-decoration: none;
    color: #136ce9;
    border: 1px solid #136ce9;
    border-radius: 30px;
    padding: 10px 20px;
    font-size: 14px;
}
.tool-list-container .tool-dom .extension-status  .extension-center .extension-btn2{
    color: #ffffff;
    background-color: #136ce9;
    margin-left: 15px;
}
.tool-list-container .tool .label_font{
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 0 10px 0 10px;
    padding: 2px 8px;
    font-size: 12px;
    color: #ffffff;
}
.tool-list-container .tool .tool-images {
    width: 60px;
    height: 60px;
    box-sizing:content-box;
}
.tool-list-container .tool .tool-text {
    width: 67.5%;
    margin-left: 5%;
    box-sizing:content-box;
}
.tool-list-container .tool .tool-text .tool-name {
    color: #242424;
    font-size: 16px;
    font-weight: bold;
    box-sizing:content-box;
}
.tool-list-container .tool .tool-text .tool-tip {
    width: 100%;
    font-weight: 400;
    font-size: 14px;
    margin-top: 10px;
    color: #8f8f8f;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing:content-box;
}
.footer {
    padding: 40px 0 40px;
    width: 100%;
    background: #333333;
    height: auto;
    display: inline-block;

}
.footer .Copyright {
    width: 100%;
    font-size: 18px;
    text-align: center;
    color: #c9c9c9;
    display: inline-block;
}
.footer .Copyright .info{
    margin-bottom: 20px;
}
.footer .Copyright .info a{
    color:#c9c9c9;
}
.footer .Copyright .info span{
    display: inline-block;
    width: 1px;
    height: 10px;
    background: #999;
    margin: 0 10px;
}

#app-wrap .soft-pop-app{display: none;}
#app-wrap .soft-pop-app .el-dialog{
    min-height: 400px;
}
#app-wrap .soft-pop-app  .el-dialog--center .el-dialog__body{
    padding: 30px 80px;
}
/*@media(max-width:1385px){*/
/*  #app-wrap .soft-pop-app .el-dialog{*/
/*    margin-right: 5vw;*/
/*  }*/
/*}*/
#app-wrap .soft-pop-app .el-dialog{
    border-radius: 20px;
}
#app-wrap .soft-pop-app .info-wrap .info-title{
    display: flex;
    margin-bottom: 20px;
}
#app-wrap .soft-pop-app .info-wrap .info-title .left{
    width: 60px;
    height: 60px;
    margin-right: 25px;
}
#app-wrap .soft-pop-app .info-wrap .info-title .left img{
    width: 100%;
    height: 100%;
}
#app-wrap .soft-pop-app .info-wrap .info-title .right{
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 24px;
    line-height: 20px;
    color: #242424;
}
#app-wrap .soft-pop-app .info-wrap  .info-text{
    padding-left: 86px;
}
#app-wrap .soft-pop-app .info-wrap  .info-text .download-button{

    padding: 10px 20px;
    border-radius: 20px;
    display: inline-block;
    font-size: 14px;
    background: #136ce9;
    color: #ffffff;
    cursor: pointer;
}
#app-wrap .soft-pop-app .info-wrap  .info-text .seo_title{
    font-weight: bold;
    font-size: 20px;
    color: #242424;
    margin-top: 40px;
}
#app-wrap .soft-pop-app .info-wrap  .info-text .description{
    font-size: 14px;
    color: #666666;
    margin-top: 20px;
}
#app-wrap .soft-pop-app .info-wrap  .info-text .edition-number{
    margin-top: 100px;
    font-size: 12px;
    line-height: 21px;
    color: #8f8f8f;
}
#app-wrap .soft-pop-app .info-wrap  .info-text .edition-number p{
    font-size: 12px;
    line-height: 21px;
    color: #8f8f8f;
}
#header .nav .logo img {
    width: 170px;
    margin: 15px 0;
}