@charset "utf-8";
/* CSS Document */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}
body{
    color: #4c4c4c;
}
/*titles*/
.titles{
    font-size: 1.25rem;
    font-weight: bold;
    color: #333333;
}
/*titles-end*/
.header {
    background: #175cce url("/images/bg/b-2.jpg") bottom center;
    -webkit-background-size: cover;
    background-size: cover;
}
.header .bg-primary {
    border-bottom: .0625rem  solid rgba(255, 255, 255, 0.1);
    background-color: rgba(0, 0, 0, 0) !important;
}
/*banner*/
.banner{
    height: 94vh;
    padding-top: 7rem;
    color: #ffffff;
}
@media (max-width: 1599px) {
    .banner{
        padding-top: 5rem;
    }
}
.banner h1{
    margin-bottom: 1rem;
	font-size: 1.625rem;
    font-weight: bold;
}
.banner .vers-num{
    display: inline-block;
    font-size: 1.125rem;
    padding: .125rem .625rem;
    margin-bottom: 1.625rem;
    border-radius: .5rem;
    background: #ff9d4f;
}
.banner .con p{
    font-size: 1.125rem;
    line-height: 2rem;
}
/*btn-first btn-second*/
.btn-first, .btn-second {
    position: relative;
    width: 15rem;
    height: 3.75rem;
    margin: 1.875rem 0 0.75rem;
    border-radius: 0.375rem;
    background: #1bd76a;
}
.btn-first a, .btn-second a {
    position: absolute;
    top: 0; left: 0;
    display: block;
    z-index: 2;
    width: 100%;
    height: 100%;
    font-size: 1.125rem;
    color: #ffffff;
    line-height: 3.75rem;
    text-align: center;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.btn-first a .icon-down-circle, .btn-second a .icon-down-circle{
    margin-right: 0.625rem;
    font-size: 1.5rem;
    vertical-align:text-top;
}
.btn-first i, .btn-second i {
    position: absolute; left: 50%; top: 50%;
    display: block;
    width: 6.25rem;
    height: 0.625rem;
    margin: -0.3125rem 0 0 -3.125rem;
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.btn-first a:hover, .btn-second a:hover { text-decoration: none; }
.btn-first:hover i, .btn-second:hover i {
    opacity: 1;
    border-radius: 0.125rem;
    -webkit-transform: scale(2.4, 6);
    -moz-transform: scale(2.4, 6);
    transform: scale(2.4, 6);
}
.btn-first:hover i { background: #26b964; }
/*btn-second*/
.btn-second {
    border: 0.0625rem solid #8cb6fb;
    background: transparent;
}
.btn-second a .icon-down-circle{
    display: inline-block;
    -webkit-transform: rotate(90deg);
    transform: rotate(180deg);
}
.btn-second a:hover .icon-buy { color: #ffffff; }
.btn-second a:hover {
    color: #ffffff;
    background: #8cb6fb;
}
/*btn-first btn-second-end*/
.banner .go-mac{
    font-size: 1rem;
}
.banner .go-mac .icon-mac{
    margin-right: 0.375rem;
    font-size: 1.125rem;
}
.banner .go-mac a{color: #ffffff;}
.banner .container{
    position: relative;
}
.banner .illus{
    position: absolute;
    top: 0;
    right: -3.75rem;
    display: block;
    width: 30.625rem;
    height: 30.1875rem;
    background: url("/images/illustration/illustration41.svg") no-repeat;
}
@media (max-width: 1599px) {
    .banner{
        height: 100vh;
        padding-top: 4.25rem;
    }
    .banner .con p {
        font-size: 1rem;
        line-height: 1.625rem;
    }
}
@media (max-width: 1199px) {
    .banner h1 {
        margin-bottom: 1rem;
        font-size: 2.25rem;
    }
    .banner .con p {
        font-size: 1rem;
        line-height: 1.625rem;
    }
    .banner .illus{
        top: 4rem;
        right: 0;
        width: 23.625rem;
        height: 23.4375rem;
    }
}
@media (max-width: 991px) {
    .banner .illus{
        top: 18rem;
        width: 13.625rem;
        height: 13.625rem;
    }
}
@media (max-width: 767px) {
    .banner {
        height: 50rem;
        padding-top: 1.875rem;
    }
    .banner h1 {
        font-size: 1.75rem;
    }
    .btn-first, .btn-second {
        width: 100%;
        margin-top: 0.625rem;
    }
    .btn-first i, .btn-second i {
        display: none;
    }
    .banner .illus{
        display: none;
    }
}
/*banner-end*/
/*nav-affix, nav-affix-buy, nav-affix-down*/
.nav-affix {
    position: fixed;
    padding: 0;
    visibility: hidden;
    box-shadow: 0 0.125rem 0.375rem 0 #cbd9ee;
}
.nav-affix .title{
    margin-bottom: 0;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 3.625rem;
}
.top-76 { visibility: visible; animation: move-top 1s ease both; }
@media (max-width: 1279px) {
    .nav-affix { display: none; }
}
.nav-affix .nav-affix-buy, .nav-affix .nav-affix-down {
    position: relative;
    float: right;
    width: 11.125rem;
    height: 2.625rem;
    margin: 0.5rem 0.375rem;
    border-radius: 0.375rem;
}
.nav-affix .nav-affix-buy a, .nav-affix-down a {
    position: absolute;
    top: 0; left: 0;
    display: block;
    z-index: 2;
    width: 100%;
    height: 100%;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 2.625rem;
    color: #fff;
    text-align: center;
}
.nav-affix .nav-affix-buy i, .nav-affix .nav-affix-down i {
    position: absolute; left: 50%; top: 50%;
    display: block;
    width: 6.25rem;
    height: 0.625rem;
    margin: -0.3125rem 0 0 -3.125rem;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.nav-affix .nav-affix-buy a:hover, .nav-affix .nav-affix-down a:hover {
    text-decoration: none;
}
.nav-affix .nav-affix-buy:hover i, .nav-affix .nav-affix-down:hover i {
    -webkit-transform: scale(1.78, 4.2);
    -moz-transform: scale(1.78, 4.2);
    transform: scale(1.78, 4.2);
    border-radius: 0.25rem;
}
/*nav-affix-buy*/
.nav-affix .nav-affix-buy { background: #ffae00; }
.nav-affix .nav-affix-buy:hover i { background: #ff9600; }
/*nav-affix-down*/
.nav-affix .nav-affix-down { background: #2bcd6f; }
.nav-affix .nav-affix-down:hover i { background: #26b964; }
@media (min-width: 1279px) and (max-width: 1422px) {
    .nav-affix .container{ padding: 0; }
    .nav-affix .nav-link { padding: 0 0.875rem; }
    .nav-affix .nav-narrow .nav-link {
        padding: 0 0.625rem;
        margin-right: 0.25rem;
    }
    .nav-affix .nav-affix-buy {
        margin-right: 0.375rem !important;
    }
}
@media (min-width: 1423px) and (max-width: 1599px) {
    .nav-affix .nav-narrow .nav-link {
        padding: 0 1.25rem;
    }
    .nav-affix .nav-affix-buy {
        margin-right: 0.375rem !important;
    }
}
/*nav-affix, nav-affix-buy, nav-affix-down -end*/
/*trusted*/
.trusted{
    padding-top: 20px;
}
.trusted .headline {
    padding-top: 0;
    margin-bottom: 5.625rem;
}
.trusted .trus-logo{
    display: block;
    height: 2.25rem;
    margin-bottom: 4rem;
    cursor: pointer;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    opacity: 0.5;
}
.trusted .trus-logo:hover{
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    opacity: 1;
}
.trusted .trus-logo1{
    width: 10.5625rem;
    background: url("/images/review/consociation-logo.png") no-repeat 0 0;
}
.trusted .trus-logo2{
    width: 7.875rem;
    background: url("/images/review/consociation-logo.png") no-repeat -10.5625rem 0;
}
.trusted .trus-logo3{
    width: 6.8125rem;
    background: url("/images/review/consociation-logo.png") no-repeat -18.4375rem 0;
}
.trusted .trus-logo4{
    width: 5.4375rem;
    background: url("/images/review/consociation-logo.png") no-repeat -25.25rem 0;
}
.trusted .trus-logo5{
    width: 6.625rem;
    background: url("/images/review/consociation-logo.png") no-repeat -30.6875rem 0;
}
.trusted .trus-logo6{
    width: 9.625rem;
    background: url("/images/review/consociation-logo.png") no-repeat -37.3125rem 0;
}
.trusted .trus-logo7{
    width: 10.375rem;
    margin-left: 5.375rem;
    background: url("/images/review/consociation-logo.png") no-repeat 0 -2.25rem;
}
.trusted .trus-logo8{
    width: 6.0625rem;
    background: url("/images/review/consociation-logo.png") no-repeat -10.375rem -2.25rem;
}
.trusted .trus-logo9{
    width: 10.1875rem;
    background: url("/images/review/consociation-logo.png") no-repeat -16.4375rem -2.25rem;
}
.trusted .trus-logo10{
    width: 6.5625rem;
    background: url("/images/review/consociation-logo.png") no-repeat -26.625rem -2.25rem;
}
.trusted .trus-logo11{
    width: 11.0625rem;
    margin-right: 3.375rem;
    background: url("/images/review/consociation-logo.png") no-repeat -33.1875rem -2.25rem;
}
@media (max-width: 1199px) {
    .trusted .trus-logo7 {
        margin-left: 2.875rem;
    }
}
@media (max-width: 991px) {
    .trusted .trus-logo {
        margin-bottom: 2.375rem;
    }
    .trusted .trus-logo7 {
        margin-left: 0;
    }
    .trusted .trus-logo11 {
        margin-right: 0;
    }
}
/*trusted-end*/
/*feat*/
.feat{
    position: relative;
    top: -3rem;
    padding: 0 0 2rem;
    text-align: center;
}
@media (max-width: 991px) {
    .feat{
        padding-top: 0;
    }
}
.feat .illus{
    display: block;
    height: 8.125rem;
    margin: 0 auto 1.625rem;
}
.feat .illus1{
    width: 9.5625rem;
    background: url("/images/illustration/illustration42.svg") no-repeat;
}
.feat .illus2{
    width: 10.0625rem;
    background: url("/images/illustration/illustration43.svg") no-repeat;
}
.feat .illus3{
    width: 10.0625rem;
    background: url("/images/illustration/illustration44.svg") no-repeat;
}
/*feat-end*/
/*devices*/
.devices {
    padding: 0 0 2.5rem;
    text-align: center;
    background-color: #f2f7ff;
}
.devices .items{
    height: 100%;
    padding: 2.375rem 1.875rem 1.625rem;
    border-radius: 0.5rem;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0.125rem 0.75rem 0 #d5e5ff;
    -moz-box-shadow: 0 0.125rem 0.75rem 0 #d5e5ff;
    box-shadow: 0 0.125rem 0.75rem 0 #d5e5ff;
}
.devices .items .icon{
    display: block;
    height: 3.5rem;
    margin: 0 auto 1.625rem;
    background: url("/images/icon-5.png") no-repeat;
}
.devices .items .icon1{
    width: 3.75rem;
    background-position: 0 -112px;
}
.devices .items .icon2{
    width: 3.125rem;
    background-position: -3.75rem -7rem;
}
.devices .items .icon3{
    width: 2.5rem;
    background-position: -6.875rem -7rem;
}
.devices .items .icon4{
    width: 3.25rem;
    background-position: -9.375rem -7rem;
}
.devices .items .icon5{
    width: 3.875rem;
    background-position: -12.625rem -7rem;
}
@media (max-width: 767px) {
    .devices .items {
        padding-bottom: 1rem;
    }
}
/*devices-end*/
/*formats*/
.formats{
    margin-bottom: 6.25rem;
    background: url("/images/bg/b-7.svg") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
}
.formats .headline h2{
    line-height: 3.125rem;
}
.formats .headline h2 span{
    padding: 0 0.625rem;
    margin-right: 0.625rem;
    border: 0.0625rem #0075ef solid;
    font-size: 2.375rem;
    font-weight: bold;
    color: #0075ef;
}
.formats .box{
    position: relative;
    width: 20%;
    height: 9.6875rem;
}
@media (max-width: 991px) {
    .formats .box{
        margin-bottom: 0.9375rem;
    }
}
@media (max-width: 767px) {
    .formats .headline h2{
        line-height: 2.25rem;
    }
    .formats .headline h2 span {
        font-size: 1.625rem;
    }
}
.formats .items{
    position: absolute;
    bottom: 0;
    padding: 1.25rem 1rem 1rem;
    border-radius: 0.5rem;
    cursor: pointer;
    background-color: #f8f9fa;
}
.formats .items .icon-brief {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    font-size: 1.125rem;
    color: #888888;
}
.formats .items .icon{
    display: block;
    width: 4.75rem;
    height: 3.875rem;
    margin: 0 auto 1.25rem;
    background: url("/images/icon-5.png") no-repeat;
}
.formats .items .icon1{
    background-position: 0 -10.5rem;
}
.formats .items .icon2{
    background-position: -4.75rem -10.5rem;
}
.formats .items .icon3 {
    background-position: -9.5rem -10.5rem;
}
.formats .items .icon4 {
    background-position: -14.25rem -10.5rem;
}
.formats .items .icon5{
    background-position: 0 -14.375rem;
}
.formats .items .titles{
    font-size: .875rem;
    color: #4c4c4c;
    text-align: center;
}
.formats .items .text{
    height: 0;
    overflow: hidden;
    transition: all .8s;
    font-size: .875rem;
}
@media (max-width: 767px) {
    .formats .box {
        position: static;
        height: auto;
    }
    .formats .items , .formats .items .icon-brief {
        position: static;
    }
    .formats .items .text {
        height: auto;
        overflow: visible;
    }
}
/*formats-end*/
/*lossSituations*/
.lossSituations{
    padding-bottom: 6.25rem;
}
.lossSituations h3{
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: bold;
    color: #333333;
}
.lossSituations ul{
    padding-left: 1.125rem;
}
.lossSituations ul li{
    margin-bottom: 0.375rem;
    list-style: disc;
}
.lossSituations i{
    font-style: italic;
}
.lossSituations .items{
    height: 100%;
    padding: 2.375rem 1.875rem 1.625rem;
    border-radius: 0.5rem;
    cursor: pointer;
    background-color: #f2f7ff;
}
.lossSituations .items .titles{
    text-align: center;
}
.lossSituations .items .icon{
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    margin: 0 auto 1.25rem;
    background: url("/images/icon-5.png") no-repeat;
}
.lossSituations .items .icon1{
    width: 2.875rem;
    background-position: 0 0;
}
.lossSituations .items .icon2{
    background-position: -2.875rem 0;
}
.lossSituations .items .icon3{
    width: 48px;
    background-position: -6.375rem 0;
}
.lossSituations .items .icon4{
    width: 46px;
    background-position: -9.375rem 0;
}
.lossSituations .items .icon5{
    background-position: -12.25rem 0;
}
.lossSituations .items .icon6{
    background-position: -15.75rem 0;
}
/*lossSituations-end*/
/*works*/
.works{
    padding-bottom: 21.25rem;
    color: #ffffff;
    background: url("/images/bg/b-8.svg") no-repeat bottom center;
    -webkit-background-size: cover;
    background-size: cover;
}
.works .headline h2 {
    color: #ffffff;
}
.works .video{
    position: relative;
    height: 100%;
    border-radius: 0.75rem;
    background: #000000;
    overflow: hidden;
}
.works .video .icon-video{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    margin-left: -23px;
    margin-top: -23px;
    font-size: 46px;
    color: rgba(255,255,255,.6);
    cursor: pointer;
}
.works .video .youtube-href{
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    width: 480px;
    height: 360px;
    margin-left: -240px;
}
.works .video .youtube-href img{
    opacity: .6;
    -webkit-transition: 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.works .video .youtube-href:hover{
    text-decoration: none;
}
.works .video .youtube-href:hover img{
    opacity: .8;
    -webkit-transform: scale(1.3, 1.3);
    transform: scale(1.2, 1.2);
}
.works ul li{
    margin-bottom: 0.625rem;
    font-size: 1.25rem;
}
.works ul li .icon-yes{
    margin-right: 0.5rem;
    font-size: 1rem;
}
@media (max-width: 767px) {
    .works {
        padding-bottom: 16.25rem;
    }
    .works ul li{
        font-size: 1rem;
    }
    .works .video .youtube-href{
        left: 0;
        width: 100%;
        height: 100%;
        margin-left: 0;
    }
    .works .video .youtube-href img{
        width: 100%;
        height: 100%;
    }
}
/*works-end*/
/*User Guide*/
.user-guide {
    position: relative;
    top: -4.375rem;
    padding: 0 0 3.75rem;
    background: url("/images/bg/user-guide-step-bg.png") no-repeat 20rem 3.75rem;
}
.user-guide .illus{
    position: absolute;
    left: -6.25rem;
    bottom: 0;
    z-index: -1;
    display: block;
    width: 20.375rem;
    height: 20.375rem;
    background: url("/images/illustration/illustration48.svg") no-repeat;
}
.user-guide .user-guide-step {
    float: left;
    padding-left: 0;
    margin-left: 1rem;
    border-left: .0625rem dashed #a8a8a8;
    color: #666666;
}
.user-guide .user-guide-step li {
    position: relative;
    padding-left: 1.5rem;
    cursor: pointer;
}
.user-guide .user-guide-step li span {
    position: absolute;
    top: 0;
    left: -1rem;
    display: inline-block;
    width: 2rem;
    height: 2rem;
    border-radius: 1rem;
    background: transparent;
}
.user-guide .user-guide-step li span i {
    display: inline-block;
    width: 1.375rem;
    height: 1.375rem;
    margin: 0.3125rem;
    color: #ffffff;
    text-align: center;
    line-height: 1.375rem;
    border-radius: 0.6875rem;
    background: #888888;
}
.user-guide .user-guide-step .current > .step-title { color: #0075ef; }
.user-guide .user-guide-step .current > span { background: #d4e9ff; border: none; color: #fff; }
.user-guide .user-guide-step .current > span i { background: #0075ef; border: none; color: #fff; }
.user-guide .user-guide-step .step-title {
    font-size: 1.25rem;
    font-weight: bold;
}
.user-guide .user-guide-img{
    position: relative;
    height: 100%;
    margin-top: 2.8125rem;
}
.user-guide .user-guide-img li {
    position: absolute;
    top: 0;
    right: 0;
    display: none;
    width: 100%;
    height: auto;
    overflow: hidden;
    -webkit-border-radius: 0.625rem;
    -moz-border-radius: 0.625rem;
    border-radius: 0.625rem;
    animation: scale8 .6s ease both;
}
.user-guide .user-guide-img li img{
    width: 100%;
    height: auto;
    border: .0625rem  #e5e5e5 solid;
}
@keyframes scale8 {
    from { transform: scale(0.8, 0.8); }
}
.user-guide .btn-first{
    width: 16rem;
}
.user-guide .btn-first:hover i {
    -webkit-transform: scale(2.56, 6);
    -moz-transform: scale(2.56, 6);
    transform: scale(2.56, 6);
}
.user-guide .btn-second {
    border: none;
    background: #168eff;
}
.user-guide .btn-second a:hover {
    background: #0083ff;
}
.user-guide .btn-second:hover i { background: #0083ff; }
@media (max-width: 991px) {
    .user-guide .user-guide-img {
        height: 29.375rem;
    }
}
@media (max-width: 767px) {
    .user-guide {
        top: -8.125rem;
        padding-bottom: 0;
    }
    .user-guide .btn-first {
        width: 100%;
    }
    .user-guide .user-guide-img {
        height: 16.25rem;
    }
}
/*User Guide-end*/
/*spec*/
.spec{
    position: relative;
}
.spec .headline{
    padding-top: 1.875rem;
}
.spec .illus{
    position: absolute;
    right: 0;
    bottom: -12.5rem;
    z-index: -1;
    display: block;
    width: 21.625rem;
    height: 21.625rem;
    background: url("/images/illustration/illustration48.svg") no-repeat;
}
@media (max-width: 1599px) {
    .spec .illus{
        display: none;
    }
}
.spec .icon{
    display: block;
    width: 4.75rem;
    height: 3.875rem;
    margin-bottom: 1.25rem;
    background: url("/images/icon-5.png") no-repeat;
}
.spec .icon1{
    background-position: -4.75rem -14.375rem;
}
.spec .icon2{
    background-position: -9.5rem -14.375rem;
}
.spec .icon3{
    background-position: -14.25rem -14.375rem;
}
/*spec-end*/
/*discuss*/
.discuss{
    position: relative;
}
.discuss .illus{
    position: absolute;
    top: 18.75rem;
    left: 0;
    z-index: -1;
    display: block;
    width: 20.375rem;
    height: 53.375rem;
    background: url("/images/illustration/illustration50.svg") no-repeat;
}
.discuss .box{
    position: relative;
    width: 100%;
    height: 28.75rem;
    padding-top: 4.375rem;
    background: url("/images/bg/b-10.svg") no-repeat;
}
/*left*/
.discuss #discussCarousel .carousel-inner{
    width: 90%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    color: #ffffff;
}
.discuss #discussCarousel .editor-logo img{
    width: 100%;
}
.discuss #discussCarousel .tits{
    font-size: 1.375rem;
    font-weight: bold;
    line-height: 1.875rem;
}
.discuss #discussCarousel .name{
    margin-bottom: 2.25rem;
    font-size: 0.875rem;
}
.discuss #discussCarousel .more a{
    font-size: 0.875rem;
    color: #ffffff;
}
.discuss .di-left .icon-arrows-left, .discuss .di-left .icon-arrows-right{
    color: #ffffff;
}
.discuss .di-left .carousel-control-next{
    right: 4.875rem;
}
/*left-end*/
/*right*/
.discuss h5{
    margin-bottom: 2.5rem;
    font-size: 1.625rem;
    font-weight: bold;
    color: #333333;
    text-align: center;
}
.discuss #UserCarousel .carousel-inner{
    width: 80%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.discuss #UserCarousel .carousel-inner .icon-star {
    margin-left: 0.125rem;
    font-size: 0.875rem;
    color: #ffc501;
}
/*right-end*/
.discuss .carousel-control-next, .discuss .carousel-control-prev {
    position: absolute;
    top: auto;
    bottom: 1.25rem;
}
@media (max-width: 1199px) {
    .discuss .box{
        height: 24.375rem;
        padding-top: 1.875rem;
    }
    .discuss #discussCarousel .name {
        margin-bottom: 1.375rem;
    }
}
@media (max-width: 991px) {
    .discuss .box{
        height: 100%;
        background-image: none;
    }
    .discuss .di-left{
        margin-bottom: 2.5rem;
    }
    .discuss #discussCarousel .carousel-inner{
        width: 100%;
        color: #4c4c4c;
    }
    .discuss #discussCarousel .more a {
        color: #525252;
    }
    .discuss #UserCarousel .carousel-inner{
        width: 100%;
    }
    .discuss h5{margin-bottom: 1.25rem;}
    .discuss .carousel .carousel-inner{ width: 100%;}
}
/*discuss-end*/
/*Edition comparison*/
.edition {
    position: relative;
    padding: 3.75rem 0 6.25rem;
}
.edition .illus{
    position: absolute;
    right: 0;
    top: 7.5rem;
    z-index: -1;
    display: block;
    width: 38.75rem;
    height: 96.25rem;
    background: url("/images/illustration/illustration51.svg") no-repeat;
}
.edition .items {
    position: relative;
    height: 38.25rem;
    padding-bottom: 1.375rem;
    text-align: center;
    -webkit-border-radius: 0.5rem;
    -moz-border-radius: 0.5rem;
    border-radius: 0.5rem;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0.125rem 0.625rem 0 #d6e1f1;
    -moz-box-shadow: 0 0.125rem 0.625rem 0 #d6e1f1;
    box-shadow: 0 0.125rem 0.625rem 0 #d6e1f1;
}
.edition .items .items-title {
    padding: 1rem 0;
    margin-bottom: 2.125rem;
    text-align: center;
    -webkit-border-radius: 0.375rem 0.375rem 0 0;
    -moz-border-radius: 0.375rem 0.375rem 0 0;
    border-radius: 0.375rem 0.375rem 0 0;
    font-size: 1.5rem;
    color: #333333;
    background: #f3f8fe;
}
.edition .items .items-title .icon-technician{
    margin-right: 0.625rem;
    font-size: 1.875rem;
    color: #168eff;
}
.edition .items ul {
    padding: 0 1.875rem;
}
.edition .items ul li {
    text-indent: -1.25rem;
    margin-left: 1.25rem;
    margin-bottom: 1rem;
    text-align: left;
}
.edition .items ul li .icon-tick {
    margin-right: .5rem;
    vertical-align:middle;
    color: #00c0ff;
}
.edition .items ul li.no {
    text-indent: 0;
    color: #999999;
}
.edition .standard{
    height: 40.875rem;
}
.edition .standard .items-title{
    position: relative;
    padding: 1.3125rem 0 1.3125rem 3.125rem;
    font-weight: bold;
    color: #ffffff;
    background: #168eff;
}
.edition .standard .items-title .icon-1{
    display: block;
    position: absolute;
    top: -2.875rem;
    left: -0.375rem;
    width: 6.75rem;
    height: 7rem;
    background: url("/images/icon-3.png") no-repeat -1129px -188px;
}
.edition .items .items-bottom {
    position: absolute;
    left: 50%;
    bottom: 1.25rem;
    margin-left: -8.125rem;
    text-align: center;
}
.edition .items .items-bottom .pr{
    margin-bottom: 0.5rem;
    font-size: 1.875rem;
}
/*!*down buy*!*/
.edition .down, .edition .buy {
    position: relative;
    width: 16.25rem;
    height: 3.375rem;
    margin: 0 auto 0.375rem;
    border-radius: 0.375rem;
    cursor: pointer;
    background: #ffae00;
}
.edition .down a, .edition .buy a {
    position: absolute;
    top: 0; left: 0;
    display: block;
    z-index: 2;
    width: 100%;
    height: 100%;
    line-height: 3.375rem;
    font-size: 1.375rem;
    font-weight: 700;
    color: #ffffff;
    text-align: center;
}
.edition .down i, .edition .buy i {
    position: absolute; left: 50%; top: 50%;
    display: block;
    width: 6.25rem;
    height: 0.625rem;
    margin: -0.3125rem 0 0 -3.125rem;
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.edition .down a:hover, .edition .buy a:hover { text-decoration: none; }
.edition .down:hover i, .edition .buy:hover i {
    opacity: 1;
    border-radius: 0.125rem;
    background: #ff9600;
    -webkit-transform: scale(2.6, 5.4);
    -moz-transform: scale(2.6, 5.4);
    transform: scale(2.6, 5.4);
}
/*down*/
.edition .down { background: #2bcd6f; }
.edition .down:hover i { background: #26b964; }
@media (max-width: 991px) {
    .edition{
        padding-bottom: 0;
    }
    .edition .items {
        height: 100%;
    }
    .edition .standard .items-title {
        padding-left: 0;
    }
    .edition .items ul {
        margin-bottom: 1.875rem;
    }
    .edition .items .items-bottom {
        position: static;
        margin-left: 0;
    }
}
/*Edition comparison-end*/
/*hotSituations*/
.hotSituations{
    padding-bottom: 6.25rem;
}
.hotSituations h3{
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: bold;
    color: #333333;
}
.hotSituations .items{
    height: 100%;
    padding: 2.375rem 1.875rem 1.625rem;
    border-radius: 0.5rem;
    -webkit-box-shadow: 0 0.125rem 0.625rem 0 #e0e0e0;
    -moz-box-shadow: 0 0.125rem 0.625rem 0 #e0e0e0;
    box-shadow: 0 0.125rem 0.625rem 0 #e0e0e0;
    background-color: #ffffff;
}
.hotSituations .items .titles{
    padding: 0 1.25rem;
    line-height: 1.625rem;
    text-align: center;
}
.hotSituations .items .icon{
    display: block;
    height: 4.875rem;
    margin: 0 auto 1.25rem;
    background: url("/images/icon-5.png") no-repeat;
}
.hotSituations .items .icon1{
    width: 5.1875rem;
    background-position: 0 -18.25rem;
}
.hotSituations .items .icon2{
    width: 5.125rem;
    background-position: -11.75rem -28rem;
}
.hotSituations .items .icon3{
    width: 5.375rem;
    background-position: 0 -28rem;
}
.hotSituations .items .icon4{
    width: 6.375rem;
    background-position: -5.375rem -28rem;
}
.hotSituations .items .icon5{
    width: 3.625rem;
    background-position: -7.6875rem -23.125rem;
}
.hotSituations .items .icon6{
    width: 4.6875rem;
    background-position: -11.375rem -23.125rem;
}
/*lossSituations-end*/
/*faq*/
.faq{
    padding-bottom: 18.75rem;
    background: url("/images/bg/b-9.svg") no-repeat bottom center;
    -webkit-background-size: cover;
    background-size: cover;
}
.faq .headline h2{
    color: #ffffff;
}
.faq .card{
    padding: 1rem 1.625rem 0.125rem;
    margin-bottom: 1.25rem;
    border: none;
    border-radius: 0.5rem;
}
.faq .card .card-header {
    padding: 0;
    background-color: #ffffff;
    border-bottom: none;
}
.faq .card .card-header a:hover{
    text-decoration: none;
}
.faq .card .card-header .faq-titles{
    display: block;
    padding: 0;
    margin-bottom: .625rem;
    font-size: 1.25rem;
    font-weight: bold;
    color: #333333;
    outline: none;
}
.faq .card .card-body{
    padding: 0;
}
/*faq-end*/
/*updates*/
.updates{
    position: relative;
    top: -5rem;
}
.updates .headline{
    padding-top: 0;
}
.updates .items{
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    margin-bottom: 3.125rem;
    font-size: 1.125rem;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
.updates .one{
    color: #ffffff;
    border-radius: .5rem 0 0 .5rem;
    background-color: #168eff;
}
.updates .two{
    border-radius: 0 .5rem .5rem 0;
    background-color: #daedff;
}
.updates .title{
    margin-bottom: 1.5rem;
    font-size: 1.875rem;
    font-weight: bold;
    color: #333333;
}
.updates ul li{
    margin-left: 1.375rem;
    margin-bottom: 1.125rem;
    text-indent: -1.375rem;
    font-size: 1.125rem;
}
.updates .twoText{
    display: none;
}
@media (max-width: 991px) {
    .updates img{
        width: 100%;
    }
}
@media (max-width: 767px) {
    .updates .items, .updates ul li {
        font-size: 1rem;
    }
}
/*updates-end*/
/*downTwo*/
.downTwo{
    padding: 5rem 0;
}
@media (max-width: 1599px) {
    .downTwo{
        padding-top: 1.25rem;
    }
}
.downTwo .title{
    font-size: 2.375rem;
    font-weight: bold;
    color: #333333;
}
.downTwo .title span{
    padding: 0.375rem;
    border-radius: 0.5rem;
    font-size: 1.125rem;
    font-weight: bold;
    color: #ffffff;
    background-color: #ffaa66;
}
.downTwo p{
    font-size: 1.375rem;
}
.downTwo .btn-first{
    width: 18.75rem;
    height: 4.25rem;
    border-radius: 0.625rem;
    background: -webkit-linear-gradient(left top, #6ee776, #12b572); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(bottom right, #6ee776, #12b572); /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(bottom right, #6ee776, #12b572); /* Firefox 3.6 - 15 */
    background: linear-gradient(to bottom right, #6ee776, #12b572); /* standard */
    -webkit-box-shadow: 0 0.25rem 1.125rem 0 #a2dcaf;
    -moz-box-shadow: 0 0.25rem 1.125rem 0 #a2dcaf;
    box-shadow: 0 0.25rem 1.125rem 0 #a2dcaf;
}
.downTwo .btn-first a{
    font-size: 1.375rem;
    line-height: 4.25rem;
}
.downTwo a .icon-down-circle {
    font-size: 1.5rem;
    vertical-align: baseline;
}
.downTwo a:hover{
    -webkit-box-shadow: 0 0.375rem 1.125rem 0 #98d8a7;
    -moz-box-shadow: 0 0.375rem 1.125rem 0 #98d8a7;
    box-shadow: 0 0.375rem 1.125rem 0 #98d8a7;
}
@media (max-width: 1199px) {
    .downTwo .title {
        font-size: 2.125rem;
    }
    .downTwo p {
        font-size: 1.125rem;
    }
}
@media (max-width: 991px) {
    .downTwo img{
        width: 100%;
    }
}
@media (max-width: 767px) {
    .downTwo .title {
        font-size: 1.75rem;
    }
}
/*downTwo-end*/
/*productBannerDown*/
.productBannerDown-win{
    background: url("/images/bg/b-2.png") no-repeat top center;
    -webkit-background-size: cover;
    background-size: cover;
}
/*productBannerDown-end*/