@charset "utf-8";
/* CSS Document */
img {max-width:100%;}

.banner{background:#0087cc url(images/common_bg.png) no-repeat 50% top;color: #FFF;text-align: center;min-height: 910px;min-height: calc(100vh - 70px); padding-top: 86px;padding-top: 9.1vh;background-size: 80vw 90vh; }
.banner .text_cont h1{font-size:48px; font-weight:normal;line-height: 1em;margin-bottom:10px;margin-bottom: 1vh;margin-top: 2.4vh;}
.banner .version_btn i{font-size: 24px;margin-right: 10px;vertical-align: middle;display: inline-block;}
.banner .version_btn a:first-child{margin-right: 20px;}
.banner ul {overflow:hidden; padding:30px 5%; font-size:18px;}
.banner ul li{ float:left; width:33.3%; padding:5px 0;}
.banner .play_btn {position:relative; z-index:1;}
.banner .play_btn img {position:relative; z-index:2;}
.banner .play_btn:after {display:block; content:''; position:absolute; z-index:3; top:50%; left:50%; margin:-30px 0 0 -30px; width:60px;height:60px;height:6.5vh;width:6.5vh;background: url(images/play-btn.png) no-repeat;background-size: cover;}
.banner .play_btn:hover{opacity:0.8;}
.banner .tip1{font-size: 36px;font-weight: 300;}
.banner .download_btns{margin: 45px 0;margin: 4.6vh 0;}
.banner .fun_pic{margin-top: 52px;margin-top: 5.5vh; padding:20px 0;}
.banner2 {background:#0087cc url(images/banner_bg.jpg) no-repeat 50% top;min-height:600px; background-size:auto 100%; text-align:left;}
.banner2 .info {float:left; width:60%;}
.banner2 .fun_pic {margin-left:65%;}
.banner2 .text_cont h1 {font-size:36px;}
.banner2 .tip1{font-size:32px;}
.banner2 ul {padding:20px 0;}
.banner2 ul li {float:none; width:auto;}
.banner2 .download_btns a {margin-left:0;}
@media(max-width: 767px){
	.banner .text_cont h1 {font-size:34px;}
	.banner .tip1 {font-size: 24px;}
	.banner ul {padding:20px 0;}
	.banner ul li {float:none; width:auto;}
	.banner2 .info {float:none; width:auto; padding:0 20px;}
	.banner2 .fun_pic {margin-left:0; text-align:center;}
}

.reviews{background: #f7f7f7;color: #4a4a4a;padding: 30px 0 35px;}
.reviews .topten{width: 585px;background: url(images/topten_reviews.jpg) no-repeat 0 0;padding-top: 50px;float: left;font-style: italic;}
.reviews .topten p{color: #666;}
.reviews .reviews_num{width: 350px;float: right;}
.reviews .reviews_num .star{margin-bottom: 25px;}
.reviews .reviews_num ul{float: right;}
.reviews .reviews_num ul li.fm{color: #fa745f;font-size: 18px;}
@media(max-width: 767px){
	.reviews {padding:30px 20px;}
	.reviews .topten{width: 100%;}
	.reviews .reviews_num{width: 100%;}
}

.page_main {padding:60px 0;}
.blue_bg {background:#0087cc url(images/common_bg4.jpg) no-repeat 100% 0;color: #FFF;background-size: contain;}
.gray_bg {background:#f2f2f2 url(images/common_bg3.png) no-repeat;}

.stepBox {padding:30px 0;}
.stepBox .item {position:relative; padding-bottom:20px;}
.stepBox .item:after {display:block; content:''; clear:both;}
.stepBox .num {float:left; width:40px; font-size:30px; line-height:1.1; color:#0087cc; text-align:center;}
.stepBox .num.dot { position:absolute; display:block; height:100%;}
.stepBox .num.dot i {display:block; position:absolute; top:0; left:50%; margin-left:-8px; width:16px; height:16px; overflow:hidden; background:#fff; border:solid 2px #ddd; border-radius:100px;}
.stepBox .num.dot:after {display:block; content:''; width:2px; height:calc(100% - 73px); margin:0 auto; background:#ddd;}
.stepBox .name,
.stepBox .txt {margin-left:60px;}
.stepBox .name {font-size:30px; color:#333f4b; min-height:60px; margin-top:0;margin-bottom:0;}
.stepBox .info {padding-bottom:0 !important;}
.stepBox .info .name {margin-left:0;}
.stepBox .txt {padding-bottom:30px;}
.stepBox .txt p strong {font-weight:normal; color:#0087cc;}
.stepBox .pic.fr {margin-left:55%; padding-bottom:60px;}
.stepBox .box.fl {float:left; width:50%;}
.stepBox .box.inline .dot:after {height:calc(100% - 140px);}
.stepBox .inline {background:#f4f4f4; clear:both; padding:20px 0; margin-left:60px; margin-bottom:30px;}
.stepBox .inline:after {display:block; content:''; clear:both;}
.stepBox .inline .txt {margin-left:0;}
.stepBox .inline .pic.fr {margin-left:51%;}
.stepBox .inline .box.fl {width:47.5%;}
.stepBox .inline .info {padding:0 0 0 20px;}
.stepBox .inline .pic {padding-bottom:0;}
.stepBox .btn_more {display:inline-block; margin-top:20px; padding-right:20px; margin-left:0; position:relative;}
.stepBox .btn_more:after {display:inline-block; font-family:'filmora'; content:'\e906'; vertical-align:middle; position:absolute; right:10px; top:2px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.stepBox .btn_more.curr:after {transform:rotate(180deg);}
@media(max-width: 767px){
	.stepBox .name {font-size:24px;}
	.stepBox .info {padding:0!important;}
	.stepBox .pic.fr {margin-left:60px;}
	.stepBox .box.fl {float:none; width:auto;}
	.stepBox .inline {padding:20px;}
	.stepBox .inline .pic.fr {margin-left:0;}
	.stepBox .inline .box.fl {float:none; width:auto;}
}

.pagebox1 {font-size:18px; line-height:1.6;}
.pagebox1 a {color:#0087cc; text-decoration:underline;}
.pagebox1 .text_center {text-align:center;}
.pagebox1 .column {font-size:36px; padding-bottom:30px;}
.pagebox1 .info {padding-bottom:30px;}
.pagebox1 .btnBox {padding-bottom:30px;}
.pagebox1 .btnBox a {text-decoration:none;}
@media(max-width: 767px){
	.pagebox1 .column {font-size:32px;}
	.pagebox1 .info {padding:0 20px 30px;}
}

.pagebox2 {font-size:18px; line-height:1.6;}
.pagebox2 .title {font-size:36px; padding-bottom:10px;}
.pagebox2 .pic {float:left; width:30%;}
.pagebox2 .info {margin-left:35%;}
.pagebox2 .info p {padding-bottom:20px;}
.pagebox2 .info dl {padding:10px 0 0 0; margin:0; overflow:hidden;}
.pagebox2 .info dl dt {float:left; width:48px;}
.pagebox2 .info dl dd {margin-left:55px; min-height:46px; display:table;}
.pagebox2 .info dl dd span {display:table-cell; vertical-align:middle;}
.pagebox2 .btnBox {padding:20px 0 0 0; overflow:hidden;}
.pagebox2 .btnBox .item {float:left; max-width:240px;}
.pagebox2 .btnBox a {margin:10px 0;}
.pagebox2 .btnBox a.more {display:inline-block; font-size:14px; color:#fff; margin:0;}
@media(max-width: 767px){
	.pagebox2 .title {font-size:32px;}
	.pagebox2 .pic {float:none; width:auto; padding:20px;}
	.pagebox2 .info {margin-left:0; padding:20px;}
}

.pagebox3 .column {font-size:36px; text-align:center; color:#333f4b; margin:0; padding:0 0 20px 0;}
.pagebox3 ul {padding:20px 0 0 0;}
.pagebox3 ul:after {display:block; content:''; clear:both;}
.pagebox3 ul li {float:left; width:47%; margin-left:6%; margin-bottom:20px; font-size:20px; box-shadow:0 3px 5px #ededed; box-shadow:0 3px 5px rgba(102,102,102.3);}
.pagebox3 ul li:first-child,
.pagebox3 ul li:nth-of-type(2n+1) {margin-left:0;}
.pagebox3 ul li a {display:block; padding:12px 15px; background:#fff;}
.pagebox3 ul li a:hover {background:#0087cc; color:#fff;}
@media(max-width: 767px){
	.pagebox3 .column {font-size:32px;}
	.pagebox3 ul li  {float:none; width:auto; margin-left:0;}
}