#tooltip {
    position: absolute;
    border: 1px solid #ccc;
    background: #333;
    padding: 2px;
    display: none;
    color: #fff;
}

.media_line {
    display: block;
    position: relative;
    top: 14px;
    content: '';
    height: 1px;
    width: 200px;
    margin: 0 auto;
    background: #7f3dfe;
}

@media (min-width: 768px) {
    .media_line {
        width: 768px;
    }
}

@media (min-width: 992px) {
    .media_line {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .media_line {
        width: 1170px;
    }
}

.media_title {
    position: relative;
    text-align: center;
    font-size: 24px;
    line-height: 24px;
    width: 360px;
    margin: 0 auto;
    margin-bottom: 30px;
    background: #fff;
    color: #7f3dfe;
}

    .media_title .diamond {
        position: relative;
        top: -5px;
        display: inline-block;
        margin: 0 20px;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        width: 8px;
        height: 8px;
        background: #7f3dfe;
    }

.topic-tag {
    color: #206FDE;
    cursor: pointer;
    display: inline-block;
    padding: 0.3em 0.9em;
    margin: 0 0.5em 0.5em 0;
    white-space: nowrap;
    background-color: #f1f8ff;
    border-radius: 3px;
}

    .topic-tag:hover {
        background-color: #ddeeff;
    }

.img-doc {
    margin-top: 12px;
    padding-bottom: 12px;
}


.version-cards { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 auto; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center }
.version-cards .card { border: solid 1px #e5e5e5; width: 236px; background-color: #fff; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column }
.version-cards .card.active { box-shadow: 4px 8px 40px 0 rgba(0,0,0,.1) }
.version-cards .card:not(:last-of-type) { margin-right: 17px }
.version-cards .card.ent-base .header { background-image: -webkit-linear-gradient(bottom, #f22f38 1%, #ff5a52); background-image: linear-gradient(to top, #888 1%, #888) }
.version-cards .card.ent-base .header .price-year { font-size: 28px; line-height: 34px }
.version-cards .card.ent-base .btn { background-image: -webkit-linear-gradient(bottom, #fff, #fff 30%, #fff); background-image: linear-gradient(to top, #fff, #fff 30%, #fff) }
.version-cards .card.ent-standard .header { background-image: -webkit-linear-gradient(11deg, #ef0c72, #ff308d); background-image: linear-gradient(79deg, #ef0c72, #ff308d) }
.version-cards .card.ent-standard .btn { background-image: -webkit-linear-gradient(bottom, #ffd2f6, #fff 30%, #fff); background-image: linear-gradient(to top, #ffd2f6, #fff 30%, #fff) }
.version-cards .card.ent-advanced .header { background-image: -webkit-linear-gradient(bottom, #6702cf, #9c2afc); background-image: linear-gradient(to top, #6702cf, #9c2afc) }
.version-cards .card.ent-advanced .btn { background-image: -webkit-linear-gradient(bottom, #e6d4ff, #fff 30%, #fff); background-image: linear-gradient(to top, #e6d4ff, #fff 30%, #fff) }
.version-cards .card.ent-honour { position: relative }
.version-cards .card.ent-honour.disabled .icon { background-image: url(../images/recommend-disabled_a9a7c1c.png) }
.version-cards .card.ent-honour.disabled .version { color: rgba(255,255,255,.8); background-image: -webkit-gradient(linear, left center, right center, from(rgba(255,255,255,.8)), to(rgba(255,255,255,.8))) }
.version-cards .card.ent-honour .icon { background-image: url(../images/recommends.png); background-size: contain; background-repeat: no-repeat; position: absolute; width: 34px; height: 52px; right: 13px; top: -1px }
.version-cards .card.ent-honour .header { background-image: -webkit-linear-gradient(bottom, #1f2224, #515558); background-image: linear-gradient(to top, #1f2224, #515558) }
.version-cards .card.ent-honour .version { color: #b49878; background-image: -webkit-gradient(linear, left center, right center, from(#a08356), to(#e7bd8e)); -webkit-background-clip: text; -webkit-text-fill-color: transparent }
.version-cards .card.ent-honour .btn { background-image: -webkit-linear-gradient(bottom, #c5994f, #f6cc99); background-image: linear-gradient(to top, #c5994f, #f6cc99) }
.version-cards .card.ent-pilot .header { background-image: -webkit-linear-gradient(bottom, #000, #383b3d); background-image: linear-gradient(to top, #000, #383b3d) }
.version-cards .card.ent-pilot .version { color: #bc8870; background-image: -webkit-gradient(linear, left center, right center, from(#a16a4e), to(#e7a98b)); -webkit-background-clip: text; -webkit-text-fill-color: transparent }
.version-cards .card.ent-pilot .tel { margin-top: 45px; font-size: 12px; color: #bc8870 }
.version-cards .card.ent-pilot .tel:before { content: ""; background: url(../images/phone_9bc4429.png) no-repeat center; width: 12px; height: 10px; display: inline-block; margin-right: 3px }
.version-cards .card.disabled { pointer-events: none }
.version-cards .card.disabled .header { background-image: -webkit-linear-gradient(bottom, #929191 1%, #bbbaba); background-image: linear-gradient(to top, #929191 1%, #bbbaba) }
.version-cards .card.disabled .btn { pointer-events: none; background-color: rgba(255,255,255,.2); background-image: none; color: rgba(255,255,255,.8); font-weight: 400 }
.version-cards .card .version { font-weight: 700 }
.version-cards .header { height: 170px; color: #fff; font-size: 14px; line-height: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding-top: 23px; font-weight: 300 }
.version-cards .header .price-year { margin-top: 12px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; font-weight: 400 }
.version-cards .header .price-year .dollar { font-size: 18px; -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; margin-top: 3px; font-weight: 300 }
.version-cards .header .price-year .price { font-size: 34px; letter-spacing: 1.7px; font-weight: 400; font-family: Helvetica }
.version-cards .header .price-year .price+span { margin-bottom: 5px; font-weight: 300 }
.version-cards .header .price-quarter { font-size: 12px; margin: 5px auto 17px }
.version-cards .header .btn { width: 160px; height: 30px; border-radius: 2px; color: rgba(0,0,0,.7); font-size: 14px; border: 0; font-weight: 500; font-family: PingFangSC; cursor: pointer }
.version-cards .header .btn:hover { box-shadow: 5px 5px 5px 0 rgba(0,0,0,.14) }
.version-cards .content { position: relative; font-size: 12px; padding-top: 23px; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 }
.version-cards .content .desc { line-height: 1; padding-left: 37px; margin-bottom: 18px; color: rgba(62,62,62,.8); position: relative }
.version-cards .content .desc:before { position: absolute; content: ""; height: 6px; width: 9px; border: 2px solid #3e3e3e; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); top: 20%; left: 16px; border-top: 0; border-right: 0; opacity: .6; filter: alpha(opacity=60) }
.version-cards .content .link-compare { position: absolute; bottom: 14px; right: 15px; text-decoration: underline; color: rgba(62,62,62,.8); cursor: pointer; pointer-events: auto }
.version-cards .content .link-compare:hover { color: #2193ff }