/* CSS Document */
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,th,p,a,li,td,b,div,span{font:400 12px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Arial";color:#333;}
html{font:400 100% "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Arial"; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: none; line-height:1.2; color:#333;}
html{overflow-x:hidden;}
img{max-width:100%}


.dsl{display:inline-block;}
.lh1{line-height:1.4;}
.ft26{font-size:26px;}
.mt15{margin-top:15px;}
.mt45{margin-top:43px;}
.mt150{margin-top:175px;}
.ft600{font-weight:600;}
.ftnone{font-weight:400;}
.opac{opacity:0.8;}
.wrap a:hover{text-decoration:none;}
/*.wrap a:link{color:#fff;}*/
.fclr333{ color:#333;}

/*btn*/
.stobtn{width:160px; height:40px; line-height:40px; font-size:16px; font-weight:bold; background-color:#f37b05; background:linear-gradient(left,#f37b05 0%,#fe9e14 100%); background:-webkit-linear-gradient(left,#f37b05 0%,#fe9e14 100%); background:-moz-linear-gradient(left,#f37b05 0%,#fe9e14 100%); position:relative; z-index:3; overflow:hidden;}
.stobtn:before,.stobancon a:before{content:""; display:inline-block; width:21px; height:21px; vertical-align:middle; margin:-4px 12px 0 0; background:url(../png/stobtn1.png) no-repeat;}
.stobtn:after{content:""; width:100%; height:100%; background:rgba(255,255,255,0.1); position:absolute; top:0; left:-100%; z-index:-1; transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; transform:rotate(60deg); -webkit-transform:rotate(60deg); -moz-transform:rotate(60deg);}
.stobtn:hover:after{width:400%;height:800%; transform:translateX(100%); -webkit-transform:translateX(100%); -moz-transform:translateX(100%); transform:rotate(60deg); -webkit-transform:rotate(60deg); -moz-transform:rotate(60deg);}
/*btn*/

.stoban{height:350px; background:#359cfd url(../jpg/stobanner.jpg) top center no-repeat; background-size:cover;}
.stobancon{width:600px; margin-left:-90px; background:#ffffff; position:relative; border-radius:10px; margin-top:60px; padding-bottom:10px;}
.stobancon img{position:absolute; z-index:10; left:-30px; top:-30px;}
.stobox{width:360px; margin-right:20px;}
.stobox h1{ line-height:1.2;}
.stoboxbor{padding:8px 10px; border-radius:5px; border:2px dashed #ffc6c2; margin-top:16px;}
.stoboxbor p{ line-height:1;}
.stobancon p b{color:#fe7436; opacity:1;}
.stobancon a{width:200px; height:50px; line-height:50px; font-size:18px; color:#fff; font-weight:bold; border-radius:5px; background-color:#ff4437; background:linear-gradient(left,#ff4437 0%,#fe7437 100%); background:-webkit-linear-gradient(left,#ff4437 0%,#fe7437 100%); background:-moz-linear-gradient(left,#ff4437 0%,#fe7437 100%); margin-top:13px;}
.stobancon a:hover{background:linear-gradient(left,#fe3527 0%,#fb6623 100%); background:-webkit-linear-gradient(left,#fe3527 0%,#fb6623 100%); background:-moz-linear-gradient(left,#fe3527 0%,#fb6623 100%);}
.stotime{width:230px; height:110px; top:0; right:-10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; background:url(../png/stotime.png) repeat;}
.stotime p{width:193px; margin:10px auto 0 auto; line-height:1.4;}
.stotime span{display:inline-block; width:35px; height:32px; margin-right:13px; color:#fa434c; font-size:24px; font-weight:bold; position:relative; background:url(../png/stotime_block.png) no-repeat;}
.stotime span:after{content:":";  font-size:18px; color:#fff; position:absolute; top:3px; right:-10px;}
.stotime .countdown_second:after,.stotime .countdown_second{margin-right:0; content:"";}
.stotime span:before{font-size:12px; position:absolute; top:35px; color:#fff; text-align:center;}
.countdown_day:before{content:"Jours"; left:4px;}
.countdown_hours:before{content:"Heures"; left:1px;}
.countdown_minute:before{content:"Minutes"; left:-5px;}
.countdown_second:before{content:"Secondes"; left:-4px;}
 
/*content*/
.stonav p{display:inline-block; width:190px; margin:0; line-height:1.3; font-size:16px; font-weight:bold; color:#6e6e6e; cursor:pointer; vertical-align:text-top;}
.stonav span{display:block; width:100%; height:55px; margin-bottom:10px;}
.stonav span:before{content:""; display:inline-block; width:100%; height:55px; vertical-align:middle;}
.stonav1:before{background:url(../png/stocon_head1.png) center -55px no-repeat;}
.stonav2:before{background:url(../png/stocon_head2.png) center -55px no-repeat;}
.stonav3:before{background:url(../png/stocon_head3.png) center -55px no-repeat;}
.stonav4:before{background:url(../png/stocon_head7.png) center -55px no-repeat;}
.stonav5:before{background:url(../png/stocon_head5.png) center -55px no-repeat;}
.stonav6:before{background:url(../png/stocon_head8.png) center -55px no-repeat;}
.navactive .stonav1:before{background-position:center 0;}
.navactive .stonav2:before{background-position:center 0;}
.navactive .stonav3:before{background-position:center 0;}
.navactive .stonav4:before{background-position:center 0;}
.navactive .stonav5:before{background-position:center 0;}
.navactive .stonav6:before{background-position:center 0;}
.stonav .navactive{color:#4e9bf1;}

/*product*/
.stoprod>div{display:none;}
.stoprod .boxshow{display:block;}
.stoal,.stopc{box-shadow:0 0 20px rgba(0,0,0,0.05); }
.stoal div{height:100%; float:left; padding:30px 0 40px; box-sizing: border-box;}
.stoal h3{margin-top:20px; font-size:26px; font-weight:bold;}
.stoprod span{display:inline-block; width:280px; margin-bottom:10px; line-height:1.6; font-size:14px; color:#666;}
.stoprod h5{color:#666;}
.stoprod del{color:#878787;}
.stoprod a,.stowhy a{color:#fff;}
.stoprod a:before,.stowhy a:before{margin:-4px 5px 0 0;}
.stoprod b{font-size:16px; font-weight:bold; color:#f37d06;}
.stoborder:after{content:""; display:inline-block; height:316px; border-right:1px solid #e5e5e5; position:absolute; top:40px; right:0;}
.stopc .stoborder:after{top:-15px;}
.stoal{height:400px;}
.stoals1{width:372px;}
.stoals2{width:304px;}
/*phoneclean*/
.stopc{padding:30px 0 50px 0;}
.stopc1{width:300px;}
.stopc2{width:380px;}
.stopc2 a{width:215px; height:54px; line-height:54px; font-size:18px;}
.statios{background-color:#ebf4fd;}
.statandr{background-color:#f4fdf1;}
.stprios{background-color:#f0fffe;}
.stprandr{background-color:#eff6ff;}

/*why*/
.stowhy{padding:60px 0 40px; background:url(../png/stowhy.png) bottom center no-repeat; background-size:cover;}
.stowhy h2{line-height:1.2;}
.stoprice p{display:block; width:193px; float:left; margin-top:70px;}
.stoall{width:224px; height:290px; margin-right:70px; border-radius:10px; background-color:#ecf5fd; overflow:hidden;}
.stoall p{margin-top:8px;}
.stoall del{font-size:16px; font-weight:400; color:#666;}
.stowhy del{font-weight:bold;}
.stoallother{padding:1px 0 20px 0; border-top:1px dashed #fff; background-color:#dfedf9;}

.stowhy_choose .clearight,.stonav .clearight{margin-right:0;}
.stowhy_choose li{width:210px; float:left; margin-right:46px; line-height:1.6; font-size:14px; color:#7f7f7f;}
.stowhy_choose b{display:block; margin:20px auto 10px auto; font-size:18px; font-weight:bold;}
.stobancon a:before,.stopc2 a:before{width:26px; height:24px; margin-right:10px; background:url(../png/stobtn.png) no-repeat;}

/*2018-12-4*/
.stoprice,.standp{width:580px; margin-left:20px;}
.standp p{width:288px; float:left; margin-top:70px;}
.stoprice .stoequal:after,.standp .stoequal:after{width:25px; height:19px; top:68px;}
.stoprice .stoequal:after{right:-30px; background:url(../png/stoequal.png) no-repeat;}
.standp .stoequal:after{right:-15px; background:url(../png/stoequal1.png) no-repeat;}
.stoprice span,.standp span{display:block; margin-top:10px; margin-left:20px; font-size:20px;}
.stoprice p:after,.standp p:after{content:""; display:inline-block; vertical-align:middle; position:absolute; top:55px; right:-20px;}
.stoadd:after{width:23px; height:23px; background:url(../png/stoadd.png) no-repeat;}
.stoadd1:after{background:url(../png/stoadd1.png) no-repeat;}
.stoanall{background-color:#f4fdf1;}
.stoanall .stoallother{background-color:#eaf6e6;}
.link a{ color: #08c; font-size: 16px;}

.plan_block { padding:100px 0 10px; }
.plan_block>a { display: inline-block; vertical-align: top; margin: 0 80px; font-size: 20px; color: #333; text-align: center;}
.plan_block>a img { margin-right: 10px;}
.plan_block>a:after { content: "\e902"; font-family: iconfont; margin-left: 10px; display: inline-block; transition: all .3s ease-in-out; vertical-align: middle;}
.plan_block>a:hover:after { transform: translateX(5px);}
.plan_block>a:hover { text-decoration: none; color: #2a98f1;}
.plan_block ul li{ width:300px; display:inline-block; float:none; vertical-align:text-top; margin:20px 10px;}
.plan_block ul li>img{ width:60px;}
.plan_block ul li h4{ font-size:20px; font-weight:bold; margin-top:5px;}
.plan_block ul li p{ font-size:14px; color:#000000; margin-top:10px; line-height:1.7;}
.plan_block ul li a{ font-size:14px; color:#4c7ffa; position:relative; margin-top:10px; display:block;}
.plan_block ul li a:after{content: "\e902"; font-family: iconfont; margin-left: 10px; display: inline-block; transition: all 0.3s ease-in-out; vertical-align: middle;}
.plan_block ul li a:hover:after{ transform: translateX(5px);}
.plan_block ul li a:hover{ text-decoration: none; color: #4c7ffa;}

.stocont{border-radius:50px 0px; padding-top:20px; margin-bottom:30px; text-align:center; background-color:#fafafa;}
.stocont>div{display:inline-block; vertical-align:middle;}
.aticont{background-color:#eef7ff;}
.atacont{background-color:#EBFBF7;}
.ptcont{background-color:#eef5ff;}
.procont{margin-top:-10px; margin-right:10px;}
.probox{display:inline-block;vertical-align:middle; position:relative;}
.probox:before{content:""; position:absolute; right:-1px; bottom:1px; width:122px; height:17px; background:url(../png/sto_boxshadow.png) center no-repeat; background-size:cover;}
.probox img{position:relative; z-index:1;}
.protext{display:inline-block; vertical-align:middle; text-align:left; margin-left:10px; width:250px;}
.protext h5,.buycont h5{font-size:20px; font-weight:bold; color:#333;}
.protext h5 sup{font-size:14px; font-weight:normal; line-height:1;}
.protext p{font-size:14px; color:#666; margin-top:15px;}
.buycont{background-color:#fff; width:260px; padding:24px 0; margin-right:10px; transition:.2s ease-in-out;}
.buycont:hover{box-shadow:0 5px 30px rgba(0,0,0,.15);}
.buycont p{font-size:14px; margin-top:6px;}
.buycont p del{font-size:16px; color:#888;}
.buycont p b{font-size:28px; color:#EB0021; font-weight:bold; margin-left:6px;}
.buycont p span{font-size:12px; color:#888; width:auto; margin-bottom:0;}
.buycont a{display:inline-block; margin-top:16px;}

.banner{height:350px;}
.ban{height:350px; width:100%; background-color:#eee; overflow:hidden; position:absolute; z-index:-1; opacity:0; transition:.6s ease-in-out;}
.banshow{z-index:1; opacity:1;}
.ban1{background:url(../jpg/bundle_banner1.jpg) #146dc2 center no-repeat; background-size:cover;}
.ban2{background:url(../jpg/bundle_banner3.jpg) #008E82 center no-repeat; background-size:cover;}
.ban3{background:url(../jpg/bundle_banner2.jpg) #1aa068 center no-repeat; background-size:cover;}
.bancon{width:94%; margin:45px auto; max-width:1200px; /*height:260px;*/ background: #FFFFFF; border-radius:50px 0px; position:relative; text-align:center; box-shadow:0px 4px 40px rgba(0, 0, 0, 0.25);}
.ban1 .bancon{border:2px solid #A4F4FF;}
.ban2 .bancon{border:2px solid #00FFE8;}
.ban3 .bancon{border:2px solid #A4FFB1;}
.ban3 .bancon:before{content:""; position:absolute; bottom:30px; right:-70px; width:68px; height:129px; background:url(../png/droidkit_robot.png) no-repeat; background-size:cover;}
.offtab{position:absolute; left:8px; top:-45px; width:87px; height:126px;}
.off80{background:url(../png/80off.png) bottom center no-repeat; background-size:cover;}
.off82{background:url(../png/82off.png) bottom center no-repeat; background-size:cover;}
.off81{background:url(../png/81off.png) bottom center no-repeat; background-size:cover;}
.off84{background:url(../png/84off.png) bottom center no-repeat; background-size:cover;}
.off87{background:url(../png/87off.png) bottom center no-repeat; background-size:cover;}
.off90{background:url(../png/90off.png) bottom center no-repeat; background-size:cover;}
.banimg{display:inline-block; vertical-align:middle; width:362px;}
.bantext{display:inline-block; vertical-align:middle; text-align:left; margin-left:40px;}
.ban2 .bantext{margin:5px 0 0 40px;}
.ban2 .bantext li{margin-top: 5px;}
.dk_banimg{width: 312px;margin-left: 45px;}
.au_banimg{width: 312px;margin-left: 45px;margin-top: 0px;}
.bantext h1{font-size:30px; font-weight:bold; color:#000;}
.yeartips{vertical-align:top;}
.bantext li{font-size:14px; margin-top:8px; color:#000; padding-left:14px; position:relative;}
.bantext li:before{content:""; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background-color:#000;}
.bantext li span{color:#EB0021; font-size:inherit;}
.ostab{margin-top:10px;}
.ostab b{font-size:16px; font-weight:bold; vertical-align:middle;}
.ostab_win,.moved .ostab_mac{color:#FD8A2A;}
.ostab_mac,.moved .ostab_win{color:#666;}
.ostab_win:before{content:"\eac2"; font-family:pricon; font-weight:normal; margin-right:5px; font-size:20px; vertical-align:sub;}
.ostab_mac:before{content:"\e915"; font-family:pricon; font-weight:normal; margin-right:5px; font-size:22px; vertical-align:sub;}
.ostab em{display:inline-block; vertical-align:middle; width:50px; height:22px; margin:auto 10px; background:#FDF3E5; border:1px solid #666; border-radius:20px; cursor:pointer; position:relative;}
.ostab em i{position:absolute; left:2px; top:3px; width:16px; height:16px; background:#FD8A2A; border-radius:50%; transition:.3s ease-in-out;}
.ostab.moved i{left:32px;}
.banpur{width:368px; height:260px; background:#EEF7FF; border-bottom-right-radius:50px; /*position:relative; z-index:1;*/}
.ban1 .banpur{background:url(../jpg/banner_price1.jpg) #EEF7FF no-repeat; background-size:cover;}
.ban2 .banpur{background:url(../jpg/banner_price3.jpg) #EEF7FF no-repeat; background-size:cover;}
.ban3 .banpur{background:url(../jpg/banner_price2.jpg) #EDFCEF no-repeat; background-size:cover;}
.price del{font-size:30px; font-weight:bold; color:#666; font-style:italic;}
.price b{font-size:60px; font-weight:bold; color:#EB0021; line-height:1; display:block;}
.banpur a{display:inline-block; color:#fff; width:290px; line-height:66px; height:66px; font-size:30px; margin-top:20px;}
.banpur a:before{width:30px; height:30px; background:url(../png/stobtn1%402x.png) no-repeat; background-size:cover;}
.macs{display:none;}
.bandot{bottom:10px; left:0; right:0; text-align:center; z-index:2;}
.bandot li{display:inline-block; vertical-align:middle; width:20px; height:5px; border-radius:4px; background-color:#fff; opacity:.3; margin:5px; cursor:pointer; transition:.3s ease-in-out;}
.bandot .active{opacity:.6; width:30px;}


@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min--moz-device-pixel-ratio:1.5), only screen and (-o-min-device-pixel-ratio:3/2), only screen and (min-device-pixel-ratio:1.5) {
	.stoban{background:#359cfd url(../jpg/stobanner%402x.jpg) top center no-repeat; background-size:cover;}
	.stotime{background:url(../png/stotime%402x.png) repeat; background-size:182px 106px;}
	.stotime span{background:url(../png/stotime_block%402x.png) no-repeat; background-size:35px 32px;}	
	.stonav span:before{background-size:55px 110px;}
	.stonav1:before{background:url(../png/stocon_head1%402x.png) center -55px no-repeat;}
	.stonav2:before{background:url(../png/stocon_head2%402x.png) center -55px no-repeat;}
	.stonav3:before{background:url(../png/stocon_head3%402x.png) center -55px no-repeat;}
	.stonav4:before{background:url(../png/stocon_head4%402x.png) center -55px no-repeat;}
	.stonav5:before{background:url(../png/stocon_head5%402x.png) center -55px no-repeat;}
	.stonav6:before{background:url(../png/stocon_head6%402x.png) center -55px no-repeat;}
	.stowhy{background:url(../jpg/stowhy%402x.jpg) bottom center no-repeat; background-size:cover;}
	.stoadd:after{background:url(../png/stoadd%402x.png) no-repeat; background-size:23px 23px;}
	.stoprice .stoequal:after{background:url(../png/stoequal%402x.png) no-repeat; background-size:25px 19px;}
	.stobtn:before{background:url(../png/stobtn1%402x.png) no-repeat; background-size:21px 21px;}
	.stobancon a:before,.stopc2 a:before{background:url(../png/stobtn%402x.png) no-repeat; background-size:26px 24px;}
	.stoadd1:after{background:url(../png/stoadd1%402x.png) no-repeat; background-size:23px 23px;}
	.standp .stoequal:after{background:url(../png/stoequal1%402x.png) no-repeat; background-size:25px 19px;}
}

@media screen and (max-width: 1200px){
	.banner{height:575px;}
	.ban{height:auto; padding:45px 0;}
	.bancon{margin:auto;}
	.banpur{width:100%; float:none; height:auto; padding:1px 0 20px; margin-top:20px;}
	.price{margin-top:20px;}
	.ban1 .banpur{background:#EEF7FF no-repeat;}
	.ban3 .banpur{background:#EDFCEF no-repeat;}
}
@media screen and (max-width: 980px){	
	 /*nav style**/
	 .pw980{width:100%;}
	 
	 .stoban{height:auto; padding-bottom:40px;}
	 .stobancon{ margin:40px auto;}
	 .stotime{display:none;}
	 .stowhy h2{font-size:36px;}
	.stocon{width:98%; margin:0 auto;}
	.stoal{height:auto;}
	.stonav p{margin-bottom:30px; margin-right:20px;} 
	.stoal div,.stopc div,.stoall{float:none; margin:20px auto 30px auto;}
	.stoal,.stopc{box-shadow:none;}
	.stoals2,.stopc div{box-shadow:0 0 20px rgba(0,0,0,0.05);}	
	.stopc div{padding:30px 0;}
	.stoborder:after{display:none;}
	.stowhy_choose li,.stowhy_choose .clearight{display:inline-block; margin:20px; float:none;}
	.stowhy>div{margin-top:0;}
	
	.stocont{padding-bottom:20px;}
	.stocont .procont{display:block; margin-bottom:15px;}
	.buycont{margin:5px}
	.banimg{width:auto;}
	.banimg img{height:140px; width:auto;}
	.bantext{margin-left:10px;}
}
@media screen and (max-width: 768px){
	 .mt150{margin-top:50px;}
	 .stowhy h2{font-size:32px;}
	 .stonav p{margin-right:10px;}
	 .stoprice,.standp{width:94%; margin:20px auto;}
	 .stoprice p,.standp p{float:none; margin:20px auto 60px auto;}
	 .stoprice p:after,.stoprice .stoequal:after{right:70px; top:190px;}
	 .stowhy .clearight{margin-right:50px;}
	 .standp p:after,.standp .stoequal:after{right:120px; top:190px;}
	 .plan_block ul li{ width:90%; margin:20px auto; text-align:center;}
}
@media screen and (max-width: 750px){
	.banner{height:auto;}
	.ban{position:static; display:none;}
	.banshow{display:block;}
	.banimg{display:block;}
}
@media screen and (max-width: 600px){
	.stobancon{width:92%; margin:20px auto 0 auto;}
	.stobancon img{display:none;}
	.stobox{width:80%; float:none; margin:20px auto 0 auto; text-align:center;}
	.stoboxbor{width:92%; margin:10px auto 0 auto;}
	.stowhy_choose li,.stowhy_choose .clearight{width:80%; margin:0 auto 30px auto;}
	.protext{width:auto; display:block; text-align:center;}
	.protext p{margin:10px auto;}
	.banimg img{height:120px;}
	
	.bantext h1{font-size:24px;}
	.price del{font-size:18px;}
	.price b{font-size:30px; margin-top:5px;}
	.banpur a{width:200px; line-height:50px; height:50px; font-size:20px;}
	.banpur a:before{width:21px; height:21px;}
}
@media screen and (max-width: 375px){
	.stoboxbor{width:100%; padding:8px 0;}
	.stoal div{width:90%;}
}