@charset "utf-8";
/* home style */
body{ background:#f8f8f8 url(images/home_bg.gif) no-repeat center 0;}
@media (max-width: 767px) {
	body{ background-color:#18bef9; background-image:none;}
}

.top_banner{padding-top:120px;}
.top_banner .text{float:left;width:46%;color:#fff !important;}
.top_banner .text h1{ font-size:86px; font-weight:400; line-height:1em;color:#fff !important;}
.top_banner .text dl{margin-top:15px;}
.top_banner .text dt{ font-size:36px; font-weight:500; line-height:1.4em;}
.top_banner .text dd{ font-size:16px;margin-top:15px;}
.top_banner .text .btn{margin-top:30px;}
.top_banner .text .btn .drowbtn{ position:relative;cursor:pointer;}
.top_banner .text .btn .drowbtn .drowsys{ position:absolute;display:block;width:170px; background:#19a0f2;color:#fff;padding:15px;top:40px;left:50%; border-radius:0 0 10px 10px;margin-left:-100px; z-index:5;}
.top_banner .text .btn .drowbtn .drowsys li{ font-size:16px;line-height:34px !important;height:34px !important;}
.top_banner .text .btn .drowbtn .drowsys li a{color:#fff}
.top_banner .text .btn .drowbtn .drowsys li a:hover{text-decoration:underline;}
.top_banner .text .btn .btn_buy{margin-top:-5px;}
.top_banner .text .system{margin-top:20px;}
.top_banner .text .system a{color:#fff; opacity:0.5;}
.top_banner .text .system a.curr{ opacity:1;}
.top_banner .text .system img{margin-right:5px;}
.top_banner .pic{float:right;width:52%;}
@media (max-width: 979px) {
	.top_banner{padding-top:100px;}
	.top_banner .text h1{ font-size:50px;}
	.top_banner .text dt{ font-size:22px;}
	.top_banner .text .btn .btn_buy{margin-top:10px;}
	.top_banner .pic img{width:100%;}
}
@media (max-width: 767px) {
	.top_banner{padding-top:80px;}
	.top_banner .text{float:none;width:auto;margin-top:30px;}
	.top_banner .pic{float:none;width:auto;}
}

.pro_feamenu{margin-top:80px;}
.pro_feamenu .arrow_down{width:16px;height:30px; background:url(images/arrow_animotion.png) no-repeat;margin:0 auto;animation: play 0.5s steps(3) infinite;}
@keyframes play {
      0% { background-position:0 0; }
    100% { background-position:0 -60px; }
}
.pro_feamenu .iconbox{padding-top:80px;}
.pro_feamenu .iconbox .item{float:left;margin-left:20px; text-align:center;}
.pro_feamenu .iconbox .item:first-child{margin-left:0;}
.pro_feamenu .iconbox .item a{display:block;width:154px;height:134px;background:#fff; border-radius:200px; font-weight:500;color:#16aaff;padding-top:20px;}
.pro_feamenu .iconbox .item a:hover{ background:#16aaff;color:#fff; text-decoration:none;}
.pro_feamenu .iconbox .item a .i1,
.pro_feamenu .iconbox .item a .i2,
.pro_feamenu .iconbox .item a .i3,
.pro_feamenu .iconbox .item a .i4,
.pro_feamenu .iconbox .item a .i5,
.pro_feamenu .iconbox .item a .i6,
.pro_feamenu .iconbox .item a .i7,
.pro_feamenu .iconbox .item a .i8{display:block;background:url(images/home_icon.png) no-repeat center 0;width:70px;height:70px;margin:0 auto;}
.pro_feamenu .iconbox .item a .i2{ background-position:center -140px;}
.pro_feamenu .iconbox .item a .i3{ background-position:center -280px;}
.pro_feamenu .iconbox .item a .i4{ background-position:center -420px;}
.pro_feamenu .iconbox .item a .i5{ background-position:center -560px;}
.pro_feamenu .iconbox .item a .i6{ background-position:center -700px;}
.pro_feamenu .iconbox .item a .i7{ background-position:center -840px;}
.pro_feamenu .iconbox .item a .i8{ background-position:center -980px;}
.pro_feamenu .iconbox .item a:hover .i1{background-position:center -70px;}
.pro_feamenu .iconbox .item a:hover .i2{background-position:center -210px;}
.pro_feamenu .iconbox .item a:hover .i3{background-position:center -350px;}
.pro_feamenu .iconbox .item a:hover .i4{background-position:center -490px;}
.pro_feamenu .iconbox .item a:hover .i5{background-position:center -630px;}
.pro_feamenu .iconbox .item a:hover .i6{background-position:center -770px;}
.pro_feamenu .iconbox .item a:hover .i7{background-position:center -910px;}
.pro_feamenu .iconbox .item a:hover .i8{background-position:center -1050px;}
@media (max-width: 979px) {
	.pro_feamenu .iconbox .item{padding:5px 0;}
	.pro_feamenu .iconbox .item:first-child,.pro_feamenu .iconbox .item:nth-child(5n+1){margin-left:0;}
}
@media (max-width: 767px) {
	.pro_feamenu .iconbox .item:first-child,.pro_feamenu .iconbox .item:nth-child(5n+1){margin-left:15px;}
	.pro_feamenu .iconbox .item:first-child,.pro_feamenu .iconbox .item:nth-child(3n+1){margin-left:0;}
}
@media (max-width: 479px) {
	.pro_feamenu .iconbox .item:first-child,.pro_feamenu .iconbox .item:nth-child(3n+1){margin-left:15px;}
	.pro_feamenu .iconbox .item:first-child,.pro_feamenu .iconbox .item:nth-child(2n+1){margin-left:0;}
}

.title{ font-size:36px; font-weight:500; line-height:1.3em;}
@media (max-width: 979px) {
	.title{ font-size:28px;}
}
@media (max-width: 479px) {
	.title{ font-size:26px;}
}

.pro_feat1{margin-top:200px;}
.pro_feat1 .pic{float:left;width:50%;}
.pro_feat1 .text{float:right;width:46%;color:#fff;}
.pro_feat1 .text h2{color:#fff;}
.pro_feat1 .text dl{margin-top:30px; font-size:16px;}
.pro_feat1 .text dt{ font-size:18px;}
.pro_feat1 .text dd{ font-weight:300;margin-top:5px; line-height:1.6em;}
@media (max-width: 979px) {
	.pro_feat1{margin-top:150px;}
}
@media (max-width: 767px) {
	.pro_feat1 .pic{float:none;width:auto;}
	.pro_feat1 .text{float:none;width:auto;margin-top:30px;}
}

.pro_feat2{margin-top:200px;}
.pro_feat2 .pic{float:right;width:54%;}
.pro_feat2 .pic .pcbg{ position:relative; background:url(images/pc_bg1.png) no-repeat;width:784px;height:473px;}
.pro_feat2 .pic .pcbg .gifpic{ position:absolute;top:50px;left:112px;}
.pro_feat2 .pic ol{display:none;}
.pro_feat2 .other_how{float:left;width:40%;color:#fff;}
.pro_feat2 .other_how h2{color:#fff;}
.pro_feat2 .other_how dl{margin-top:10px; font-size:16px;}
.pro_feat2 .other_how dt{ font-size:18px;}
.pro_feat2 .other_how dd{ font-weight:300;margin-top:5px; line-height:1.6em;}
.pro_feat2 .other_how ul {overflow:hidden; padding:20px 0; list-style:none;margin-left:0;margin-top:20px;}
.pro_feat2 .other_how ul li {float:left; font-weight:600; text-indent:-9999px;margin-right:15px;}
.pro_feat2 .other_how ul li a {display:block; color:#fff; border-radius:100px; width:76px; height:76px; line-height:76px; text-align:center;}
.pro_feat2 .other_how ul li a:hover,.pro_feat2 .other_how ul li.curr a {text-decoration:none;border:2px solid #fff; border-radius:80px;}
.pro_feat2 .other_how ul li .i1,.pro_feat2 .other_how ul li .i2,.pro_feat2 .other_how ul li .i3{ background:url(images/home_icon2.png) no-repeat center 25px;}
.pro_feat2 .other_how ul li .i2{ background-position:center -110px;}
.pro_feat2 .other_how ul li .i3{ background-position:center -245px;}
@media (max-width: 979px) {
	.pro_feat2{margin-top:150px;}
	.pro_feat2 .pic .pcbg{ background-size:100%;width:100%;height:300px;}
	.pro_feat2 .pic .pcbg .gifpic{top:30px;left:63px;}
	.pro_feat2 .pic .pcbg .gifpic img{ max-width:280px;}
}
@media (max-width: 767px) {
	.pro_feat2 .pic{float:none;width:auto;}
	.pro_feat2 .pic .pcbg{ position:static; background:none;width:auto;}
	.pro_feat2 .pic .pcbg .gifpic{ position:static;}
	.pro_feat2 .pic .pcbg .gifpic img{ max-width:100%;}
	.pro_feat2 .other_how{float:none;width:auto;margin-top:30px;}
}
@media (max-width: 479px) {
	.pro_feat2 .pic .pcbg{height:198px;}
}

.pro_feat3{margin-top:200px;}
.pro_feat3 .item{float:left;width:28%;margin-left:2%; background:#fff;padding:2%; text-align:center; min-height:300px; box-shadow:0 0 6px #f6f6f6;-webkit-transition: all .2s ease-in-out;margin-top:20px;font-size:16px;}
.pro_feat3 .item:first-child,
.pro_feat3 .item:nth-child(3n+1) {margin-left:0;clear:both;}
.pro_feat3 .item:hover{ background:#fafafa;}
.pro_feat3 .item h3{ font-size:18px; font-weight:500; line-height:1.4em;margin-top:15px;}
.pro_feat3 .item .btn{margin-top:100px;}
@media (max-width: 979px) {
	.pro_feat3{margin-top:150px;}
	.pro_feat3 .item h3{ font-size:16px;}
}
@media (max-width: 767px) {
	.pro_feat3 .item{float:none;width:auto;margin-left:0; min-height:auto;}
	.pro_feat3 .item .btn{margin-top:30px;}
}

.pro_feat4{margin-top:200px;}
.pro_feat4 .pic{float:right;width:60%;}
.pro_feat4 .pic .pcbg{ position:relative; background:url(images/pc_bg2.png) no-repeat;width:885px;height:530px;}
.pro_feat4 .pic .pcbg .gifpic{ position:absolute;top:55px;left:125px;}
.pro_feat4 .text{float:left;width:36%;}
.pro_feat4 .text dl{margin-top:40px;}
.pro_feat4 .text dt{ font-size:18px;}
.pro_feat4 .text .btn{margin-top:30px;}
@media (max-width: 979px) {
	.pro_feat4{margin-top:150px;}
	.pro_feat4 .pic .pcbg{background-size:100%;width:100%;height:300px;}
	.pro_feat4 .pic .pcbg .gifpic{top:35px;left:70px;}
	.pro_feat4 .pic .pcbg .gifpic img{max-width:310px;}
}
@media (max-width: 767px) {
	.pro_feat4 .pic{float:none;width:auto;}
	.pro_feat4 .pic .pcbg{position:static; background:none;width:auto;}
	.pro_feat4 .pic .pcbg .gifpic{position:static;}
	.pro_feat4 .pic .pcbg .gifpic img{max-width:100%;}
	.pro_feat4 .text{float:none;width:auto;margin-top:30px;color:#fff;}
	.pro_feat4 .text h2{color:#fff !important;}
	.pro_feat4 .text .btn a{display:inline-block; background:url(images/icon_arrow.png) no-repeat 90% 15px; color:#fff; border:solid 3px #fff; width:100px; height:30px; padding:5px 30px 5px 20px; border-radius:100px; text-align:left;font-size:14px; line-height:30px; font-weight:500;}
	.pro_feat4 .text .btn a:hover{background-position:90% -35px; background-color:#fff;color:#18abff; text-decoration:none;}
}
@media (max-width: 479px) {
	.pro_feat4 .pic .pcbg{height:197px;}
}

.pro_feat5{margin-top:200px;}
.pro_feat5 .pic{float:left;width:40%;}
.pro_feat5 .pic .phonebg{ position:relative; background:url(images/phone_bg.png) no-repeat;width:343px;height:637px;margin:0 auto;}
.pro_feat5 .pic .phonebg .gifpic{ position:absolute;top:95px;left:37px;}
.pro_feat5 .text{float:right;width:50%;margin-top:120px;}
.pro_feat5 .text .dd{ font-weight:300;margin-top:30px; line-height:1.6em; font-size:16px;}
.pro_feat5 .text .btn{margin-top:30px;}
@media (max-width: 979px) {
	.pro_feat5{margin-top:150px;}
	.pro_feat5 .pic .phonebg{background-size:100%;width:100%;height:550px;}
	.pro_feat5 .pic .phonebg .gifpic{top:80px;left:30px;}
	.pro_feat5 .pic .phonebg .gifpic img{ max-width:240px;}
}
@media (max-width: 767px) {
	.pro_feat5 .pic{float:none;width:auto;}
	.pro_feat5 .pic .phonebg{position:static; background:none;width:auto;height:415px; text-align:center;}
	.pro_feat5 .pic .phonebg .gifpic{position:static;}
	.pro_feat5 .pic .phonebg .gifpic img{ max-width:100%;}
	.pro_feat5 .text{float:none;width:auto;margin-top:30px;color:#fff;}
	.pro_feat5 .text h2{color:#fff !important;}
	.pro_feat5 .text .btn a{display:inline-block; background:url(images/icon_arrow.png) no-repeat 90% 15px; color:#fff; border:solid 3px #fff; width:100px; height:30px; padding:5px 30px 5px 20px; border-radius:100px; text-align:left;font-size:14px; line-height:30px; font-weight:500;}
	.pro_feat5 .text .btn a:hover{background-position:90% -35px; background-color:#fff;color:#18abff; text-decoration:none;}
}

.pro_feat6{margin-top:200px;}
.pro_feat6 .item{float:left;width:28%;margin-left:2%; background:#fff;padding:2%; text-align:center; min-height:300px; box-shadow:0 0 10px #f2f2f2;-webkit-transition: all .2s ease-in-out;margin-top:20px; font-size:16px;}
.pro_feat6 .item .dd{margin-top:30px;}
.pro_feat6 .item:first-child,
.pro_feat6 .item:nth-child(3n+1) {margin-left:0;clear:both;}
.pro_feat6 .item:hover{ background:#fafafa;}
.pro_feat6 .item h3{ font-size:18px; font-weight:500; line-height:1.4em;margin-top:15px;}
@media (max-width: 979px) {
	.pro_feat6{margin-top:150px;}
	.pro_feat6 .item h3{ font-size:16px;}
}
@media (max-width: 767px) {
	.pro_feat6 .item{float:none;width:auto;margin-left:0; min-height:auto;}
	.pro_feat6 .item h2{color:#fff !important;}
	.pro_feat6 .item .dd{color:#fff;}
}

.pro_feat7{border-top:1px solid #eee;margin-top:120px;padding:80px 0; background:#fff;}
.pro_feat7 .dd{ font-size:16px; line-height:1.6em;margin-top:30px;padding:0 15%;}
.pro_feat7 .iconbox{padding-top:60px;}
.pro_feat7 .iconbox .item{float:left;display:block;width:25%;margin-top:20px; text-align:center;}
.pro_feat7 .iconbox .item dt{ font-size:18px; font-weight:500;color:#333;margin-top:15px;}
@media (max-width: 979px) {
	.pro_feat7 .iconbox .item dt{ font-size:16px;}
}

.conment_box{ background:#f8f8f8 url(images/comment_bg.jpg) no-repeat center 20px;padding:80px 0;}
.conment_box .box{margin-top:60px;}
.conment_box .box .item{float:left;width:14.8%;border:1px solid #e5e5e5;padding:40px 2% 20px 2%; text-align:center;margin-top:40px;}
.conment_box .box .item .dd{font-style:italic; min-height:250px;}
.conment_box .box .big{ border:none; background:#fff;width:20%;margin-top:0;border-top:4px solid #16aaff;padding:40px 2% 20px 2%; box-shadow:0 0 10px #e1e1e1;}
.conment_box .box .big .dd{font-style:italic; min-height:270px; font-size:16px;color:#333;margin-top:30px;}
.conment_box .box .big .name{border-top:1px solid #e5e5e5;padding-top:15px;}
.conment_box .btn{ text-align:center;margin-top:20px;}
.conment_box .info{border-top:1px solid #e4e4e4;margin-top:60px;padding:40px 10% 0 10%;}
.conment_box .info .item{border-right:1px solid #e4e4e4;float:left;width:39%;padding:0 5%;}
.conment_box .info .item dt{ font-size:18px;color:#333; font-weight:500;padding-bottom:15px;}
.conment_box .info .item dd{ font-weight:300;}
.conment_box .info .item dd strong{color:#333; font-weight:500;}
@media (max-width: 979px) {
	.conment_box .box .item{width:14.7%;}
	.conment_box .info{padding:40px 5% 0 5%;}
	.conment_box .box .big{width:20%;}
}
@media (max-width: 767px) {
	.conment_box .box .item{float:none;width:auto;margin-top:20px;}
	.conment_box .box .big{width:auto;margin-top:20px;}
	.conment_box .box .item .dd{font-style:italic; min-height:auto;padding-bottom:20px;}
	.conment_box .info{padding:20px 0 0 0;}
	.conment_box .info .item{border-right:none;float:none;width:auto;margin-top:20px;}
}

.bottom_pro{ background:#fff url(images/pro_bg.jpg) no-repeat center 0;padding:60px 0;}
.bottom_pro .name{ font-size:24px;color:#333; font-weight:500; text-align:center;}
.bottom_pro .btn{margin-top:40px; text-align:center;}
.bottom_pro .btn .drowbtn2{ position:relative;cursor:pointer;}
.bottom_pro .btn .drowbtn2 .drowsys2{ position:absolute;display:block;width:120px; background:#16aaff;color:#fff;padding:15px;top:40px;left:50%; border-radius:0 0 10px 10px;margin-left:-75px;}
.bottom_pro .btn .drowbtn2 .drowsys2 li{ font-size:14px;}
.bottom_pro .btn .drowbtn2 .drowsys2 li a{color:#fff; font-weight:300;}
.bottom_pro .btn .drowbtn2 .drowsys2 li a:hover{ text-decoration:underline;}
@media (max-width: 479px) {
	.bottom_pro .btn a{margin-top:10px;margin-right:10px;}
}