body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td {
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset,
img {
    border: 0 none;
}

address,
caption,
cite,
code,
dfn,
em,
i,
strong,
th,
var {
    font-style: normal;
    font-weight: normal;
}

ol,
ul {
    list-style: none;
}

caption,
th {
    text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before,
q:after {
    content: "";
}

abbr,
acronym {
    border: 0;
    font-variant: normal;
}

sup {
    vertical-align: text-top;
}

sub {
    vertical-align: text-bottom;
}

input,
textarea,
select,
button,
option {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

legend {
    color: #000;
}

a,
input,
* {
    -webkit-tap-highlight-color: hsla(0, 0%, 100%, 0) !important;
    -webkit-focus-ring-color: hsla(0, 0%, 100%, 0) !important;
    outline: none !important;
}

body {
    background-color: #fbfcff;
    font-family: "PingFang SC", "Helvetica Neue", "Helvetica", "微软雅黑", "microsoft yahei", "Arial", sans-serif;
    font-weight: 500;
    font-size: 14px;
    color: #666;
}

.body-hidden {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.page-container {
    position: relative;
}

.inner {
    width: 1200px;
    margin: 0 auto;
    position: relative;
}

.main-color {
    color: #474dff;
}

.icon {
    background: url(../images/icons.png) 0 0/220px 250px no-repeat;
    display: inline-block;
}

.icon-radio {
    width: 24px;
    height: 24px;
    background-position: -30px 0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -12px;
    margin-top: -12px;
}

.dagents-title {
    font-size: 40px;
    color: #333;
    line-height: 56px;
    font-weight: 600;
    text-align: center;
}

.font-red {
    color: #fe0f06;
}

.font-gray {
    color: #999;
}

.font-line {
    text-decoration: line-through;
}

.top-bar {
    width: 100%;
    height: 66px;
    background-color: hsla(0, 0%, 100%, .95);
    backdrop-filter: blur(19px);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
}

.top-bar.fixed {
    position: fixed;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .1);
}

.top-bar .logo {
    width: 239px;
    height: 64px;
    position: absolute;
    left: 0;
    top: 1px;
}

.top-bar .logo img {
    width: auto;
    display: block;
    height: 100%;
}

.top-bar .right-item {
    position: absolute;
    height: 32px;
    padding-top: 17px;
    right: 0;
    font-size: 0;
}

.top-bar .right-item .btn-bar {
    display: inline-block;
    vertical-align: top;
    width: 180px;
    height: 30px;
    line-height: 30px;
    background: linear-gradient(210deg, #fec187 0%, #c9882f 100%);
    position: relative;
    border: 1px solid hsl(47, 100%, 98%);
    border-radius: 18px;
    text-decoration: none;
}

.top-bar .right-item .btn-bar .icon-crown {
    background-position: 0 0;
    width: 26px;
    height: 19px;
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
}

.top-bar .right-item .btn-bar .btn-text {
    color: hsl(47, 100%, 98%);
    padding-left: 44px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    font-size: 14px;
    display: block;
}

.top-bar .right-item .btn-bar .qr-code-con {
    position: absolute;
    width: 180px;
    box-sizing: border-box;
    left: 0;
    top: 60px;
    background-color: #fff;
    border-radius: 6px;
    visibility: hidden;
    opacity: 0;
    transition: all .2s ease-in-out;
}

.top-bar .right-item .btn-bar .qr-code-con .qr-code {
    padding: 10px;
    width: 160px;
    height: 160px;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .1);
}

.top-bar .right-item .btn-bar .qr-code-con .qr-code img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.top-bar .right-item .btn-bar:hover .qr-code-con {
    visibility: visible;
    opacity: 1;
    top: 30px;
}

.top-bar .right-item .language-item {
    display: inline-block;
    vertical-align: top;
    line-height: 32px;
    margin-left: 36px;
    padding-right: 20px;
    font-size: 16px;
    color: "PingFang SC", "Helvetica Neue", "Helvetica", "微软雅黑", "microsoft yahei", "Arial", sans-serif;
    position: relative;
    cursor: pointer;
}

.top-bar .right-item .language-item .icon-arrow-down {
    position: absolute;
    width: 10px;
    height: 6px;
    right: 0;
    top: 50%;
    margin-top: -3px;
    background-position: -55px 0;
}

.top-bar .right-item .btn-con {
    display: inline-block;
    vertical-align: top;
}

.top-bar .right-item .btn-con .btn {
    width: 64px;
    height: 30px;
    border: 1px solid #474dff;
    background-color: rgba(233, 237, 255, .5);
    margin-left: 16px;
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    line-height: 30px;
    border-radius: 18px;
    text-align: center;
    cursor: pointer;
}

.top-bar .right-item .btn-con .btn-login {
    color: #474dff;
}

.top-bar .right-item .btn-con .btn-reg {
    border-color: rgba(0, 0, 0, 0);
    color: #fff;
    background: linear-gradient(210deg, #7D84FF 0%, #474DFF 100%);
}

.nav-list {
    position: absolute;
    padding-top: 23px;
    left: 260px;
    font-size: 0;
    overflow: hidden;
}

.nav-list .nav-item {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    margin: 0 17px;
}

.nav-list .nav-item .link {
    color: #333;
    line-height: 22px;
    font-size: 16px;
    font-weight: 600;
    transition: .3s;
    cursor: pointer;
}

.nav-list .nav-item .link:hover {
    color: #474dff;
}

.nav-list .nav-item.active .link {
    color: #474dff;
}

.banner {
    background: #e2eefb url(../images/bg_banner.png) top center/1920px 641px no-repeat;
    height: 641px;
    box-sizing: border-box;
    position: relative;
    padding-top: 66px;
}

.banner .banner-text-con {
    padding: 65px 0 0;
}

.banner .banner-text-con .text-header {
    display: flex;
    align-items: flex-end;
    gap: 18px;
}

.banner .banner-text-con .text-header .b-title {
    font-size: 52px;
    line-height: 73px;
    font-weight: 600;
    color: #333;
}

.banner .banner-text-con .logo-banner {
    width: 160px;
    height: 62px;
}

.banner .banner-text-con .logo-banner img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.banner .banner-text-con .title-body {
    margin-top: 24px;
    font-size: 60px;
    line-height: 84px;
    color: #333;
    font-weight: 800;
}

.banner .banner-text-con .description {
    margin-top: 10px;
    display: inline-block;
    vertical-align: top;
    width: 520px;
    height: 46px;
    line-height: 46px;
    font-size: 24px;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 23px;
}

.banner .banner-text-con .text-info {
    width: 520px;
    margin-top: 20px;
    font-size: 18px;
    line-height: 40px;
    font-size: 18px;
    color: #666;
    text-align: center;
}

.banner .banner-bottom {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -600px;
    width: 1200px;
    box-sizing: border-box;
    height: 170px;
    background-color: hsla(0, 0%, 100%, .67);
    border-radius: 40px 40px 0 0;
    padding: 15px 36px 15px 50px;
    font-size: 0;
    backdrop-filter: blur(10px);
}

.banner .banner-bottom .item {
    padding-left: 40px;
    display: inline-block;
    vertical-align: top;
    height: 111px;
    padding-top: 29px;
    line-height: 30px;
    position: relative;
    width: 334px;
}

.banner .banner-bottom .item::before {
    width: 1px;
    height: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #e9edff;
    content: "";
}

.banner .banner-bottom .item:nth-child(1) {
    padding-left: 0;
    padding-right: 50px;
    width: 250px;
}

.banner .banner-bottom .item:nth-child(1)::before {
    display: none;
}

.banner .banner-bottom .item:nth-child(2) {
    width: 360px;
    padding-right: 40px;
}

.banner .banner-bottom .item h4 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    line-height: 28px;
    margin-bottom: 11px;
}

.banner .banner-bottom .item p {
    font-size: 15px;
    color: #333;
}

.banner .banner-bottom .item p.main-color {
    color: #ff692a;
}

.dagents-about {
    padding-top: 40px;
}

.dagents-about .video-container {
    width: 1200px;
    height: 690px;
    margin: 40px auto 0;
    box-sizing: border-box;
    padding: 20px;
    background: linear-gradient(149deg, #FFFDFC 0%, #F6EAF4 19.89%, #E5EFFD 100%);
    border-radius: 20px;
    position: relative;
}

.dagents-about .video-container img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 10px;
}

.dagents-about .video-container .btn-play {
    width: 120px;
    height: 120px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -60px;
    margin-left: -60px;
    background: url(../images/radio-play.png) 0 0/120px 120px no-repeat;
    z-index: 10;
}

.dagents-about .pro-container {
    position: relative;
}

.dagents-about .pro-container .pro-list {
    width: 1200px;
    padding-top: 10px;
    margin: 0 auto;
    font-size: 0;
    position: relative;
    z-index: 10;
}

.dagents-about .pro-container .pro-list::before {
    width: 20px;
    height: 204px;
    border: 4px solid #dbdeff;
    left: -4px;
    top: 325px;
    border-right: 0;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 20px 0 0 20px;
    position: absolute;
    content: "";
}

.dagents-about .pro-container .pro-list::after {
    display: block;
    width: 26px;
    height: 26px;
    position: absolute;
    background: url(../images/icons.png) 0 0/220px 250px no-repeat;
    background-position: -70px 0;
    transform: rotate(90deg);
    left: -15px;
    top: 416px;
    content: "";
}

.dagents-about .pro-container .pro-list .list-item {
    width: 360px;
    height: 168px;
    background-color: #fff;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 20px;
    border-radius: 20px;
    position: relative;
    z-index: 10;
    border: 1px solid #dbdeff;
}

.dagents-about .pro-container .pro-list .list-item::before {
    display: block;
    position: absolute;
    width: 40px;
    height: 4px;
    background-color: #dbdeff;
    right: -41px;
    top: 86px;
    content: "";
}

.dagents-about .pro-container .pro-list .list-item::after {
    display: block;
    width: 26px;
    height: 26px;
    position: absolute;
    background: url(../images/icons.png) 0 0/220px 250px no-repeat;
    background-position: -70px 0;
    right: -32px;
    top: 75px;
    content: "";
}

.dagents-about .pro-container .pro-list .list-item:nth-child(3)::before {
    width: 20px;
    height: 204px;
    border: 4px solid #dbdeff;
    right: -24px;
    border-left: 0;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0 20px 20px 0;
}

.dagents-about .pro-container .pro-list .list-item:nth-child(3)::after {
    top: 178px;
    right: -35px;
    transform: rotate(90deg);
}

.dagents-about .pro-container .pro-list .list-item:nth-child(4)::after {
    transform: rotate(180deg);
}

.dagents-about .pro-container .pro-list .list-item:nth-child(5)::after {
    transform: rotate(180deg);
}

.dagents-about .pro-container .pro-list .list-item:nth-child(6)::before {
    display: none;
}

.dagents-about .pro-container .pro-list .list-item:nth-child(6)::after {
    display: none;
}

.dagents-about .pro-container .pro-list .list-item:nth-child(9)::before {
    display: none;
}

.dagents-about .pro-container .pro-list .list-item:nth-child(9)::after {
    display: none;
}

.dagents-about .pro-container .pro-list .list-item .icon {
    width: 64px;
    height: 64px;
    position: absolute;
    top: 9px;
    right: 9px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-1 {
    background-position: 0 -45px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-2 {
    background-position: -70px -45px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-3 {
    background-position: -140px -45px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-4 {
    background-position: 0 -115px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-5 {
    background-position: -70px -115px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-6 {
    background-position: -140px -115px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-7 {
    background-position: 0 -185px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-8 {
    background-position: -70px -185px;
}

.dagents-about .pro-container .pro-list .list-item .icon-pro-9 {
    background-position: -140px -185px;
}

.dagents-about .pro-container .pro-list .list-item .text-con {
    padding: 30px 19px;
}

.dagents-about .pro-container .pro-list .list-item .item-title {
    height: 30px;
    line-height: 30px;
    font-size: 18px;
    color: #333;
    font-weight: 600;
}

.dagents-about .pro-container .pro-list .list-item .item-text {
    margin-top: 20px;
    font-size: 14px;
    line-height: 22px;
    color: #666;
}

.dagents-about .pro-container .pro-list .list-item .item-text .info {
    width: 300px;
    height: 30px;
    line-height: 30px;
    background-color: #f5f5fa;
    border-radius: 4px;
    color: #3c67ff;
    box-sizing: border-box;
    padding: 0 10px;
    box-sizing: border-box;
    margin-top: 7px;
    font-size: 12px;
}

.dagents-about .pro-container .pro-list .list-item.building .item-title {
    color: #999;
}

.price-container {
    margin-top: 20px;
    background-color: #fff;
    padding-top: 40px;
}

.price-container .inner {
    margin-top: 34px;
}

.price-container .p-list {
    text-align: left;
    font-size: 0;
}

.price-container .p-list .p-title-con {
    display: inline-block;
    vertical-align: top;
    padding-top: 40px;
    width: 256px;
}

.price-container .p-list .p-title-con .p-top {
    height: 160px;
    padding-top: 64px;
    padding-left: 18px;
    box-sizing: border-box;
    background: url(../images/bg-crown.png) 0 0 no-repeat;
    border-radius: 20px 0 0 0;
}

.price-container .p-list .p-title-con .title {
    font-size: 24px;
    line-height: 33px;
    padding-left: 18px;
    font-weight: 400;
    color: #333;
}

.price-container .p-list .p-title-con .title-list {
    border-top: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    font-size: 14px;
    color: #333;
}

.price-container .p-list .p-title-con .title-list .list-item {
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
    border-bottom: 1px solid #e6e6e6;
    padding-left: 20px;
}

.price-container .p-list .plate-list {
    width: 944px;
    display: inline-block;
    vertical-align: top;
}

.price-container .p-list .plate-list .btn-qg {
    width: 48px;
    height: 24px;
    background: #474dff;
    border-radius: 16px;
    color: #fff;
    font-size: 12px;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    visibility: top;
    margin-left: 6px;
    text-decoration: none;
}

.price-container .p-list .plate-list .plate-item {
    width: 186px;
    display: inline-block;
    vertical-align: top;
    position: relative;
}

.price-container .p-list .plate-list .plate-item .icon-unlimited {
    width: 62px;
    height: 24px;
    background-position: -100px 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -31px;
}

.price-container .p-list .plate-list .plate-item .item-header {
    box-sizing: border-box;
}

.price-container .p-list .plate-list .plate-item .item-header .title {
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    color: #fff;
    background: linear-gradient(203deg, #989898 0%, #8e8e8e 100%);
    border-radius: 20px 20px 0 0;
    text-align: center;
}

.price-container .p-list .plate-list .plate-item .list-header {
    height: 160px;
    box-sizing: border-box;
    padding-top: 19px;
    background-color: #f1f1f1;
    text-align: center;
}

.price-container .p-list .plate-list .plate-item .list-header .list-title {
    font-size: 18px;
    line-height: 25px;
    color: #666;
}

.price-container .p-list .plate-list .plate-item .list-header .p-price {
    margin-top: 14px;
    line-height: 28px;
    font-size: 14px;
    color: #666;
}

.price-container .p-list .plate-list .plate-item .list-header .p-price .price {
    font-size: 24px;
    font-weight: bold;
}

.price-container .p-list .plate-list .plate-item .list-header .text-con {
    margin-top: 6px;
    font-size: 14px;
    line-height: 28px;
}

.price-container .p-list .plate-list .plate-item .list-header .text-con .day-price {
    color: #333;
}

.price-container .p-list .plate-list .plate-item .list-header .price-info {
    position: relative;
    display: inline-block;
    vertical-align: top;
    color: #999;
    text-decoration: underline;
    cursor: pointer;
    z-index: 10;
}

.price-container .p-list .plate-list .plate-item .list-header .price-info .d-info {
    position: absolute;
    width: 320px;
    height: 40px;
    left: 50%;
    line-height: 40px;
    transform: translateX(-50%);
    display: block;
    visibility: hidden;
    background-color: #fff;
    box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, .1);
    border-radius: 4px;
    color: #333;
    top: 0;
    opacity: 0;
    transition: all .3s;
}

.price-container .p-list .plate-list .plate-item .list-header .price-info:hover .d-info {
    visibility: visible;
    opacity: 1;
    top: 28px;
}

.price-container .p-list .plate-list .plate-item .list-con {
    border-top: 1px solid #e6e6e6;
    background-color: #f1f1f1;
}

.price-container .p-list .plate-list .plate-item .list-con .list-item {
    box-sizing: border-box;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    color: #666;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
}

.price-container .p-list .plate-list .dz-content {
    width: 758px;
    display: inline-block;
    vertical-align: top;
}

.price-container .p-list .plate-list .dz-content .dz-header {
    padding-left: 3px;
    text-align: center;
}

.price-container .p-list .plate-list .dz-content .dz-header .dz-title {
    height: 40px;
    line-height: 40px;
    background: #7671ff url(../images/bg_dz-title.png) right 0 no-repeat;
    border-radius: 20px 20px 0 0;
    font-size: 18px;
    color: #fff;
}

.price-container .p-list .plate-list .dz-list-con {
    font-size: 0;
}

.price-container .p-list .plate-list .dz-list-con .points-text {
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding-left: 24px;
    color: #2060ff;
    text-decoration: underline;
}

.price-container .p-list .plate-list .dz-list-con .icon-points {
    width: 18px;
    height: 20px;
    background-position: -165px 0;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -10px;
}

.price-container .p-list .plate-list .dz-list-con .plate-item {
    width: 190px;
}

.price-container .p-list .plate-list .dz-list-con .list-con {
    background-color: #fff;
}

.price-container .p-list .plate-list .dz-list-con .list-con .list-item {
    color: #333;
}

.price-container .p-list .plate-list .dz-list-con .list-header {
    padding-top: 20px;
    margin-left: 4px;
    background: linear-gradient(0deg, #ffffff 0%, #e9edff 100%);
    position: relative;
}

.price-container .p-list .plate-list .dz-list-con .list-header::after {
    width: 68px;
    height: 73px;
    display: block;
    background: url(../images/bg_price_head.png) 0 0 no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    content: "";
}

.price-container .p-list .plate-list .dz-list-con .list-header .list-title {
    color: #333;
}

.price-container .p-list .plate-list .dz-list-con .list-header .p-price {
    color: #333;
}

.price-container .p-list .plate-list .dz-list-con .list-header .price {
    font-size: 24px;
    line-height: 28px;
    color: #333;
}

.price-container .p-list .plate-list .dz-list-con .list-header .btn-reg {
    display: inline-block;
    vertical-align: top;
    width: 146px;
    height: 32px;
    background: linear-gradient(270deg, #b31dff 0%, #474dff 100%);
    border-color: rgba(0, 0, 0, 0);
    line-height: 32px;
    border-radius: 16px;
    font-size: 14px;
    color: #fff9e9;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 2px 6px 0 hsla(238, 100%, 64%, .28);
}

.price-container .p-list .plate-list .dz-list-con .list-header .btn-buy {
    background: linear-gradient(270deg, #b31dff 0%, #474dff 100%);
    border-color: rgba(0, 0, 0, 0);
    color: #fff9e9;
}

.price-container .p-list .plate-list .free-item {
    width: 188px !important;
}

.price-container .p-list .plate-list .free-item .list-header {
    padding-top: 17px;
}

.price-container .p-list .plate-list .free-item .list-header .text-con {
    margin-top: 27px;
}

.price-container .p-list .plate-list .free-item .list-header .list-title {
    font-size: 26px;
    line-height: 37px;
    font-weight: bold;
}

.price-container .p-list .plate-list .business-item .list-header .list-title {
    position: relative;
}

.price-container .p-list .plate-list .business-item .list-header .icon-recommend {
    display: block;
    width: 40px;
    height: 24px;
    position: absolute;
    right: 24px;
    top: -4px;
    background-position: -165px -20px;
}

.price-container .p-list .plate-list .best-seller .list-item {
    border-right: 1px solid #e6e6e6;
}

.question-container {
    padding-top: 40px;
    background: url(../images/bg_question.png) top center no-repeat;
}

.question-container .question-list {
    padding-top: 20px;
    padding-bottom: 40px;
    font-size: 0;
}

.question-container .question-list .item {
    width: 590px;
    height: 200px;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    padding: 35px 31px 0 31px;
    background-color: hsla(0, 0%, 100%, .5);
    box-shadow: 0 0 9px 0 rgba(208, 208, 208, .37);
    border-radius: 20px;
    backdrop-filter: blur(10px);
    margin-top: 20px;
    margin-right: 20px;
    font-size: 14px;
    line-height: 22px;
    color: #666;
}

.question-container .question-list .item:nth-child(2) {
    margin-right: 0;
}

.question-container .question-list .item:nth-child(4) {
    margin-right: 0;
}

.question-container .question-list .item .title {
    font-size: 18px;
    line-height: 25px;
    color: #333;
    margin-bottom: 16px;
}

.question-container .question-list .hot {
    width: 48px;
    height: 24px;
    border-radius: 8px;
    font-size: 14px;
    background: linear-gradient(79deg, #FC359A 0%, #777CFF 100%);
    color: #fff;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    margin-left: 10px;
}

.footer {
    background-color: #121822;
    height: 214px;
}

.footer .inner {
    padding-top: 41px;
    position: relative;
}

.footer .footer-logo {
    width: 116px;
    height: 45px;
    margin-top: 5px;
}

.footer .footer-logo img {
    width: auto;
    height: 100%;
    display: block;
}

.footer .text-con {
    margin-top: 20px;
    font-size: 14px;
    line-height: 24px;
    color: #c1c3ce;
    font-weight: 400;
}

.footer .copy {
    color: rgba(193, 195, 206, .5);
    margin-top: 9px;
}

.footer .about-con {
    position: absolute;
    right: 0;
    top: 42px;
}

.footer .about-con .title {
    font-size: 18px;
    line-height: 25px;
    color: #fff;
}

.footer .about-con .about-list {
    margin-top: 12px;
    text-align: right;
    line-height: 30px;
    font-weight: 400;
}

.footer .about-con .about-list a {
    color: #c1c3ce;
    text-decoration: none;
}

.wechat-service {
    width: 66px;
    height: 172px;
    background-image: url(../images/bg-service.png);
    background-size: 66px 172px;
    position: fixed;
    right: 30px;
    top: 50%;
    margin-top: -36px;
    z-index: 100;
    text-align: center;
    cursor: pointer;
}

.wechat-service .qr-conent {
    visibility: hidden;
    opacity: 0;
    width: 154px;
    height: 134px;
    box-sizing: border-box;
    padding-left: 23px;
    position: absolute;
    left: -164px;
    top: 33px;
    background: url(../images/bg-qr-code.png) 0 0/144px 134px no-repeat;
}

.wechat-service .qr-conent img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.wechat-service:hover .qr-conent {
    visibility: visible;
    left: -140px;
    opacity: 1;
    transition: all .3s ease-in-out;
}

.wechat-service .code-inner {
    width: 88px;
    font-size: 12px;
}

.wechat-service .code-inner .img-box {
    margin-top: 13px;
    margin-bottom: 6px;
    width: 88px;
    height: 88px;
    box-sizing: border-box;
    padding: 5px;
    border-radius: 2px;
    border: .5px solid #e9edff;
}

.wechat-service .wechat-con {
    margin-top: 5px;
    padding: 63px 16px 0;
}

.wechat-service .wechat-con .code-inner {
    width: 88px;
}

.wechat-service .wechat-con .code-inner .img-box {
    width: 88px;
    height: 88px;
    box-sizing: border-box;
    padding: 5px;
}

.wechat-service .wechat-con .icon-wechat {
    width: 18px;
    height: 18px;
    display: block;
    margin: 0 auto;
    background-position: -15px -25px;
}

.wechat-service .wechat-con p {
    width: 16px;
    display: inline-block;
    vertical-align: top;
    line-height: 17px;
    color: #474dff;
    font-weight: 400;
}

.bottom-banner {
    position: relative;
    padding-bottom: 40px;
    height: 286px;
}

.bottom-banner .btn-close {
    width: 24px;
    height: 24px;
    position: absolute;
    right: 10px;
    top: 52px;
    background-color: rgba(0, 0, 0, .2);
    border-radius: 4px;
    cursor: pointer;
    display: none;
}

.bottom-banner .btn-close::before,
.bottom-banner .btn-close::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    left: 50%;
    top: 50%;
    border-radius: 1px;
    margin-left: -2px;
    margin-top: -9px;
    background-color: #fff;
}

.bottom-banner .btn-close::before {
    transform: rotate(45deg);
}

.bottom-banner .btn-close::after {
    transform: rotate(-45deg);
}

.bottom-banner .inner {
    position: relative;
}

.bottom-banner .banner-con {
    width: 1200px;
    height: 286px;
    background: url(../images/bg_bottom_banner.png) 0 0/cover no-repeat;
}

.bottom-banner .banner-fixed {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
}

.bottom-banner .banner-fixed .btn-close {
    display: block;
}

.bottom-banner .text-con {
    position: absolute;
    right: 195px;
    top: 51px;
    font-size: 24px;
    line-height: 33px;
    color: #fff;
}

.mask {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 9999;
    display: none;
}

.dialog-plugin {
    width: 1000px;
    height: 680px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -340px;
    margin-left: -500px;
    background: url(../images/bg_plugin.png) 0 0/cover no-repeat;
    z-index: 99999;
    display: none;
}

.dialog-plugin .close {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 14px;
    right: 14px;
    background-position: 0 0;
    display: block;
    cursor: pointer;
}

.dialog-plugin .plugin-con {
    padding: 68px 30px 0;
}

.dialog-plugin .plugin-con h3 {
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    color: #333;
}

.dialog-plugin .plugin-con .plugin-about-con {
    font-size: 0;
    text-align: left;
}

.dialog-plugin .plugin-con .plugin-about-con h2 {
    font-size: 48px;
    line-height: 56px;
    color: #107eff;
    text-shadow: 0 2px 4px rgba(32, 136, 254, .26);
}

.dialog-plugin .plugin-con .plugin-about-con .text-con {
    display: inline-block;
    vertical-align: top;
    width: 352px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .description {
    font-size: 32px;
    line-height: 38px;
    margin-top: 10px;
    color: #333;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .btn-download {
    width: 220px;
    height: 50px;
    margin-top: 30px;
    display: block;
    box-sizing: border-box;
    text-align: center;
    line-height: 50px;
    font-size: 18px;
    font-weight: 600;
    background: linear-gradient(210deg, #B31DFF 0%, #474DFF 100%);
    box-shadow: 0 4px 8px 1px rgba(71, 77, 255, .22);
    border-radius: 25px;
    color: #fff9e9;
    text-decoration: none;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .link {
    font-size: 16px;
    line-height: 22px;
    margin-top: 18px;
    font-weight: 600;
    display: inline-block;
    vertical-align: top;
    width: 220px;
    text-align: center;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .link a {
    color: #474dff;
    text-decoration-line: underline;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .support {
    margin-top: 40px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list {
    margin-top: 25px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item {
    width: 41px;
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    text-align: center;
    color: #333;
    margin-right: 26px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .icon-plugin,
.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .download-step .step-list .icon-con::after,
.dialog-plugin .download-step .step-list .plugin-con .plugin-about-con .text-con .browser-list .item .icon-con::after {
    width: 41px;
    height: 40px;
    display: block;
    margin-bottom: 4px;
    line-height: 20px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .icon-zhanfu {
    background-position: 0 -30px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .icon-chrome {
    background-position: -45px -30px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .icon-ziniao {
    background-position: -90px -30px;
}

.dialog-plugin .plugin-con .plugin-about-con .text-con .browser-list .item .icon-edge {
    background-position: -135px -30px;
}

.dialog-plugin .plugin-con .plugin-about-con .video-con {
    margin-top: 12px;
    padding: 10px;
    width: 588px;
    height: 339px;
    box-sizing: border-box;
    background-color: #2f3336;
    border: 2px solid #43475b;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    border-radius: 12px;
    position: relative;
}

.dialog-plugin .download-step {
    margin-top: 40px;
    font-size: 0;
}

.dialog-plugin .download-step .step-list {
    margin-top: 19px;
    padding-left: 10px;
    position: relative;
}

.dialog-plugin .download-step .step-list::before {
    width: 602px;
    height: 4px;
    background-color: #dbdeff;
    position: absolute;
    top: 22px;
    left: 174px;
    z-index: 1;
    content: "";
}

.dialog-plugin .download-step .step-list .item {
    width: 280px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    font-size: 14px;
    line-height: 20px;
    position: relative;
    z-index: 2;
}

.dialog-plugin .download-step .step-list .item:nth-child(2) {
    margin-right: 50px;
}

.dialog-plugin .download-step .step-list .item:nth-child(2) .icon-con::after {
    left: 183px;
}

.dialog-plugin .download-step .step-list .item:nth-child(3) .icon-con::after {
    display: none;
}

.dialog-plugin .download-step .step-list .item:nth-child(1) {
    margin-right: 40px;
}

.dialog-plugin .download-step .step-list .item-text-con {
    margin-top: 16px;
    color: #333;
}

.dialog-plugin .download-step .step-list .icon-con {
    width: 48px;
    height: 48px;
    position: relative;
    background: linear-gradient(180deg, #7D84FF 0%, #474DFF 100%);
    border-radius: 50%;
    display: block;
    margin: 0 auto;
}

.dialog-plugin .download-step .step-list .icon-con::after {
    width: 20px;
    height: 24px;
    display: block;
    position: absolute;
    background-position: -35px 0 !important;
    left: 173px;
    top: 12px;
    content: "";
}

.dialog-plugin .download-step .step-list .icon-con .icon-plugin,
.dialog-plugin .download-step .step-list .icon-con .icon-con::after {
    width: 31px;
    height: 30px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.dialog-plugin .download-step .step-list .icon-con .icon-step1 {
    background-position: 0 -75px;
}

.dialog-plugin .download-step .step-list .icon-con .icon-step2 {
    background-position: -35px -75px;
}

.dialog-plugin .download-step .step-list .icon-con .icon-step3 {
    background-position: -70px -75px;
}

.icon-plugin,
.dialog-plugin .download-step .step-list .icon-con::after {
    background: url(../images/plugin_icons.png) 0 0/180px 110px no-repeat;
}

.custom-video {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 2;
}

.play-button {
    width: 49px;
    height: 48px;
    border-radius: 50%;
    text-align: center;
    line-height: 48px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url(../images/radio-play.png) 0 0/48px 48px no-repeat;
    transition: opacity .3s ease-in-out;
    cursor: pointer;
    z-index: 5;
}

.play-button.hidden {
    visibility: hidden;
    opacity: 0;
}