.bg-gray{
  background-color: #f5f5f5;
}
.max-full{
  max-width: 100%;
}
.text-btn{
  color: #0084e9;
}
.mt30{ margin-top:30px;}
.mt60{ margin-top:60px;}
.mb30{ margin-bottom:30px;}
.relative{ position: relative;}
.page-main{ border-top:1px solid #ccc; padding:30px 0;}
/* 顶部工具条 */
.topbar { height: 30px; line-height: 30px; background-color: #0084e9; color: #fff; font-size: 12px; position: fixed; top: 0; width: 100%; z-index: 200;}
.topbar a { color: #fff; }
.topbar a:hover { text-decoration: underline; }
.sign-top{ background-color: #339DED; float: left; width: 234px;}
.sign-top .item{ float:left; padding:0 .7em;}
.sign-top .account{ position:relative; z-index:9; padding:0 1em;}
.sign-top .account .un{ display:block;}
.sign-top .account .un i{ float:right; font-size:14px; line-height:30px;-webkit-transition: all .3s .12s; transition: all .3s .12s;}
.sign-top .dropdown{ position:absolute; background-color:#fff; background-color:rgba(255,255,255,.95);left:0; width:100%; visibility: hidden; opacity: 0; -webkit-transform: scale(1, .7); transform: scale(1, .7); -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transition: all .3s .12s; transition: all .3s .12s;}
.sign-top .dropdown a{ display:block; height:30px; line-height:30px; color:#333; padding:0 1em;}
.sign-top .dropdown a:hover{ text-decoration:none; background-color:#f5f5f5;}
.sign-top .account:hover .un i{ -webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
.sign-top .account:hover .dropdown { visibility: visible; opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
.menu-top{ float: right;}
.menu-top .item { float: left; position: relative; z-index: 9;}
.menu-top .item > a{ padding: 0 1em; border-left:1px solid #80c2f4;}
.menu-top .item:first-child > a{ border-left: none;}
.menu-top .item .weixin { display: block; padding:0; text-align: center; width: 90px; border-left:none; color:#ffff00; line-height: 30px; background-color: #0063ae;}
.menu-top .item .weixin:hover{ text-decoration: none;}
.menu-top .item .weixin + .dropdown{ width:88px; height: 88px; background: #fff url(../images/weixin.png) no-repeat center center; border:1px solid #dedede;}
.menu-top .item .dropdown { position: absolute; left: 0; top: 30px; visibility: hidden; opacity: 0; -webkit-transform: scale(1, .7); transform: scale(1, .7); -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transition: all .3s .12s; transition: all .3s .12s; }
.menu-top .item .dropdown .dd { display: block; white-space: nowrap; background-color: #555; height: 30px; line-height: 30px; text-indent: 1em; }
.menu-top .item:hover .weixin{ background-color: #004274;}
.menu-top .item:hover .dropdown { visibility: visible; opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
/* 头部 */
.head-placeholder{ height: 102px;}
.header{ height: 72px; background-color: #fff; background-color: rgba(255,255,255,.8);position: fixed;top: 30px;width: 100%;z-index: 196;box-shadow: 0 1px 0 #ccc;}
.menu-main { position: relative; z-index: 8;}
.menu-main > li { float: left; margin-left: 25px;}
.menu-main > li:first-child{ margin-left: 0;}
.menu-main > li > a { display: block; height: 72px; line-height: 72px; font-size: 16px; position: relative;}
.menu-main > li > a:after{ content: ""; visibility:hidden; display: block; position: absolute; border-bottom: 6px solid #c3d0db; width:20px; border-left: 6px solid transparent; border-right: 6px solid transparent; left:50%; margin-left:-16px; bottom:0; -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transition: all .3s .12s; transition: all .3s .12s;}
.menu-main .dropdown { position: absolute; right: 0; top: 72px; width: 904px; padding: 15px; border: 1px solid #ccc; border-top: 4px solid #c3d0db; background-color: #fff; visibility: hidden; opacity: 0; -webkit-transform: scale(1, .7); transform: scale(1, .7); -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transition: -webkit-transform .2s ease-in .12s, opacity .2s ease-in .12s; transition: transform .2s ease-in .12s, opacity .2s ease-in .12s; }
.menu-main .dropdown:before { content: ""; display: block; position: absolute; left: 18.8%; top: 30px; bottom: 30px; border-left: 1px solid #ddd; }
.menu-main .dropdown .sub { width: 19.5%; float: left; padding: 15px; -moz-box-sizing: border-box; box-sizing: border-box; }
.menu-main .dropdown .sub a { display: block; height: 24px; line-height: 24px; }
.menu-main .dropdown .info { width: 46%; float: left; color: #999; padding: 15px; -moz-box-sizing: border-box; box-sizing: border-box; }
.menu-main .dropdown .info .title { font-size: 24px; }
.menu-main .dropdown .pic { width: 34.5%; float: left; padding: 15px; -moz-box-sizing: border-box; box-sizing: border-box; }
.menu-main .dropdown .pic img { max-width: 100%; }
.menu-main > li:hover > a { color: #0084e9; }
.menu-main > li:hover > a:after{ visibility: visible; -webkit-transform: scale(1, 1); transform: scale(1, 1);}
.menu-main > li:hover .dropdown { visibility: visible; opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
@media screen and (max-width:1199px){
    .menu-main .dropdown{ width: 948px;}
}
@media screen and (max-width:990px){
    .logo{ display: block; width: 69px; overflow: hidden;}
    .menu-main .dropdown{ width: 688px;}
}
@media screen and (max-width:767px) {
    .head-placeholder{
        display: none;
    }
}
/* 搜索弹出层 */
@-webkit-keyframes full-search-in {
  from { opacity: 0; -webkit-transform:scale(.7);}
  to { opacity: 1; -webkit-transform:scale(1);}
}
@keyframes full-search-in {
  from { opacity: 0; transform:scale(.7);}
  to { opacity: 1; transform:scale(1);}
}
.full-search-in{-webkit-animation: full-search-in 0.3s both; animation: full-search-in 0.3s both;}
.full-search-overlay{ position: fixed; z-index: 30; width: 100%; height: 100%; background: #fff; background: rgba(255,255,255,.95); left:0; top:0;}
.full-search-close{ position: absolute; line-height: 1; cursor: pointer; right: 60px; top: 60px; font-size: 36px; color: #666;}
.full-search-form{ position: absolute; left: 50%; top:20%;margin-left:-200px; width:400px; height: 260px;}
.full-search-form .fsf{ overflow:hidden; border-bottom: 1px solid #ccc;}
.full-search-form .fsf .it{ width: 80%; float: left; font-size: 16px; background: none; -moz-box-sizing:border-box; box-sizing:border-box; height: 40px; border:none; padding:9px 10px;}
.full-search-form .fsf .bn{ width: 20%; float: left; border:none; height: 40px; background: none; font-size: 24px; color:#acacac;}
.full-search-form .fsw{ margin-top: 20px;}
.full-search-form .fsw h5{ color:#999; margin-bottom: 0;}
.full-search-form .fsw a{ display: inline-block; padding: .4em 1em; margin-top: 1em; margin-right:1em; font-size: 16px; border: 1px solid #dedede; color:#0084e9; white-space: nowrap;}
@media screen and (max-width:767px){
  .full-search-form{ width: 90%; left:5%; margin-left:0;}
  .full-search-close{ right: 20px; top:20px;}
}
/* 底部 */
.footer{ background: #1a2128; text-align: center; color:#ccc; font-size: 12px; padding:20px 0;}
.footer a{ color:#ccc;}
.footer a:hover{ text-decoration: underline;}
.copyright{ margin-bottom: 10px;}
.footlink{ margin-bottom: 10px;}

/* 手机用 */
.mobile-logo{ text-align: center; display: none;}
.app-footer{ height: 40px; display: none; position: relative; z-index: 999; list-style: none; margin:0; padding:0; background: #fff; box-shadow: -2px 0 10px #666;}
.app-footer li{ width: 25%; float: left; height: inherit;}
.app-footer li a{ height: inherit; line-height: 40px; display: block; font-size: 28px; text-align: center; color:#999;}
.app-footer li a:active{ color:#0084e9;}

.app-header{ height: 40px; display: none; position: relative; z-index: 999; list-style: none; background: #fff; box-shadow: 2px 0 10px #666;}
.btn-return{ position: absolute; display: block; width:40px; height: 40px; text-align: center;}
.btn-return:before{ content:""; border-top:2px solid #0084e9; border-left:2px solid #0084e9; display: block; width: 12px; height: 12px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); margin-top:13px; margin-left:17px;}
.app-title{ margin:0 40px; text-align: center; line-height: 40px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

@media screen and (max-width: 767px){
  .mobile-logo{ display: block;}
  #app-main{ overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;}
  .app-header{ display: block;}
  .app-footer{ display: block;}
}

/* 旧样式 */
.responsive_Box{padding-top:47px;}

.about_Box{padding:0 0 0px 0;}
.sub_Nav{padding:8px;border-bottom:1px solid #dedede;position: fixed;width: 100%;background-color: #fff;z-index:5;}
.sub_Nav h2{font-size:21px;float:left;padding-top:5px;}
.sub_Nav .sub_Buy{float:right;padding:8px 0 0 10px;}
.sub_Nav .sub_Buy a{padding:6px 15px;background-color:#0084e9;color:#fff;border-radius:3px;}
.sub_Nav .sub_Buy a:hover{opacity:.8;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);}
.sub_Nav .sub_Link{float:right;}
.sub_Nav .sub_Link li{float:left;padding-right:30px;}
.sub_Nav .sub_Link li a{height:30px;line-height:30px;font-size:16px;}
.sub_Nav .sub_Link li.active a{color:#0084e9;}

.introBanner{text-align:center;padding-top:47px;background:#f2f2f2;}
.introBanner img{max-width:100%;}

.intro_Box{position:relative;width:100%;}
.intro_Box .fixed{position:fixed;}
.sideLeft{position:absolute;z-index:2;height:100%;width:190px;border-right:#e6e6e6 3px solid;}
.intro_Nav{position:absolute;top:127px;right:-13px;width:100%;}
.intro_Nav ul li{text-align:right;}
.intro_Nav ul li a{padding-right:40px;font-size:14px;line-height:36px;color:#999;}
.intro_Nav ul li.active{background:url(../images/circle_blue.png) no-repeat center right;}
.intro_Nav ul li.active a{font-size:18px;line-height:46px;color:#0084e9;}

.intro_Con{margin-left:235px;padding:50px 0 0 0;}
.intro_Con .info_Item{padding:50px 0;line-height:1.6;}
.intro_Con .info_Item p{padding:5px 0px 0 5px;font-size:14px;}
.intro_Con .info_Item img{max-width:100%;}
.intro_Con .info_Item .intro_InfoTitle{font-size:20px;padding-bottom:8px;border-bottom:1px solid #dedede;margin-bottom:30px;}
.intro_Con .info_Item .border{border:0;}
.intro_Con .info_Item .info_ItemBtn{text-align:center;margin-top:50px;}
.intro_Con .info_Item .info_ItemBtn a{background-color:#0084e9;padding:0px 40px;height:70px;line-height:70px;font-size:24px;color:#fff;display:inline-block;border-radius:5px;}
.intro_Con .info_Item .info_ItemBtn a:hover{opacity:.8;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);}
.intro_Con .info_Item .info_ItemBtn a i{margin-right:10px;background-color:#fff;color:#0084e9;width:30px;height:30px;line-height:30px;border-radius:50%;}

.intro_Con .info_Item h2{font-size:36px;text-align:center;margin-top:50px;color:#333;line-height:1.4;}
.intro_Con .info_Item h4{font-size:18px;text-align:center;margin-top:30px;color:#666;line-height:1.4;}
.intro_Con .info_Item .infoBox{font-size:14px;margin-top:30px;color:#999;text-align:center;line-height:2;}
.intro_Con .info_Item .infoBox p strong{}
.intro_Con .info_Item .imgBox{text-align:center;margin-top:50px;}

@media screen and (max-width: 767px){
  .sideLeft{ display: none; }
  .intro_Con{ margin-left: 0; }
}

/* about origin */
.intro_Con .origin h2{font-size:26px;}
/* about birth */
.intro_Con .birth .infoBox{text-align:left;}
/* about function */
.intro_Con .function .functionBox{margin-top:50px;text-align:center;}
.intro_Con .function .functionBox .feed_Item{background-color:#e7c888;}
.intro_Con .function .functionBox .feed_Item:hover{background-color:#dbad5d;}
.intro_Con .function .item{background-color:#f2f2f2;font-size:16px;margin:0 0px 15px 0;text-align:center;width:160px;height:160px;display:inline-block;}
.intro_Con .function .feed_Item a{color:#fff;display:block;line-height:160px;}
.intro_Con .function .item:hover{background-color:#e7c888;color:#fff;cursor:pointer;}
.intro_Con .function .item:hover a{color:#fff;}
.intro_Con .function .item i{font-size:36px;padding:50px 0 10px 0;display:block;}
/* about featuresBox */
.intro_Con .featuresBox{padding:0px 0 50px 0;border-bottom:1px solid #f2f2f2;}
.intro_Con .features .intro_InfoList{text-align:center;padding:40px 20px 0 20px;}
.intro_Con .features p.title{font-size:16px;padding:7px 0;}
.intro_Con .features p.info{color:#999;height:85px;overflow:hidden;text-align:left;}
/* about creative */
.intro_Con .creative .creativeBox{margin-top:50px;}
.intro_Con .creative .infoBox{text-align:left;}
.intro_Con .creative .infoBox p i{color:#0084e9;padding:0 5px;font-size:20px;}
.intro_Con .creative .infoBox .text_bg{background-color:#f2f2f2;padding:10px;margin-top:15px;}
.intro_Con .creative .item{padding:20px 15px;background-color:#f2f2f2;margin:0 2px 2px 0;font-size:18px;}
.intro_Con .creative .item span{display:block;font-size:12px;}
/* about crm */
.intro_Con .crm .crmBox{text-align:center;margin-top:30px;}
.intro_Con .crm .crmBox .item{height:70px;background-color:#f2f2f2;padding:30px 12px 0 12px;cursor:pointer;margin:0 2px 2px 0;font-size:14px;}
.intro_Con .crm .crmBox .item:hover{background-color:#e7c888;color:#fff;}
.intro_Con .crm .crmBox2{margin-top:50px;color:#666;}
.intro_Con .crm .crmBox2 .item{text-align:center;padding:10px 0;background-color:#fff; border:1px solid #f0f0f0;margin:2px 5px 0 0;position:relative;font-weight:bold;}
.intro_Con .crm .crmBox2 .item span{font-size:18px;width:32px;height:32px; line-height:32px; background-color:#0084e9;display:inline-block;color:#fff;border-radius:50%;margin-bottom:10px;font-weight:normal;}
.intro_Con .crm .crmBox2 .item p{color:#666;}
.intro_Con .crm .crmBox2 .item i{position:absolute;top:31px;right:-15px;font-size:24px;background-color:#fff;z-index:2;color:#dedede;width:30px;}
/* about security */

/* about price */
.intro_Con .price .titleBox{font-size:18px;padding:15px 0;text-align:center;color:#fff;}
.intro_Con .price .text_info{padding:20px;background-color:#f2f2f2;}
.intro_Con .price .text_info p{font-size:22px;}
.intro_Con .price .text_info p span{font-size:12px;padding-left:5px;}
.intro_Con .price .priceList{margin-top:40px;border-right:1px solid #fff;}
.intro_Con .price .item_1 .titleBox{background-color:#b7b940;}
.intro_Con .price .item_2 .titleBox{background-color:#47bf82;}
.intro_Con .price .item_3 .titleBox{background-color:#6e8bd6;}
.intro_Con .price .item_4 .titleBox{background-color:#e05d6d;}
/* about contrast */
.intro_Con .contrast table{border-collapse:collapse;margin-top:50px;}
.intro_Con .contrast table th{padding:10px 6px;color:#fff;border:1px solid #fff;font-size:16px;text-align:center;}
.intro_Con .contrast table td{padding:10px 6px;background-color:#f2f2f2;border:1px solid #fff;font-size:14px;text-align:center;}
.intro_Con .contrast .contrastCon_1 th{background-color:#0084e9;}
.intro_Con .contrast .contrastCon_1 .text_color{color:#0084e9;}
.intro_Con .contrast .contrastCon_2 th{background-color:#47bf82;}
.intro_Con .contrast .contrastCon_2 .text_color{color:#47bf82;}
.intro_Con .contrast .contrastCon_3 th{background-color:#b7b940;}
.intro_Con .contrast .contrastCon_3 .text_color{color:#b7b940;}
.intro_Con .contrast .contrastCon_4 th{background-color:#6e8bd6;}
.intro_Con .contrast .contrastCon_4 .text_color{color:#6e8bd6;}
/* about sales */
.intro_Con .sales .item{padding:10px 0;margin:20px 5px 0 0;position:relative;font-size:18px;}
.intro_Con .sales .item span{float:left;font-size:20px;width:40px;height40px;line-height:40px;background-color:#fff;display:inline-block;color:#0084e9;border-radius:50%;border:1px solid #0084e9;text-align:center;margin:-8px 15px 0 0;}
.intro_Con .sales .item i{position:absolute;top:15px;right:15px;font-size:24px;z-index:2;color:#0084e9;width:30px;}

/* about responsive */
.responsive_Item{text-align:center;padding:70px 0px 70px 0px;}
.responsive_Item .titleBox{font-size:50px;padding-bottom:10px;}
.responsive_Item .infoBox{line-height:1.8;font-size:16px;color:#999;}
.responsive_Item .imgBox{margin-top:50px;}
.responsive_Item .imgBox img{max-width:100%;}
.responsive_Item .detaBox{padding:20px 0;font-size:20px;background-color:#fff;margin-top:50px;position:relative;border-radius:5px;line-height:1.5;color:#0084e9;}
.responsive_Item .detaBox:before{content:" ";position:absolute;width:0;height:0;left:50%;bottom:-22px;display:block;border-top:22px solid #fff;border-left:22px solid transparent;border-right:22px solid transparent;}
.responsive_Box .two{background-color:#f2f2f2;}
.responsive_Box .two .detaCon{padding:60px 10px 20px 10px;}
.responsive_Box .two .detaCon i{font-size:36px;}
.responsive_Box .two .detaCon p{padding-top:15px;font-size:16px;}
.responsive_Box .three .detaBox{background-color:#f2f2f2;}
.responsive_Box .three .detaBox.detaBox:before{border-top:22px solid #f2f2f2;}
.responsive_Box .three .detaCon{text-align:left;padding:40px 40px 0 0;}
.responsive_Box .three .detaCon .detaConImg{width:80px;height:80px;line-height:94px;text-align:center;background-color:#fff;border:1px solid #f0f0f0;border-radius:50%;float:left;margin-right:20px;}
.responsive_Box .three .detaCon .detaConImg i{color:#0084e9;font-size:36px;}
.responsive_Box .three .detaCon dl dt{font-size:16px;color:#333;padding-bottom:8px;}
.responsive_Box .three .detaCon dl dd{font-size:14px;}
.responsive_Box .four{background-color:#f2f2f2;}
.responsive_Box .four .btnBox{margin-top:50px;}
.responsive_Box .four .btnBox a{padding:0px 30px 0px 30px;background:#0084e9;height:60px;line-height:60px;color:#fff;font-size:24px;display:inline-block;border-radius:8px;}
.responsive_Box .four .btnBox a:hover{opacity:.8;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);}
.responsive_Box .four .btnBox a i{width:40px;height:40px;line-height:40px;border-radius:50%;background-color:#fff;color:#0084e9;margin-right:10px;}