@charset "utf-8";
html, div, body, p, form, img, dd, h1, h2, h3, h4, input { margin:0 auto; padding:0; font-style:normal; font-family:"Segoe UI", "Arial", "Helvetica", "Verdana", "sans-serif"; color:#444; line-height:160%; font-weight:normal; }
body { font-size:62.5%; overflow-x:hidden;}
body, input, textarea, select, button { text-rendering:optimizelegibility; }
p { line-height:20px; }
dl, dd, dt { margin:0; padding:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
li { margin:0; list-style:none; padding:0; }
img { border:none; }
a, a:link, a:visited { text-decoration:none; color:#222; }
a:hover, a:active { text-decoration:underline; color:#222; }
input { font-size:1.2em; float:left; }
table { border-collapse:collapse; }
dl, dt, dd { text-align:left; }
.clear { clear:both; }
.clearfix:after { clear:both; display:block; visibility:hidden; height:0; font-size:0; line-height:0; content:" "; }
.clearfix { zoom:1; }
.fl { float:left; }
.fr { float:right; }
.red { color:#F00; }
.mt20 { margin-top:20px; }
.mr0 { margin-right:0; }
.ml20 { margin-left:20px; }
.noMar { margin:0px !important; }
.container { max-width:1200px; overflow:hidden; }
.container h1{font-size: 40px;color: #000;}
.bottom_line{border-bottom: 5px solid #3891DC;}
/*new header index  和首页的下拉菜单相同 根据navigation.css 修改*/
#header { width:100%; height:72px; position:relative; }
#logo { width:20%; float:left; margin-top:20px; }
.menu{z-index:90;float:right;margin-top:25px;}
.menu ul{margin-right:20px;}
.menu li{float:left;text-align:center;font-size:16px;z-index:1;color:#222;font-family:Arial, Helvetica, sans-serif;height:50px;}
.menu li a{display:block;float:left;z-index:0;zoom:1;line-height:20px;height:26px;padding:3px 15px 0 10px;}
.menu li.store:hover, .menu li.sale:hover{background:none;}
.menu ul li ul.submenu{max-width:1200px;width:100%;left:50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);position:absolute;top:72px;z-index:100;font-size:15px;display:none;background:#fff;padding:1% 0 4% 0;margin-right:0;border-top:#d1d1d1 3px solid;border-bottom:#d1d1d1 1px solid;}
.menu ul li:hover ul.submenu{display:block;}
.menu ul li ul.submenu:before{width: 200%;height: 100%;background: #fff;content: "";position: fixed;top: -3px;left: -35%;z-index: -1;border-top: #d1d1d1 3px solid;}
.menu ul li ul.submenu li{text-align:left;width:50%;height:35px;font:normal 12px/40px arial, sans-serif !important;color: #999;margin:0;}
.menu ul li ul.submenu li span{color:#f44647;font-size:24px;line-height:30px;padding-left:30px;}
.menu ul li ul.submenu li.mac{padding-left:0;}
.menu ul li ul.submenu li a.first{border-top:1px #f44647 solid;}
.menu ul li ul.submenu li a.more{color:#f44647;font-size:14px;text-decoration:underline;}
.menu ul li ul.submenu li img{vertical-align:top;max-width:28px;}
.menu ul li ul.submenu li a{line-height:35px;font-size:15px;color:#666;display:inline-block;width:50%;padding:0;white-space: nowrap;}
.menu ul li:hover ul.submenu{display:block;}
.menu ul li ul.submenu li.version span{background:url(/style/index/version.png) no-repeat 0 0;}
.menu ul li ul.submenu li.version.mac span{background-position:0 -59px;}
.menu ul li ul.submenu li.version span.resouce{background:url(/style/index/version-resource.png) no-repeat 0 0;}
.menu ul li ul.submenu li.version.mac span.resouce{background-position:0 -59px;}
.menu ul li ul.submenu li.category a{width:20%;}
#lookfor { float:right; margin-top:3px; }
.toggle-nav { display:none; }
#search-box { float:right; margin-top:0; }
#search { margin:0; }
#lookfor{float:right;margin-top:3px;}
.toggle-nav{display:none;}
.bot_title{color:#fff;font-size:24px;margin-bottom:20px;}
/*search*/
.slidingDiv{clear:both;z-index:10000;position:absolute;top:72px;background-color:#fff;width:100%;padding:20px 0;background:url(/style/images/search-box-shadow.png) repeat-x;height:45px;border-top:1px solid #ccc;}
.show_hide{background:#fff url(/style/images/search-logo.jpg) no-repeat 0 center;height:18px;float:left;width:17px;cursor:pointer;}
#search{max-width:1000px;width:95%;margin:0 auto;overflow:hidden;}
#search-container{width:100%;}
#search-container input#q{width:80%;height:40px;border:1px solid #d3d8dc;border-radius:5px 0 0 5px;font-size:18px;padding-left:5px;color:#CCC;}
#search-container input#q, #search-container input#search_btn{float:left;}
#search-container input#search_btn{width:60px;height:42px;border-radius:0 5px 5px 0;cursor:pointer;border:1px solid #222;border-left:none;background-color:#222;color:#fff;}
#search-container input#search_btn:hover{background-color:#222;color:#fff;}
.topic_wrap h1{background-color:#504e4f;font-size:24px;color:#fff;height:50px;border-radius:5px;line-height:50px;padding-left:19px;max-width:1000px;width:100%;}
#search_result{height:1250px;}
#exclusive_discount{line-height:14px;margin-top:10px;color:#7c7c7c;}
#q { height:27px; width:258px; float:left; border:none; padding:0 10px; line-height:27px; background:none; font-size:1.8em; color:#ccc; }
.btn_search { background:url(/style/images/search-btn.jpg) no-repeat; border:none; cursor:pointer; height:27px; width:27px; float:left; margin-left:0; overflow:hidden; line-height:200px; font-size:0; }
#here { max-width:1000px; margin:15px auto 25px; color:#666; font-size:1.2em; width:97%; }
#here a:link, #here a:visited { color:#666; }

/*resource*/
ul.intro{display:none;overflow:visible;position:absolute;top:72px;font-size:14px;background:#fff;padding-top:1%;z-index:10000;border-top:#d1d1d1 3px solid;padding-bottom:10px;}
ul.intro li a{display:block;width:110px;color:#666;font-size:16px;}
ul.intro li{float:left;height:35px;}
.menu li#resorce:hover ul.intro{display:block;}

/*bottom link*/
.botlink{width:100%;background-color:#333333;padding:25px 0;}
.botlink .container{padding:30px 10px 40px;overflow:hidden;max-width:1200px;}
.botlink .botlink-box >a:nth-of-type(1){display:block;width: 144px;margin-bottom: 20px;}
.botlink .botlink-box >a:nth-of-type(2){margin-bottom: 14px;box-sizing: border-box;width: 160px;height: 36px;border: 1px solid #2ab0f5;border-radius: 3px;font-size: 14px;line-height: 36px;text-align: center;padding-left: 20px;color: #2ab0f5;background: url(/style/index/download.png) 4px 2px no-repeat;}
.botlink .botlink-box >a:nth-of-type(3){box-sizing: border-box;width: 160px;height: 36px;border: 1px solid #2ab0f5;border-radius: 3px;font-size: 14px;line-height: 36px;text-align: center;padding-left: 20px;color: #2ab0f5;background: url(/style/index/buy.png) 4px 2px no-repeat;}
.botlink-box{width:20%;float:left;margin-right:3%;_margin-right:3%;}
.botlink-box img{margin-top:20px;}
.botlink-company{width:25%;float:left;border-left:#464646 1px solid;padding-left:20px;height:149px;}
.botlink-support{width:17%;border-left:#464646 1px solid;padding-left:20px;}
.botlink-social{width:20%;border-left:#464646 1px solid;padding-left:20px;height:149px;}
.botlink h3{font-size:1.8em;margin:20px auto;color:#fff;}
.botlink h3.cooper{margin-top:20px;}
.botlink p{font-size:1.2em;}
.botlink a:link, .botlink a:visited, .botlink p{color:#fff;}
.botlink ul li{line-height:16px;margin:11px 0;font-size:14px;}
.botlink-sns{width:100%;margin-top:20px;}
.botlink-sns a{margin-right:5px;width:40px;height:40px;display:inline-block;}
.botlink-sns a img{max-width:48px;}
.botlink-sns a.facebook{background:url(/style/images/share-sns.png) no-repeat 0 0;}
.botlink-sns a.twitter{background:url(/style/images/share-sns.png) no-repeat -57px 0px;}
.botlink-sns a.youtube{background:url(/style/images/share-sns.png) no-repeat -111px 0px;}
.botlink-sns a.google{background:url(/style/images/share-sns.png) no-repeat -162px 0px;}
#footer{clear:both;background:#292929;width:100%;}
#footer p{color:#fff;text-align:center;margin:15px auto 10px;}
#footer p a{text-align:center;color:#fff;font-size:14px;}
#footer span.copyright{margin:0 auto 25px;color:#7c7c7c;}
span.copyright{text-align:center;font-size:14px;padding-left:10px;}
p.copyright{display:none;}
p.copyright{color:#7c7c7c;text-align:center;font-size:14px;padding-left:10px;}
#footer p.copyright{color:#7c7c7c;}
a#subscribe{max-width: 264px;height: 38px;display: block;color: #fff;font-size: 14px;padding-left: 25px;line-height: 38px;border: 1px solid #7c7c7c;border-radius: 30px;box-sizing: border-box;box-sizing: border-box;position: relative;}
a#subscribe:hover{border-color: #b6b6b6;text-decoration: none;}
a#subscribe::after{clear: both;content: "";width: 9px;height: 17px;background: url(/images/triangle.png);position: absolute;top: 10px;right: 20px;}

/* header */
.flex-box{display: flex;display:-webkit-box;display:-webkit-flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;-webkit-flex-direction: row;-webkit-justify-content: space-around;-webkit-flex-wrap: wrap;}
#header{width:100%;height:72px;position:relative;clear:both}
#header .container{overflow:visible}
#logo{width:20%;float:left;margin-top:22px}
.header>div *{margin: 0;padding: 0;font-family: Segoe UI,Arial,Segoe,Tahoma,sans-serif;}
.header>div{align-items: center;overflow: visible;justify-content: space-between;}
.header li{display: inline-block;}
.header div>div>ul:nth-child(1){margin-top: 18px;margin-bottom: 15px;}
.header div>div>ul:nth-child(1) li{margin-right: 40px;line-height: 28px;}
.header div>div>ul:nth-child(1) li:nth-child(1) i{width: 18px;height: 18px;background: url(/style/images/store.png);display: inline-block;margin-right: 10px;vertical-align: -4px;}
.header div>div>ul:nth-child(1) li:last-child{margin: 0px;vertical-align: -7px;}
.header div>div>ul:nth-child(1) li a{font-size: 16px;color: #222;}
.header #searchcontainer{overflow: visible;position: relative;vertical-align: -4px;}
.header #search-container input#q{width: 0px;height: 26px;outline: none;font-size: 18px;border-radius: 60px;padding-left: 0px;border: 1px solid transparent;-webkit-transition:width .2s linear;transition:width .2s linear;margin-right: -10px;color: #333;}
.header #search-container input#q.active{padding-left: 15px;width: 222px;border: 1px solid #d3d8dc;}
.header #search-container input#search_btn{margin-top: 5px;background: url(/style/images/search-new.png) no-repeat;width: 20px;height:20px;border: none;outline: none;margin-left: -20px;-webkit-transition: all .2s linear;transition: all .2s linear;cursor: pointer;}
.header div ul{text-align: right;}
.header div ul:nth-child(2){margin-bottom: 22px;position: relative;}
.header div ul:nth-child(2) li{display: inline-block;font-size: 18px;color:#333;font-weight: 550;margin-right: 32px;}
.header div ul:nth-child(2) li>span>i{width: 12px;height: 6px;background: url(/style/index/arrow-down-up.png);display: inline-block;margin-left: 8px;vertical-align: 2px;}
.header div ul:nth-child(2) li:last-child{margin-right: 0px;}
.header div ul:nth-child(2) li::after{clear: both;content: "";width: 125%;height: 50px;background: transparent;position: absolute;top: 0px;right: 0px;display: none;z-index: 1;}
.header div ul:nth-child(2) li span{position: relative;z-index: 2;}
.header div ul:nth-child(2) li.active>span{color: #0067e7;text-decoration: none;cursor: pointer;}
.header div ul:nth-child(2) li.active div{display: block;}
.header div ul:nth-child(2) li.active:after{display: block;}
.header div ul:nth-child(2) li.active>span>i{background-position-y: -6px;}
.header div ul:nth-child(2).header_nav li:hover div{display: block;}
.header div ul:nth-child(2).header_nav li:hover>span{color: #0067e7;text-decoration: none;cursor: pointer;}
.header div ul:nth-child(2).header_nav li:hover:after{display: block;}
.header div ul:nth-child(2).header_nav li:hover>span>i{background-position-y: -6px;}
.header div ul:nth-child(2) li div{position: absolute;top: 41px;right: 0px;background: #fff;z-index: 10;padding: 51px 87px 40px;border-radius: 0 0 8px 8px;box-shadow: 0 10px 15px rgba(0,0,0,.1);width: 880px;box-sizing: border-box;display: none;}
.header div ul:nth-child(2) li div{overflow: hidden;}
.header div ul:nth-child(2) li div dl{width: 294px;text-align: left;display: block;float: left;}
.header div ul:nth-child(2) li div dl:nth-child(1){margin-right: 104px;}
.header div ul:nth-child(2) li div dl dt{font-size: 20px;color: #222;border-bottom: 1px solid #d1d1d1;width: 100%;padding-bottom: 13px;margin-top: 0px;font-weight: 550;}
.header div ul:nth-child(2) li div dl dd{display: block;line-height: 14px;margin-top: 22px;margin-right: 0px;}
.header div ul:nth-child(2) li div dl dd>img{vertical-align: -2px;margin-right: 8px;}
.header div ul:nth-child(2) li div dl dd a{font-size: 14px;color: #222;font-weight: normal;position: relative;position: relative;-webkit-transition: all .2s linear;transition: all .2s linear;overflow: hidden;}
.header div ul:nth-child(2) li div dl dd img{margin-left: 12px;}
.header div ul:nth-child(2) li div dl dd>img:nth-of-type(2){margin-left: 0px;}
.header div ul:nth-child(2) li div dl dt img{margin: 0px;margin-right: 8px;vertical-align: -5px;}
.header div ul:nth-child(2) li div dl dd a::after{width: 0px;clear: both;content: "";position: absolute;bottom: -1px;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);height: 1px;background: #2674e9;-webkit-transition: all .2s linear;transition: all .2s linear;max-width: 100%;}
.header div ul:nth-child(2) li div dl dd a:hover::after{width: 100%;}
.header div ul:nth-child(2) li div dl dd a:hover{color: #2674e9;text-decoration: none;}
.header div ul:nth-child(2) li:nth-last-child(2) div,.header div ul:nth-child(2) li:nth-last-child(1) div{width: 1200px;padding: 51px 55px 40px;}
.header div ul:nth-child(2) li:nth-last-child(2) div dl:nth-child(2),.header div ul:nth-child(2) li:nth-last-child(1) div dl:nth-child(2){margin-right:104px;}
.header .toggle{display: none;}
.header_bg{width: 100%;height: 100%;background: rgba(0, 0, 0, .6);position: fixed;top: 0px;left: 0px;z-index: 1;display: none;}

/*go top*/
.back-to { position: fixed; bottom: 10px; right: 10px; z-index: 999; width: 110px; overflow: hidden; zoom: 1; -ie6-position-fixed-delay: 200; }
.back-to .back-top { float: right; display: block; width: 50px; height: 50px; background: url(/images/system/gotop.png) no-repeat scroll 0 0 transparent; margin-left: 10px; outline: 0 none; text-indent: -9999em; }
.back-to { _position:absolute; _bottom:auto; _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop, 10)||0)-(parseInt(this.currentStyle.marginBottom, 10)||0)));
_margin-bottom:10px; _margin-right:5px; }
*html { background-image:url(about:blank); background-attachment:fixed; }
/*ad*/
.top-ad { position:relative; z-index: 4;}
.top-ad img { position:absolute; right:0px; top:0px; cursor:pointer; }
.ad { background: url(/images/system/mid-sale-top.png) no-repeat 50% 0; height:38px; display:block; }
@media screen and (max-width: 1420px){
.menu ul li ul.submenu li a{font-size:12px;}
.menu ul li ul.submenu li a.more{font-size:12px;}
}
@media screen and (max-width: 1180px){
.header div>div{display: flex;flex-direction: column;}
.header div>div>ul:nth-child(1){order: 2;margin: 0 !important;}
.header div>div>ul:nth-child(2){order: 1;}
.header div>div>ul:nth-child(1){display: block;}
.header div>div>ul:nth-child(1) li{display: none !important;}
.header div>div>ul:nth-child(1) li:last-child{display: block !important;}
.header .toggle{font-size: 30px;color: #222;display: block;width: 26px;height: 22px;background: url(/images/article/toggle-left.png);}
.header .toggle.active{background: url(/style/images/close.png) no-repeat 7px;}
.header{position: relative;height: 60px;align-items: center;background: #fff;z-index: 4;}
.header>div{height: 100%;padding-left: 10px;padding-right: 10px;box-sizing: border-box;}
.header div>div{position: absolute;left:0px;top: 60px;z-index: 2;width: 100%;background: #fff;display: none;}
.header div>div.active{display: flex;}
.header div>div ul>li{display: block !important;text-align: left;padding-top: 15px;padding-bottom: 15px;border-top: 1px solid #eee;margin: 0px !important;}
.header div ul:nth-child(2) li div dl dd{border: none;}
.header div>div ul>li span,.header div ul:nth-child(2) li div dl dd{padding-left:10px;padding-right:10px;box-sizing: border-box;}
.header div>div ul>li span{display: flex;justify-content: space-between;align-items: center;}
.header div ul:nth-child(2) li div dl dt{border: none;padding-bottom: 20px;padding-top: 25px;border-bottom: 1px solid #eee;}
.header div ul:nth-child(2) li div{position: static;box-shadow: 0 0 0;width: 100% !important;padding: 0px !important;margin: 0 !important;}
.header div ul:nth-child(2) li div dl{display: block;float: none;width: 100%;}
.header div ul:nth-child(2) li:hover:after{display: none !important;}
.header div ul:nth-child(2){margin-bottom: 0px;}
.header div ul:nth-child(2) div li:last-child{padding-bottom: 0px;}
.header div>div>ul:nth-child(1) li{width: 100%;padding-left:10px;padding-right: 10px;box-sizing: border-box;}
.header #search-container input#q{padding-left: 5px;width: 100%;border: 1px solid #d3d8dc;box-sizing: border-box;}
.header #searchcontainer{overflow: hidden;}
.header #search-container input#search_btn{margin-top: 4px;}
.header div ul:nth-child(2) li div dl dt{font-size: 16px;padding-left: 10px;}
.header div ul:nth-child(2) li div dl dd{padding-left: 44px;}
.header div ul:nth-child(2) li div dl dd:hover a{color: #2674e9;}
.header_bg{z-index: 3;}
}
 @media screen and (max-width: 956px) {
.toggle-nav {
display:inline-block;
}
.toggle-nav {
padding:28px;
float:right;
display:inline-block;
color:#222;
font-size:30px;
border-radius:5px;
}
a.toggle-nav {
color:#222;
}
.toggle-nav:hover, .toggle-nav .active {
text-decoration:none;
}
.menu {
position:relative;
display:inline-block;
float:right;
margin-top:0;
}
.menu ul.active {
display:none;
}
.menu ul {
position:absolute;
top:100%;
right:0;
padding:10px;
box-shadow:0px 1px 1px rgba(0, 0, 0, 0.15);
background:#222;
border:1px solid #222;
opacity:0.8;
}
.menu li {
margin:0;
float:none;
display:block;
}
.menu li a {
padding:15px 15px 0;
color:#fff;
}
#header .menu {
z-index:1000px;
}
#header .menu li p, #header .menu li a {
margin-top:0;
}
#header .menu li:hover, #header .menu li a:hover, #header .menu li:hover a {
color:#fff;
}
#header .menu li:hover .submenu {
display:none;
}
#header .container { overflow:visible; }
#lookfor{float:left;margin-right:10px;margin-top:30px;}
#search-container input#q{width:60%;}
.ad {
background-position:64% 0;
}

}

 @media (max-width: 988px) {
.ad {
background-position:64% 0;
}
}
 @media (max-width: 860px) {
.ad {
background-position:60% 0;
}
}
@media screen and (max-width: 798px) {
.botlink-box, .botlink-company, .botlink-support, .botlink-social {
width:100%;
}
.copyright, #footer p a {
font-size:10px;
}
.ad {
background:url(/images/system/mid-sale-top-pad.png) no-repeat 50% 0;
height:35px;
display:block;
}
}
@media (max-width: 635px) {
.ad {
background-position:80% 0;
background-size:100%;
}
}
@media screen and (max-width: 480px) {
.botlink-box, .botlink-company, .botlink-support, .botlink-social {
width:100%;
}
.copyright, #footer p a {
font-size:10px;
}
.ad {
background:url(/images/system/mid-sale-top-phone.png) no-repeat 50% 0;
height:24px;
display:block;
}
}
