img{max-width:100%;}
.detail{width:1200px; margin:0 auto; padding:0;}
a {text-decoration: none;color: #00b2f2;}
li {list-style: none;}
.clear {clear: both;}
body {background-color: #fff;font-family: tahoma;}
/*-------------*/
.main01 {background: #fff url(../images/new-index/main1-bg.jpg) top center no-repeat;padding: 60px 0 50px;text-align: center;}
.main01 .detail {position: relative;}
.main01 h1 {font-size: 45px;color: #000;font-weight: 600;line-height: 56px;}
.main01 h1 span {color: #00b2f2;}
.main01 h3 {font-size: 27px;line-height: 32px;color: #333333;margin: 10px 0 20px;}
.main01 h3+p {font-size: 15px;color: #666666;line-height: 24px;margin: 0 200px;}
.btn-container {margin: 30px 0;}
.btn-container li {display: inline-block;vertical-align: middle;text-align: left;margin-right: 24px;}
.btn-container .to-win>a,
.btn-container .to-mac>a {display: inline-block;font-size: 27px;color: #fff;padding: 18px 80px 18px 24px;border-radius: 4px;margin-bottom: 10px;background: #00baff url(../images/new-index/download-win-icon.png) right 24px center no-repeat;}
.btn-container .to-mac>a {background: #78C443 url(../images/new-index/download-mac-icon.png) right 24px center no-repeat;}
.btn-container .to-buy>a {display: inline-block;font-size: 27px;color: #fff;padding: 18px 110px 18px 66px;border-radius: 4px;margin-bottom: 10px;background: #feb91a url(../images/new-index/buy-icon.png) right 30px center no-repeat;}
.btn-container .to-win>a:hover,
.btn-container .to-mac>a:hover,
.btn-container .to-buy>a:hover {text-decoration: none;box-shadow: 0 0 6px 3px rgba(0,0,0,0.1);}
.btn-container .to-win>a.the-mobile-icon {background: #00baff url(../images/new-index/win-mac.png) right 24px center no-repeat;;}
.btn-container p {font-size: 15px;color: #808080;text-align: center;}
.btn-container p a {color: #00b2f2;}
.langs-list {position: absolute;top: -30px;right: 0;cursor: pointer;}
.langs-list .the-lang {width: 98px;height: 34px;line-height: 34px;text-align: center;border: 1px solid #e5e5e5;font-size: 15px;color: #666666;border-radius: 2px;}
.langs-list .the-list {display: none;border-radius: 2px;background-color: #fff;overflow: hidden;}
.langs-list .the-list a {display: block;width: 88px;height: 38px;font-size: 15px;color: #666666;line-height: 38px;margin: 0 auto;border-bottom: 1px solid #e5e5e5;}
.langs-list .the-list a:last-child {border-bottom: none;}
.langs-list .the-list a:hover,
.langs-list .the-list a.lang-active {width: 100%;text-decoration: none;color: #1b9af7;background-color: #e9fcff;border-bottom-color: #e9fcff;}


.main02 {padding: 0 0 50px;}
.feature-list {text-align: center;}
.feature-list li {display: inline-block;vertical-align: top;width: 366px;}
.feature-list li:nth-child(2) {margin: 0 50px;}
.feature-list li h3 {font-size: 27px;color: #000000;line-height: 32px;margin: 10px 0;}
.feature-list li h3 span {color: #1b9af7;font-size: 22px;}
.feature-list li p {font-size: 17px;color: #666666;line-height: 26px;margin: 0 50px 20px;}
.feature-list+p {font-size: 15px;line-height: 24px;margin-top: 20px;text-align: center;text-decoration: underline;color: #666666;cursor: pointer;}
.feature-list+p span {display: inline-block;vertical-align: middle;width: 19px;height: 19px;background-color: #399fff;border-radius: 50%;margin-right: 10px;overflow: hidden;}
.feature-list+p span::before {content: "";border-top: 4px solid transparent;border-bottom: 4px solid transparent;border-left: 8px solid #fff;margin: 5px 0 0 7px;font-size: 0;line-height: 0;display: block;}
.video-container {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.8);z-index: 100000;}
.video-container .the-video {position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);}


.main03 {padding: 50px 0;text-align: center;}
.main03 .detail {width: 1100px;}
.main03 h2 {font-size: 37px;line-height: 48px;color: #000;font-weight: 600;}
.main03 h2+p {font-size: 17px;color: #666666;line-height: 26px;margin: 10px 100px 40px;}
.toggle-import-container {position: relative;}
.import-arrow-left,.import-arrow-right {width: 40px;height: 60px;position: absolute;top: 14%;cursor: pointer;z-index: 10;}
.import-arrow-left {left: 0;}
.import-arrow-left::before {content: "";display: block;width: 12px;height: 12px;border-top: 4px solid #399fff;border-left: 4px solid #399fff;transform: rotate(-45deg);margin: 22px auto 0;}
.import-arrow-right {right: 0;}
.import-arrow-right::before {content: "";display: block;width: 12px;height: 12px;border-top: 4px solid #399fff;border-right: 4px solid #399fff;transform: rotate(45deg);margin: 22px auto 0;}
.import-arrow-disabled::before {border-color: #999;}
.import-list-content {width: 990px;height: 110px;margin: 0 auto;overflow: hidden;}
.import-list li {float: left;width: 110px;height: 110px;text-align: center;}
.import-list li .img-container {height: 60px;margin-bottom: 10px;}
.import-list li p {display: inline-block;font-size: 15px;color: #4c4c4c;border-bottom: 1px dotted #4c4c4c;cursor: pointer;margin-bottom: 10px;}
.import-list li .corresponding-info {display: none;width: 290px;box-sizing: border-box;position: absolute;border: 1px dotted #4c4c4c;color: #4c4c4c;font-size: 11px;line-height: 18px;padding: 5px;text-align: left;height: auto;border-radius: 5px;background-color: #fdfefe;z-index: 5;}
.import-list li .corresponding-info::before {content: "";position: absolute;top: -5px;left: 44px;border-left: 4px solid transparent;border-right: 4px solid transparent;border-bottom: 5px solid #333;;}
.line-animation {width: 1766px;height: 11px;margin: 40px auto 0;background: url(../images/new-index/main3-line-img.png) center center no-repeat;position: relative;overflow: hidden;}
.line-animation span {width: 180px;height: 100%;background-image: linear-gradient(to right,transparent,#97d1f1);background-image: -webkit-linear-gradient(to right,transparent,#97d1f1);background-image: -moz-linear-gradient(to right,transparent,#97d1f1);background-image: -o-linear-gradient(to right,transparent,#97d1f1);position: absolute;top: 0;border-radius: 0 8px 8px 0;left: -180px;}
.line-animation span:first-child {opacity: 0;animation: s1 10s linear infinite;}
.line-animation span:last-child {opacity: 0;animation: s2 10s linear 5s infinite;}
@keyframes s1 {
    0% {opacity: 0;}
    20% {opacity: 1;}
    60% {opacity: 1;}
    100% {left: 100%;opacity: 0;}
}
@keyframes s2 {
    0% {opacity: 0;}
    20% {opacity: 1;}
    60% {opacity: 1;}
    100% {left: 100%;opacity: 0;}
}


.main04 {padding: 30px 0 60px;text-align: center;}
.main04 .detail {width: 1100px;}
.main04 h2 {font-size: 37px;line-height: 48px;color: #333333;}
.main04 h2+p {font-size: 17px;color: #666666;line-height: 26px;margin: 20px 100px 50px;}
.left-right-container .img-container {width: 600px;float: left;margin-right: 20px;}
.left-right-container .info-list {width: 480px;float: left;padding-top: 12px;}
.info-list li {text-align: left;padding: 26px 46px 26px 66px;border-radius: 10px;position: relative;}
.info-list li::before {display: none;content: "";font-size: 0;line-height: 0;border-top: 10px solid transparent;border-bottom: 10px solid transparent;border-right: 13px solid #ebf9ff;position: absolute;top: 50%;left: -13px;margin-top: -10px;}
.info-list li h3 {font-size: 21px;color: #000;line-height: 32px;margin-bottom: 5px;position: relative;}
.info-list li h3::before {content: "";font-size: 0;line-height: 0;width: 6px;height: 6px;background-color: #000;border-radius: 50%;position: absolute;top: 50%;left: -20px;margin-top: -3px;}
.info-list li p {font-size: 15px;color: #666666;line-height: 24px;}
.info-list li.on-active {background-color: #ebf9ff;}
.info-list li.on-active::before {display: block;}
.info-list li.on-active h3 {color: #399fff;}
.info-list li.on-active h3::before {background-color: #399fff;}
.info-list .has-anchor {padding-top: 10px;}
.info-list .has-anchor a {color: #1b9af7;font-size: 15px;line-height: 24px;}


.main05 {padding: 40px 0;background: #fcfcfc url(../images/new-index/main5-bg.png) center 25px no-repeat;background-size: 107% auto;}
.left-section {float: left;width: 534px;}
.right-section {float: right;width: 534px;}
.section-same-style .icon-container {text-align: center;height: 169px;}
.section-same-style h3 {font-size: 21px;color: #333333;line-height: 32px;margin: 20px 0 30px;text-align: center;}
.section-info-list li {display: inline-block;vertical-align: middle;width: 250px;border: 1px solid #e6e6e6;border-radius: 5px;box-sizing: border-box;padding: 16px 10px 16px 30px;position: relative;margin-bottom: 18px;}
.section-info-list li:nth-child(2n+1) {margin-right: 34px;}
.section-info-list li img {position: absolute;top: 50%;left: -20px;margin-top: -20px;}
.section-info-list li p {font-size: 15px;color: #666666;line-height: 24px;}
.section-info-list li p span {color: #ff2222;}


.main06 {padding: 50px 0;text-align: center;background-color: #fff;}
.main06 .detail {width: 1100px;}
.main06 h2 {font-size: 37px;line-height: 48px;color: #333333;}
.main06 h2+p {font-size: 17px;color: #666666;line-height: 26px;margin: 20px 100px 50px;}
.main06 h2+p a {color: #00b2f2;}
.main06 h2+p a:hover {color: #00b2f2;}


.main07 {padding: 50px 0;background: #fff url(../images/new-index/main7-bg.jpg) center bottom no-repeat;}
.feature-info-list {text-align: center;}
.feature-info-list li {display: inline-block;vertical-align: middle;width: 250px;text-align: center;}
.feature-info-list li:nth-child(2) {margin: 0 170px;}
.feature-info-list li div {width: 208px;height: 208px;margin: 0 auto;border-radius: 50%;box-shadow: 0 10px 20px 0 rgba(168,182,183,0.1);overflow: hidden;}
.feature-info-list li h3 {font-size: 21px;color: #000;line-height: 32px;margin: 20px 0 10px;}
.feature-info-list li p {font-size: 15px;line-height: 24px;color: #666666;text-align: left;}
.feature-info-list li p a {color: #00b2f2;}
.feature-info-list li p a:hover {color: #00b2f2;}


.main08 {padding: 30px 0 50px;background: #fbfbfb url(../images/new-index/main8-bg.jpg) center top no-repeat;}
.main08 h2 {font-size: 37px;line-height: 48px;color: #333333;margin-bottom: 64px;text-align: center;}
.type-info-list {text-align: center;}
.info-same-style {display: inline-block;vertical-align: top;width: 320px;}
.left-info-same {text-align: right;}
.right-info-same {text-align: left;}
.info-same-style .info-content:first-child {margin-bottom: 66px;}
.info-same-style .info-content h3 {font-size: 21px;color: #000;line-height: 32px;margin-bottom: 10px;}
.info-same-style .info-content p {font-size: 15px;line-height: 24px;color: #808080;}
.type-list-container {display: inline-block;vertical-align: top;width: 368px;margin: 0 90px;}
.type-list {float: left;width: 124px;padding: 0 30px 70px;text-align: center;}
.type-list:nth-child(-n+2) {padding-bottom: 90px;}
.type-list p {font-size: 15px;line-height: 24px;color: #666666;margin-top: 14px;}


.main09 {padding: 50px 0;background-color: #fbfbfb;border-bottom: 6px solid #fff;}
.intro-list {text-align: center;}
.intro-list li {display: inline-block;vertical-align: bottom;height: 184px;width: 260px;box-sizing: border-box;padding: 26px 20px 0;text-align: center;cursor: pointer;}
.intro-list li.right-bottom-border-style {border-right: 1px solid #eaeaeb;border-bottom: 1px solid #eaeaeb;}
.intro-list li.bottom-border-style {border-bottom: 1px solid #eaeaeb;}
.intro-list li.right-border-style {border-right: 1px solid #eaeaeb;}
.intro-list li.on-click-status {border-color: #fff;border-radius: 5px;background-color: #fff;box-shadow: 0 0 6px 0 rgba(0,0,0,0.1);}
.intro-list li div {height: 44px;}
.intro-list li h4 {font-size: 17px;color: #343434;line-height: 26px;margin: 14px 0 10px;}
.intro-list li p {display: none;font-size: 15px;color: #808080;line-height: 24px;}
.intro-list li.on-click-status p {display: block;}


.main10 {padding: 50px 0;background: #fbfbfb url(../images/new-index/main10-bg.jpg) center bottom no-repeat;border-bottom: 6px solid #fff;}
.main10 .detail {width: 1100px;}
.main10 h2 {font-size: 37px;line-height: 48px;color: #333333;margin-bottom: 40px;text-align: center;}
.toggle-img-container {position: relative;}
.toggle-img-arrow-left,.toggle-img-arrow-right {width: 60px;height: 80px;position: absolute;top: 50%;margin-top: -40px;cursor: pointer;}
.toggle-img-arrow-left {left: 0;}
.toggle-img-arrow-right {right: 0;}
.toggle-img-arrow-left::before {content: "";display: block;width: 30px;height: 30px;border-top: 4px solid #4e78cc;border-left: 4px solid #4e78cc;transform: rotate(-45deg);margin: 20px auto 0;}
.toggle-img-arrow-right::before {content: "";display: block;width: 30px;height: 30px;border-top: 4px solid #4e78cc;border-right: 4px solid #4e78cc;transform: rotate(45deg);margin: 20px auto 0;}
.toggle-img-content {width: 860px;overflow: hidden;margin: 0 auto;}
.toggle-img-list li {width: 860px;text-align: center;float: left;}
.toggle-img-container+p {font-size: 17px;line-height: 26px;color: #343435;margin: 30px 0 20px;text-align: center;}
.main10 .btn-container {text-align: center;}
.main10 .btn-container li p {text-align: center;}


.main11 {padding: 50px 0;background-color: #fafafa;text-align: center;}
.main11 .detail {width: 1100px;}
.main11 h3 {display: inline-block;font-size: 27px;line-height: 32px;color: #000;background: url(../images/new-index/mark-left.png) left top no-repeat,url(../images/new-index/mark-right.png) right top no-repeat;padding: 8px 54px 20px;}
.review-content {width: 900px;margin: 0 auto;overflow: hidden;}
.review-content-list::after {content: "";display: block;clear: both;}
.review-content-list li {float: left;font-size: 17px;color: #666666;line-height: 26px;}
.review-list {padding: 16px 0;text-align: center;background-color: #fff;border-radius: 6px;margin: 44px 0 100px;}
.review-list li {display: inline-block;vertical-align: middle;margin: 0 20px;height: 57px;border-radius: 5px;cursor: pointer;}
.review-list li img:last-child {display: none;}
.review-list li.review-on-active img:first-child {display: none;}
.review-list li.review-on-active img:last-child {display: block;}
.left-about-content {float: left;width: 520px;margin-right: 100px;text-align: left;}
.left-about-content h4 {font-size: 27px;line-height: 32px;color: #000;}
.left-about-content p {font-size: 15px;line-height: 24px;color: #666666;margin: 20px 0 30px;}
.left-about-content p a {color: #00b2f2;}
.about-share-list li {margin-right: 20px;display: inline-block;vertical-align: top;}
.right-about-content {float: left;width: 480px;}
.right-about-content li {padding: 16px 20px 16px 40px;background-color: #fff;border-radius: 4px;margin-bottom: 14px;font-size: 15px;line-height: 24px;text-align: left;}
.right-about-content li:hover {box-shadow: 0 0 4px 1px rgba(0,0,0,0.1);}
.right-about-content li a {color: #333333;}
.right-about-content li:hover a {color: #2987f1;text-decoration: none;}
.about-content-container+p {font-size: 15px;line-height: 24px;color: #808080;margin-top: 46px;}


.fixed-header { background:#00BAFF; width: 100%; position: fixed; top: 0; left: 0; z-index: 10000; display: none; }
.fixed-header .detail { height: 80px; margin: 0 auto; }
.fixed-header .Logo { width: 138px; height: 40px; float: left; padding: 20px 0 0; }
.fixed-header .Btn { width: 350px; float: right; padding: 8px 0 0; }
.fixed-header .Buy {  width: 150px; text-align: center; cursor: pointer; float: left; padding: 5px 0 0; margin: 0 20px 0 0; }
.fixed-header .Buy p { color: #fffb95; font-weight: 800; font-size: 17px; line-height: 20px; }
.fixed-header .Buy p i { font-size: 11px; color: #245668; display: block; font-style: normal; font-weight: 400; }
.fixed-header .Down { width: 155px; height: 44px; border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;background: #fff; color: #0fb4ff; float: left;  text-align: center;cursor: pointer; transition:all 0.4s;-webkit-transition:all 0.4s;  -moz-transition:all 0.4s;  }
.fixed-header .Down:hover { background: #f5f5f5; }
.fixed-header .Down p {  font-weight: 800; font-size: 17px; line-height: 44px; }
.fixed-header .Down p i { font-size: 11px;  display: block; font-style: normal; font-weight: 400; line-height: 18px; }
.fixed-header ul { float: right; font-size: 17px; color: #fff; width: 360px; padding: 28px 0 0; }
.fixed-header ul li {  float: left; width: 120px; text-align: center; }
.fixed-header ul li a { color: #fff; text-decoration:none; }


/* CSS Document */
.MainFoot { background:#656565;}
.MainFoot .Details {  width:1280px; margin:0 auto; padding:10px 0;  } 
.MainFoot .Details p { text-align:center; padding:5px 0;  color:#FFF;}
.MainFoot .Details p i { color:#b3b3b3; font-style:normal;}
.MainFoot .Details p a { color:#FFF; text-decoration:none;}
.MainFoot .Details p a:hover { color:#FFF; text-decoration:underline;}

@media (max-width:979px) {
    .detail,
    .main03 .detail,
    .main04 .detail,
    .main06 .detail,
    .main10 .detail,
    .main11 .detail,
    .MainFoot .Details {width: 95%;}
    .langs-list {top: -44px;}
    .main01 h1 {font-size: 27px;line-height: 36px;}
    .main01 h3 {font-size: 25px;line-height: 34px;}
    .main01 h3+p {margin: 0;}
    .btn-container li {margin-bottom: 20px;}
    .video-container .the-video iframe {width: 600px;height: 335px;}
    .feature-list li h3 {font-size: 21px;line-height: 29px;}
    .feature-list li,.feature-list li:nth-child(2) {width: 100%;display: block;margin: 0 0 40px;}
    .main03 h2 {font-size: 25px;line-height: 34px;}
    .main03 h2+p {margin: 10px 0 40px;}
    .import-list-content {width: 100%;overflow-x: auto;}
    .import-arrow-left, .import-arrow-right {display: none;}
    .import-list li {width: 90px;}
    .import-list li p {border: none;}
    .line-animation {width: 100%;}
    .main04 h2 {font-size: 25px;line-height: 34px;}
    .main04 h2+p {margin: 20px 0 50px;}
    .left-right-container .img-container {width: 100%;float: none;margin: 0 0 30px;}
    .left-right-container .info-list {width: 100%;float: none;}
    .info-list li {padding: 10px 20px 10px 40px;}
    .info-list li.on-active::before {display: none;}
    .info-list li h3 {font-size: 17px;line-height: 26px;}
    .main05 {background: #fcfcfc;}
    .left-section,.right-section {float: none;margin: 0 auto 40px;width: 90%;}
    .section-info-list {text-align: center;}
    .main06 h2 {font-size: 25px;line-height: 34px;}
    .main06 h2+p {margin: 20px 0 50px;}
    .feature-info-list li p {text-align: center;}
    .feature-info-list li,.feature-info-list li:nth-child(2) {width: 100%;margin: 0 0 40px;}
    .feature-info-list li div {box-shadow: 0 0 20px 0 rgba(168,182,183,0.1);}
    .main08 {background: #fbfbfb;}
    .main08 h2 {font-size: 25px;line-height: 34px;margin-bottom: 30px;}
    .info-same-style {width: 100%;display: block;text-align: left;}
    .left-info-same {margin-bottom: 30px;}
    .info-same-style .info-content {text-align: center;}
    .info-same-style .info-content:first-child {margin-bottom: 30px;}
    .type-list-container {display: none;}
    .intro-list li.on-click-status {box-shadow: none;background: none;border-radius: 0;}
    .intro-list li p {display: block;}
    .intro-list li.right-bottom-border-style,
    .intro-list li.bottom-border-style,
    .intro-list li.right-border-style {border: none;}
    .toggle-img-container {display: none;}
    .main10 h2 {font-size: 25px;line-height: 34px;}
    .main11 h3 {padding: 8px 40px 20px;font-size: 25px;line-height: 34px;}
    .review-content {width: 100%;}
    .left-about-content,.right-about-content {float: none;width: 100%;margin: 0;}
    .left-about-content {margin-bottom: 40px;}
    .right-about-content li {padding: 12px 10px;}
}
@media (max-width:767px) {
    .video-container .the-video iframe {width: 450px;height: 252px;}
    .review-list {margin: 20px 0 50px;}
    .review-list li {padding: 10px 0;}
}
@media (max-width: 479px) {
    .section-info-list li:nth-child(2n+1) {margin-right: 0;}
    .video-container .the-video iframe {width: 290px;height: 162px;}
}