@charset "utf-8";
/* CSS Document */
a{ cursor:pointer;color:#979797;}
a:hover{text-decoration: none;color:#56aaff; font-family: "Microsoft YaHei" ! important; }
body{ font-family: "Microsoft YaHei" ! important;font-size: 12px; }
h1,h2,h3,h4,h5,h6{ font-family:"Microsoft YaHei" ! important; }
.container{padding-left:0px;padding-right:0px;width: 1130px;}
.btn-primary,.bnt{background-image:none;text-shadow: none;box-shadow: none;}
ol, ul {  list-style: none outside none;}
h3{ font-size: 24px; font-weight: normal;}
h3 .en{ font-family: arial;}
h4{ font-size: 16px; font-weight: normal;}


.btn-default ,.btn-primary{overflow: hidden;padding: 5px 20px;*padding: 5px 0px; font-size: 16px; border-radius: 0; font-family: "宋体";  }
.btn-default,.btn-default:hover,.btn-default:focus{ background:#f4f4f4;border:none; border-bottom: 2px solid #e4e5e7; color: #888888;}
.btn-primary,.btn-primary:hover,.btn-primary:focus{ background: #2ab7ea; color: #fff; border-color: #52adce}
.btn-default .icon,.btn-primary .icon{  margin: -5px 5px -5px -5px;}
.btn-default .icon-right,.btn-primary .icon-right{  margin: -5px -5px -5px 5px;}
.btn-org,.btn-org:hover,.btn-org:focus{ background: #fc6e48; color: #fff; text-shadow: none;}
.btn-large{ padding: 10px 40px; font-size: 20px !important;}
.btn .icon{ font-style: normal; font-size: 25px; }
.btn-wide{ padding-left: 60px; padding-right:60px;}
.btn-default-light{color:#2ab7ea;}








/*----------侧边start-----*/
.sidebar-fixed {position: fixed;right: 0px;top: 0px; width: 500px;}
.sidebar-fixed .sidebar-fixed-hidden{background:#000;width:430px;position: absolute;right: 0px;}
.sidebar-fixed .float-options{position: absolute;right: 433px;top:40px;}
.sidebar-fixed .float-options li{background:#000;padding:10px;margin-bottom:2px; border-radius:3px;width:46px; position:relative;}
.sidebar-fixed .float-options li a{display:block;background:url(../images/siderfix.png);width:26px;height:26px;}
.sidebar-fixed .float-options li a.qq{ background-position:0 0px;}
.sidebar-fixed .float-options li a.account{background-position:0 -48px;}
.sidebar-fixed .float-options li a.edit{background-position:0 -96px;}
.sidebar-fixed .float-options li a.scrollup{background-position:0 -132px;}
.sidebar-fixed .float-options li.regi{background-color:#36cc80;}
.sidebar-fixed .float-options li a.regitext{background-position:0 -168px;}
.sidebar-fixed-hidden input,.sidebar-fixed-hidden textarea{width:290px;margin-bottom:20px;}
.sidebar-fixed-hidden .code{}
.sidebar-fixed-hidden .code input,.sidebar-fixed-hidden .code .codeimg{float:left;}
.sidebar-fixed-hidden .codeimg{width:87px;height:30px;margin-left:10px;}
.sidebar-fixed-hidden .codeimg img{height:33px;width:87px;}
.sidebarcontain{padding-left:50px;}
.sidebar-fixed-hidden .btn2{width:128px;height:37px; background-position:0 -38px;}
.sidebar-fixed-hidden .sidebarcontain h3{font-family:"Microsoft YaHei" ! important; font-size:18px;color:#fff;padding:10px 0;}
.sidebar-fixed .float-options .click{background:#ff7c2d;width:186px;margin-right:-140px;}
.sidebar-fixed .float-options .sidertitle{font-family:"Microsoft YaHei" ! important; font-size:20px;color:#fff;width:100px;position: absolute;top:8px;left:70px;}
.sidebarcontain{margin-top:100px;height:1000px;}
.sidebarcontain .btn6{ background-position:0 -167px;top:20px;width:128px;height:45px; }
.sidebarcontain .btn7{ background-position:0 -122px;top:20px;width:286px;height:38px;margin:20px 0 10px 0; }

.qrCode{padding-top:60px;}
.qrCode img{width:130px;height:130px;}
.qrCode li{text-align:center;color:#FFF;float:left;margin-right:60px;margin-bottom:30px;}
.sidebar-fixed-hidden .bnt4{position:absolute;left:360px; background-position:0 -81px;top:20px;width:36px;height:36px; }
/*----------侧边end-----*/

/*----------footer start-----*/
.footer{background:#e4e4e4;text-align:center;color:#999;padding:20px 0;}
.footer .lable{margin:10px auto;}
.footer .lable a{color:#333;padding:0px 10px;font-size:14px;}
/*----------footer end-----*/




/*----------搜索栏工具start-----*/
.contain{width:1100px;margin:auto;}
.toolbar{background:#457fde;height:80px;min-width: 1100px;}
.toolbar .title {float: left;height: 30px; line-height: 30px;width: 500px;font-size:14px;color:#FFF;padding-top:25px; }
.toolbar .title a{color:#FFF;}
.input-search{margin-top:20px;float:right;width:340px; position:relative;z-index:1;}
.input-search .form-control{width:340px;padding-right:40px;*padding:0px;*padding-top:3px;*line-height:28px;*height:28px;height:34px;}
.icon-inputsearch{background: url(../images/iconabili.png) no-repeat scroll 0% 0% transparent;width: 22px; height: 24px;display:block; position:absolute;top:5px;right:10px;}
.abilty_container{background:#ebebea;padding-top:50px;min-width: 1100px;}
.api_container{background:#fff;padding-top:20px;min-width: 840px;}




/*----------面包屑start-----*/
.guide {margin-bottom:20px;}


/*----------头部start-----*/
.brand{width:296px;heihgt:43px;float:left;padding-top:16px;}

.headernav .navbar-new{/*width: 516px;*/float: left;/* margin:0px 0 0px 30px; */padding:0 0px;}
.headernav .navbar-new li a{font-size: 16px; padding:22px 15px;float:left;color:#333333;line-height:19px;}
.headernav .navbar-new .active  a,.headernav .navbar-new  a:hover,.headernav .navbar-new a:focus{ border-bottom:3px solid #4c94dc; text-decoration:none; color:#4c94dc}
.headernav .navbar-new li {float: left;}
.navbar-right{float:right;margin:0px;}
.navbar-right li {float: left;}
.navbar-right .dropdown-toggle {border: 1px solid #FFF; padding:9px 15px 23px 15px;margin-top:15px;display:block;*padding:7px 15px 22px 15px;}
.headernav {margin:auto auto;background:#FFF;height:66px;min-width: 1130px;}
.dropdownbox{z-index:993;}
.headernav ul{list-style:none;}
.headernav .btn-info2{ background-image:none;background-color: #56AAFF;color:#FFF;text-shadow: none;box-shadow: none;padding: 6px 18px;}
.navbar-right .open a.dropdown-toggle,.navbar-right .open a.dropdown-toggle:hover, .navbar-right .open  a.dropdown-toggle:focus { background: none repeat scroll 0% 0% #FFF; border: 1px solid #CCC;}
.dropdownA{width:242px;}	
.dropdownA li{float:left;border-right:1px solid #cccccc;border-bottom:1px solid #cccccc;text-align:center;width:120px;*z-index:1000;}
.navbar-right .dropdownA li a{padding:16px 0  5px 0px;margin-top:0px;}
.navbar-right .open  a.dropdown-toggle,.navbar-right .open  a.dropdown-toggle:hover, .navbar-right .open  a.dropdown-toggle:focus {background:#FFF;border: 1px solid rgba(0, 0, 0, 0.15)}
.dropdown-menu{padding:0px;}
.dropdownA{ border-radius:0px;margin-top:0px;left:-190px;}
.navbar-right .open a .fline, .navbar-right .open a:hover .fline, .navbar-right.open a:focus .fline {
    position: absolute;
    display: block;
    height: 3px;
    width: 51px;
    background: none repeat scroll 0% 0% #FFF;
    z-index: 1002;
    top: 63px;
    left: 1px;
	*top: 63px;
}

.navbar-right .dropdownA li a:hover,.navbar-right .dropdownA li a:focus {background: #f5f5f5; font-weight:500;color:#000;}
.navbar-right .dropdownA li h6{font-size:12px; font-weight:500;}
.headernav .userinfo .n_arrows {margin: 15px 0px 0px 5px;}
.userinfo .dropdown{margin:0 10px;}

.userinfo{float:right;}
.dropdown .dropdown-inner{
    margin-left: -1px;
   	top: 30px;
    left: 0px;
    width: 100%;
    background: none repeat scroll 0% 0% #FFF;
    border: 1px solid #DDD;
    margin-top: -1px;
}

.headernav .userinfo{float: right;text-align: right; padding: 0 20px; position: relative;margin-top:16px; }
.userinfo .dropdown-toggle{font-size:14px;line-height:20px;}
.headernav .userinfo .n_arrows{ margin:10px 0 0 5px;vertical-align: top;}
.headernav .usermasg span{display: inline-block; width: 95px;overflow: hidden; text-overflow: ellipsis;white-space: nowrap; word-break: normal;word-wrap: normal;}

.userinfo{z-index:999;}
.userinfo .dropdown{ display: inline-block; *zoom:1; *display: inline; position: relative; text-align: center; padding: 5px 0; border: 1px solid transparent; vertical-align:middle;box-sizing:content-box;}
.userinfo .dropdown .dropdown-inner{ margin-left: -1px; position: absolute; top: 30px; left: 0; display: none;background: #fff;border: 1px solid #ddd; margin-top: -1px;min-width:90px; border-radius:0px; box-shadow:none;}
.userinfo .dropdown:hover { border: 1px solid #ddd; border-top: 1px solid #21b7ed;}
.userinfo .dropdown:hover .dropdown-inner{ display: block; }
.userinfo .dropdown-menu {box-sizing:content-box;}
.userinfo .dropdown li{ text-align: center;}
.combo-list{ text-align: left; list-style: none; margin: 0; padding: 0; border-radius:0px;box-sizing:content-box;}
.combo-list li{ padding: 5px; border-bottom: 1px solid #ddd; margin: 0; box-sizing:content-box;}
.combo-list li:hover{ background:#ddd;}
.icon-personal,.icon-shopping,.icon-chain,.icon-chain-black,.icon-statistics,.icon-block,.icon-useradd,
.icon-download,.icon-enter,.icon-reg{ background:url(../images/icons-30x30.png) no-repeat ; width: 30px ; height: 30px ;display: inline-block;vertical-align: middle;}
.icon-shopping{ background-position: -30px 0;}
.badge-danger {  background: url(../images/round.png) no-repeat scroll 0% 0% transparent;}
.tipbox{ display: inline-block; position: relative;}
.tipbox:hover .tipbox-inner{ display: block;}
.tipbox .tipbox-inner{ display: none; position: absolute; z-index: 1; top: 32px;border-top: 2px solid #2ab7ea; width: 260px; right: 0; box-shadow: 0 0 3px #999; background: #fff;}
.tipbox .tipbox-arrow{ border-width: 7px; border-color: transparent transparent  #2ab7ea transparent; position: absolute; top: -15px; right: 10px;}
.tipbox .tipbox-container{}
.tipbox .tipbox-footer{ padding: 5px 10px; background: #f3f3f3; text-align: right;}
.tipbox-bottom .tipbox-inner{bottom: 35px; border-top: none;border-bottom: 2px solid #2ab7ea; }
.tipbox-bottom .tipbox-arrow,
.tooltip  .tooltip-arrow{border-width: 7px;border-color:#2ab7ea  transparent transparent  transparent; position: absolute; bottom: -15px; right: 10px; display: block;}

.tipbox-mini .tipbox-inner{ width: 100px;}
.shop-tool .badge{ position: absolute; right: -14px; top: -15px; width:20px; height:20px; line-height:20px; padding:0; border-radius:15px;text-align:center;}

.userinfo .shopping-item{ padding: 20px; position: relative; text-align: left; font-size: 12px; border-bottom: 1px solid #ddd;}
.userinfo .shopping-item .letter{ margin-bottom: 3px; display: block;}
.userinfo .shopping-del{ position: absolute; right: 10px; top: 30px; border-radius: 10px; background: #c7c7c8; color: #fff; width: 20px; height: 20px; line-height: 15px; text-align:center; font-size: 28px; *font-size: 19px;*line-height: 26px; }
.userinfo .shopping-item .total{ color: #3693b1; margin-left: 10px;}
.userinfo .tipbox-footer .total{ float: left; color: #fea11c; font-size: 24px; margin-top: 5px;}
.userinfo .tipbox-footer .btn{ float: right;}

/* 数字控件 */
.input-numeric { margin-bottom: 0; line-height: normal;}
.input-numeric .text{ border-radius: 0;height: 18px;line-height: 10px;padding: 0;position: relative;vertical-align: top;width: 30px;}
.input-numeric span.add-on{ line-height: 15px; color: #fff; padding:0; width: 7px; text-align: center; height: 18px;  background: #cccccc; border-radius: 0 !important; text-shadow: none; cursor: pointer;}
.input-append .add-on, .input-prepend .add-on {background-color: #eee;border: 1px solid #ccc;display: inline-block;    font-size: 14px;font-weight: normal;height: 20px;line-height: 20px;min-width: 16px;padding: 4px 5px;text-align: center;text-shadow: 0 1px 0 #fff;width: auto;
}
/*----------footer start-----*/
.footer{background:#454545;text-align:center;color:#ababab;padding:20px 0;min-width:1130px;}
.footer .lable{margin:10px auto;}
.footer .lable a{color:#fff;padding:0px 10px;font-size:14px;}
/*----------footer end-----*/

/*----------意见反馈start-----*/
.sidebar-fixed{right:-430px;}
.sidebarcontain{display:none;}
.sidebar-fixed{z-index:9999999999;}
.sidebar-fixed .float-options li .sidertitle{display:none;}
#rightbar_menu{top:330px;}
/*----------意见反馈end-----*/





/* 浮动提示 */
.link-fixedbox{
    font-family: '宋体';
    font-size:12px;
    display: inline-block;
    position: absolute;
    color: #fff;
    right: -10px;
    top: -10px;
    padding: 0px 5px;
    border-radius: 3px;
    font-style: normal;
    line-height: normal;
    background: #fe1900;
    background-image: -moz-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -webkit-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -ms-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -o-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: linear-gradient(top, #fe1900 10%, #d50400 70%);
    border: 1px solid #bb0500;

}
.link-fixedbox:hover{ color: #fff;}


/*----------form 表单元素样式 */
select,input[type="file"]{height:30px;*margin-top:4px;line-height:30px}
select{width:206px;background-color:#fff;border:1px solid #ccc}
fieldset{padding:0;margin:0;border:0}
legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:40px;color:#333;border:0;border-bottom:1px solid #e5e5e5}
legend small{font-size:15px;color:#999}
label,input,button,select,textarea{font-size:14px;font-weight:normal;line-height:20px}
input,button,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
label{display:block;margin-bottom:5px}
select,textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input{display:inline-block;height:30px;padding:4px 6px;margin-bottom:10px;font-size:14px;line-height:20px;color:#555;vertical-align:middle;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}
input,textarea,.uneditable-input{width:206px}
textarea{height:auto}
textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input{background-color:#fff;border:1px solid #ccc;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border linear .2s,box-shadow linear .2s;-moz-transition:border linear .2s,box-shadow linear .2s;-o-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s}



/* --------登陆框 */
.login_box{padding-bottom:20px; width:422px !important; border-radius:6px 6px 6px 6px; background:#FFF;}
.login_box .guide{ height:45px; border-radius:6px 6px 0 0; background:#f1f2f2; background-image: linear-gradient(to bottom, #f3f3f3, #e9edec);}
.login_box .guide a.developer{ display:block; float:left; width:190px; height:45px; line-height:45px; border-radius:6px 0 0 0; border-right:1px solid #dfe2e2; border-bottom:1px solid #dfe2e2; font-size:18px; color:#333; text-align:center;}
.login_box .guide a.developer:hover{ background:#FFF; border-bottom:none; color:#ff7611;}
.login_box .guide a.on{ background:#FFF; border-bottom:none; color:#ff7611;}
.login_box .guide a.give{ border-radius:0; }
.login_box .guide a.off{ display:block; float:right; width:40px; height:45px; border-bottom:1px solid #dfe2e2; border-radius:0 6px 0 0; background:url(login/off.png) no-repeat center center;}
.login_box .guide a.off:hover{ background:url(login/off_hover.png) no-repeat center center;}
.login_box .div_login_form{ margin-top:40px;}
.login_box .form-group{padding:0;}
.login_box .div_login_form input{ width:250px; height:35px;}
.login_box .div_login_form a{ margin-left:10px; color:#999;}
.login_box .div_login_form a:hover{ color:#666;}

#user_reg {
    background: url("login/newback.png") repeat scroll 0 0 transparent;
    color: #0C419A;
    font-size: 12px;
    height: 28px;
    line-height: 28px;
    margin-bottom: 10px;
    margin-left: 82px;
    margin-top: 5px;
    padding-left: 10px;
    width: 280px;
}
#user_reg a {
}

.width_120{ width:120px!important; color:#333!important; font-size:16px; vertical-align: middle;}
.login_box .form-group .ml_130{ width:330px;padding-left:0px;}
.login_box .form-group .ml_130 #code{height: 30px;line-height: 30px;}
.login_box .login-button {
    background-color: #fb5641;
    border: 1px solid #fb5641;
    border-radius: 2px;
    color: #ffffff;
    font-weight: 700;
    height: 38px;
    line-height: 36px;
    width: 250px;
}
.login_box  #other_reg {
border-top: 1px solid #ccc;
    color: #006699;
    font-size: 14px;
    height: 26px;
    line-height: 24px;
    padding: 10px 0 0 24px;
}
/*登陆框 */

/* 帮助页面*/
.article {
    font-size: 13px;
}
.article h3, .article .stitle {
    border-bottom: 1px solid #dfdfe2;
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 10px;
    margin-top: 30px;
    padding: 10px;
}
.article .infobar {
    background: #f9f9f9 none repeat scroll 0 0;
    font-size: 12px;
    padding: 5px 10px;
}
.article h3 + .infobar, .article .stitle + .infobar {
    margin-top: -10px;
}
.article, .article p {
    color: #666;
}
.article .stitle {
    font-size: 15px;
}
.article ol li {
    list-style: outside none decimal;
}
.article {
    line-height: 1.7;
}

/* 浮动提示 */
.link-fixedbox{
    font-family: '宋体';
    font-size:12px;
    display: inline-block;
    position: absolute;
    color: #fff;
    right: -10px;
    top: -10px;
    padding: 0px 5px;
    border-radius: 3px;
    font-style: normal;
    line-height: normal;
    background: #fe1900;
    background-image: -moz-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -webkit-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -ms-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: -o-linear-gradient(top, #fe1900 10%, #d50400 70%);
    background-image: linear-gradient(top, #fe1900 10%, #d50400 70%);
    border: 1px solid #bb0500;

}
.link-fixedbox:hover{ color: #fff;}

.nav-tabs { border-bottom: 2px solid #2AB7EA }
.nav-tabs .active a:hover ,.nav-tabs li a:hover ,.nav-tabs .active a,.nav-tabs .active a:focus{ background: #2AB7EA; color: #fff; border-radius: 0;}

.table-emp{ font-family: "宋体" }
.table-emp tr:first-child{border: 1px solid #d9d9d9;}
.table-emp th{ background: #f0f0f0; font-weight: normal; }
.table-emp td{ border-bottom: 1px solid #ddd; vertical-align: middle;}
.table-emp th ,.table-emp td{ text-align: left;padding-left:20px;}
.table-emp select{ width: 100px;}
.table-emp em{ font-style: normal; color: #ff2424; }
.table-emp .row-disabled{ color: #a7a7a7;}
.table-emp .row-disabled .payed{ color: #92d18b;}

.floatnote{display: block; position: fixed ; left: 0 ; top:40%; width: 133px; height: 129px; background:url(../img/pub-note.png) no-repeat; }
.shop-tool .badge{ position: absolute; right: -14px; top: -15px; width:20px; height:20px; line-height:20px; padding:0; border-radius:15px;text-align:center;}

.app-link{ color: #12ad02;}
.app-list .caption { border-bottom: 1px dotted #ddd; padding: 10px 0;}
.app-list  a{ color: #666;}
.app-list  [type=text]{ margin-bottom: 0;}

.modal-header h1{ margin: 0;}
.modal-body{ font-family: '宋体';}

.nav-tabs + .nav-tabs-alert{ margin-top: -20px;}
.nav-tabs-alert{ background: #f8f8f8; border: none; padding: 20px; margin-bottom: 20px; }
.nav-tabs-alert small{ color: #999;}

.table-center th ,.table-center td { text-align: center; }
.table-default td{ font-size: 12px; vertical-align: middle;}

.text-danger{ color: #fc6e48;}

.radio,.checkbox{ display: inline-block;}
.radio + .radio,.checkbox + .checkbox{ margin-left: 10px;}

input.input{ margin-bottom: 0;}

.list,.list-col{ list-style: none;  margin: 0; padding: 0;}

.list-col > li,.list-col-5 > li{ width: 33.3%;float: left;}
.list-col-5 > li{ width: 20%;}
.list-col-4 > li{ width: 25%;}
.list-col .col-inner{ padding: 20px; }
.list-col-wide{ margin-left: -20px; margin-right: -20px;}

.list li{ padding:5px 10px; float: none; width: auto; }

.block{ display: block;}
.block + .block { margin-top: 20px;}

.dropdown-default{ color: #2ab7ea;}
.dropdown-default .icon:before {
    content: "\f078";
}
.dropdown-default.active .icon:before {
    content: "\f077";
}
.dropdown-default:hover{ text-decoration: none;}

.caption{ font-size: 16px; font-family: 'Microsoft YaHei', courier new, courier, monospace;}

.thumb{ position: relative;}
.thumb .caption{ margin-top: 10px;}
.thumb .icon-arrow-right{ position: absolute; right: -10px; top: 35%; width: 39px; height: 37px; background:url(app/app/icon-arrow.png) no-repeat; }
.thumb .icon-arrow-right:before{ content: '';}

.list-link a , .list-link span{ margin: 0 5px;}

.form-label{ display: inline-block; margin-right: 10px; width: 100px; vertical-align: middle;}
.form-center{ width: 400px; margin-left: auto; margin-right: auto;}

.message{  font-size: 24px; font-family: microsoft yahei, verdana; padding: 20px 0;}

.optionsbar{ margin-bottom: 20px;}

/**/

.stepbar{position: relative; margin:20px 20px 40px 20px; height: 50px;}
.stepbar ul{ position: absolute; z-index: 1;}
.stepbar li{ color: #666; font-family: tahoma; font-size: 23px; background: #fff; float:left ;text-align: center; width: 38px; height: 38px; border-radius: 30px;border: 3px solid #8a8a8a; line-height: 38px;position: relative;}
.stepbar li + li{ margin-left: 110px}
.stepbar .name{position: absolute; top: 40px; width: 100px; left: -30px; text-align: center; font-size: 14px; font-family: "microsoft yahei"; display: inline-block;}
.stepbar hr.line{margin: 0 20px; position: relative; top: 17px; border-width: 4px; border-color: #8a8a8a;}

.stepbar-small li ,
.stepbar-reg li { position: relative; float: left; }
.stepbar-small li .item ,
.stepbar-reg li .item {line-height: 60px; font-size: 50px;  width: 60px; height: 60px;  z-index: 1; text-align: center;color: #e0e0e0; border-radius: 40px;  border: 5px solid #e0e0e0;position: absolute;left: 45%; top:-10px; background: #fff;}
.stepbar-small li  hr.line ,
.stepbar-reg li hr.line { background:#e0e0e0; border: none; height: 6px; margin: 22px 0; position: relative;}
.stepbar-small li .name,
.stepbar-reg li .name{ color: #a8a8a8; position: absolute; top: 51px; width: 100px; left: -16px; text-align: center; font-size: 16px; font-family: "microsoft yahei"; display: inline-block;}
.stepbar-small li.active  hr.line ,
.stepbar-reg li.active hr.line{ background: #2ab7ea;}
.stepbar-small li.active .item,
.stepbar-reg li.active .item,
.stepbar-small li.active .name ,
.stepbar-reg li.active .name{ color: #2ab7ea;}
.stepbar-small li.active .item,
.stepbar-reg li.active .item{ border-color:#2ab7ea;}

.stepbar-reg{ margin: 0;}
.stepbar-reg li { width: 50%;}
.stepbar-reg li .item i{ margin-left: -10px;}
.stepbar-reg li.active hr.line:after{ content: url(public/stepbar-reg-arrow.png); display: block; width:14px; height: 6px; position: absolute;right: 0px; }

.stepbar-reg-six { margin-top: 10px; height: 70px;}
.stepbar-reg-six li { width: 16.66666666%; }
.stepbar-reg-six li .item,
.stepbar-small li .item{font-size: 20px; width: 30px; height: 30px;line-height: 30px;left: 37%;   }
.stepbar-reg-six li hr.line,
.stepbar-small li hr.line{ margin: 9px 0;}
.stepbar-reg-six li .item i{ margin-left: -5px;}
.stepbar-reg-six li .name,
.stepbar-small li .name{ left: -30px; top:45px; }

.stepbar-reg-six.stepbar-center { width: 640px; margin-left:auto; margin-right: auto;}
.stepbar-reg-six.stepbar-center li{ width: 23%; }

.stepbar-small{ height: 80px; margin-top:20px;}
.stepbar-small li { width: 50%; height: 20px;}
.stepbar-small li i{  font-style: normal; }
.stepbar-small li .item{ background: #E0E0E0; color: #fff;   }
.stepbar-small li.active .item { background: #2ab7ea;color: #fff;}
.stepbar-small li hr.line{ left: -60%; height: 10px; margin: 7px 0;}

.stepbar-small-three li{ width: 33.3333%;}

.stepbar-four li { width: 25% ; }