@charset "utf-8";
.header {background: transparent;}
.tab_comm {color: #fff;}
#tab5{border-bottom: 3px solid #fff;}

.logo {
    background: url("../image/index/logo-w.png") no-repeat;
    display: inline-block;width: 40vh;
    height: 6vh;position: absolute;left: 6%;top: 13px;-webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}

.download-container {
    position: relative;
    width: 100%;
    min-height: 766px;
    background: url("../image/downadd-apps/downBac.png") no-repeat;
    background-size: 100% 29.5vw;
}

.download-content {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 38%;
    width: 58%;
    display: flex;
    flex-direction: row;
    background: transparent;
    margin: 0 auto;
}
.content-left {width: 30%;background: #F2F7FF;text-align: center;cursor: pointer;}
.content-right {width: 70%;text-align: center;background: #fff;}

.first {background: #2F79F7;color: #fff;
    height: 60px;line-height: 60px;font-size: 18px;font-weight: bold;}
.content-left .content-item {
    height: 60px;line-height: 60px;font-size: 18px;font-weight: bold;color: #397FF7;}
.content-left .content-item.active {position: relative;background: #fff;}
.content-left .content-item.active:before {content: "";width: 6px;height: inherit;
    background: #397FF7;position: absolute;left: 0;}

.content-right .main-item {display: none;}
.content-right .main-item.selected {display: block;}

.one-container {position: relative;width: 80%;margin: 20px auto;
    display: flex;flex-direction: column;justify-content: center;}
.right-p {color: #397FF7;font-size: 20px;margin: 40px 0 20px;font-weight: bold;}

.right-desc {font-size: 14px;color: #666666;width: 85%;position: relative;line-height: 2.2;
    display: inline-block;text-align: left;}

.right-desc:before {content: "";width: 8px;height: 8px;background: #397FF7;border-radius: 100%;
    position: absolute;left: -15px;top: 11px;}

.right-desc .plug-in {position: absolute;right: 0;top: -6px;}

.qr-code {display: flex;flex-direction: column;align-items: center;margin-top: 20px;}
.qr-code .img-app {width: 200px;height: 200px;
    background-size: 100% 100%;margin: 20px 0;
}
.qr-code .img-span {font-size: 14px;color: #397FF7;}
.download-a {text-decoration: underline;color: #397FF7;font-size: 16px;cursor: pointer;}

.img-client-new {margin-top: 20px;width: 470px;height: 274px;}
.img-client-drive {margin-top: 30px;width: 245px;height: 245px;}
.img-google {margin-top: 30px;width: 384px;height: 237px;}
.img-client-old {margin-top: 20px;width: 579px;height: 321px;}
.img-card {margin-top: 20px;width: 583px;height: 285px;}

.download-btn {position: absolute;right: 0;top: -6px;width: 108px;height: 34px;
    line-height: 34px;background: #3A80F7;border-radius: 4px;color: #fff;font-size: 16px;}

.driver-tab {
    display: inline-block;color: #666666;border-radius: 4px;
    margin-top: 20px;
}

.driver-content {
    margin-top: 40px;
}

.driver-tab .driver-item {
    width: 90px;height: 49px;line-height: 49px;
    display: inline-block;
    float: left;
    border-top: 1px solid #397FF7;
    border-bottom: 1px solid #397FF7;
}

.driver-tab .driver-item:last-child {
    border-right: 1px solid #397FF7;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.driver-tab .driver-item:first-child {
    border-left: 1px solid #397FF7;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}


.driver-item.active {
    background: url("../image/downadd-apps/sel-driver.png") no-repeat;
    background-size: 100% 100%;color: #fff;
    border-bottom: none;
    position: relative;height: 52px;top: -1px;
}

.driver-desc-span {
    display: block;margin: 15px 0;
    position: relative;color: #397FF7;cursor: pointer;
}

.driver-desc-span:before {content: "";width: 8px;height: 8px;background: #397FF7;border-radius: 100%;
    position: absolute;left: -15px;top: 7px;} {
}

.driver-content .driver-desc {display: none;text-align: left;}
.driver-content .driver-desc.selected {display: block;}

@media (max-width: 1760px) {
    .first {height: 55px;line-height: 55px;font-size: 16px;}
    .content-left .content-item {height: 55px;line-height: 55px;font-size: 16px;}

    .right-p {font-size: 18px;margin: 30px 0 20px;}
    .img-client-new {margin-top: 20px;width: 470px;height: 274px;}
    .img-client-old {margin-top: 20px;width: 500px;height: 277px;}
}

@media (max-width: 1660px) {
    .first {height: 50px;line-height: 50px;font-size: 16px;}
    .content-left .content-item {height: 50px;line-height: 50px;font-size: 16px;}

    .right-p {font-size: 16px;margin: 20px 0 20px;}
    .img-client-new {margin-top: 20px;width: 400px;height: 233px;}
    .img-client-old {margin-top: 20px;width: 420px;height: 232px;}
}

@media (max-width: 1500px) {
    .first {height: 45px;line-height: 45px;font-size: 15px;}
    .content-left .content-item {height: 45px;line-height: 45px;font-size: 15px;}

    .qr-code .img-app {width: 160px;height: 160px;}
    .right-p {font-size: 15px;margin: 20px 0 10px;}
    .img-client-new {margin-top: 10px;width: 388px;height: 200px;}
    .img-client-old {margin-top: 10px;width: 400px;height: 200px;}
    .img-client-drive {margin-top: 20px;width: 200px;height: 200px;}
    .img-card {margin-top: 10px;width: 480px;height: 230px;}
    .img-google {margin-top: 30px;width: 300px;height: 185px;}
    .download-btn {height: 30px;line-height: 30px;font-size: 12px;}

    .driver-tab .driver-item {
        font-size: 14px;
        width: 80px;height: 39px;line-height: 39px;
    }
}

.bottom {height: 115px;width: 100%;position: static;min-width: 1200px;background-color: #3F4044;}
