@charset "utf-8";
/* CSS Document */
/*edit by yhn 2024-01-04*/
/*--初始化内容--*/
html {scroll-behavior: smooth;}
input::-webkit-input-placeholder {color: #9b9b9b;}
input::-moz-placeholder {color:#9b9b9b;}
input:-ms-input-placeholder {color:#9b9b9b;}
textarea::-moz-placeholder {color:#9b9b9b;}
textarea::-webkit-input-placeholder {color: #9b9b9b;}
textarea::-ms-input-placeholder {color:#9b9b9b;}
div,span,p {color: #3d485d;}
@font-face {
	font-family: sjll;
	src: url('../fonts/sjll.ttf')
}
@font-face {
	font-family: ys;
	src: url('../fonts/ys.ttf')
}
@font-face {
	font-family: din;
	src: url('../fonts/din.otf')
}
.font-f-sjll {font-family: sjll;}
.font-f-din {font-family: din;}
.font-f-ys {font-family: ys;}
/*--变量--*/
:root{--cwhite:#fff;--cgrey:#f5f6f8;--cblue:#0250b4; --cbluelight:#007aff;--cgreylight:#f2f4f8;--dark:#242933;}
/*--基本框架结构--*/
.w1200 {width: 1200px; margin: auto;}
.bg {background-color: var(--cwhite);}
.bg2 {background-color: var(--cgreylight);box-shadow: inset 8px 8px 20px 0 rgba(55,99,170,.11), inset -8px -8px 20px 0 #fff;}
a.linkblue {color: var(--cblue);}
a.linkblue:hover {color: var(--cbluelight);}

/*--头部--*/
.head-box  		{background-color: var(--cwhite); border-bottom: 1px solid #ebebeb;}
.head-bar-box   {height: 62px; }
.head-bar-box .logo-box     {height: 100%; padding: 10px 0px; float: left;}
.head-bar-box .logo-box img {height: 100%; width: auto;}
.head-bar-box .usertools-box {height: 62px; line-height: 62px; float: right; font-size: 14px;}
.head-bar-box .usertools-box a       {color: var(--cblue); vertical-align: middle;}
.head-bar-box .usertools-box a:hover {color: var(--cbluelight);}
.head-bar-box .usertools-box>a {display: inline-block; width: 100px; height: 32px; line-height: 32px; text-align: center; background-color: #f0f0f0; border-radius: 2px; color:#3a3a3a ; font-size: 14px;}
.head-bar-box .usertools-box>a.btn-register       {background-color: #f0f0f0; border:1px solid #f0f0f0}
.head-bar-box .usertools-box>a.btn-register:hover {background: #ecf2fe; border: 1px solid #0052d9; color: #0052d9;}
.head-bar-box .usertools-box>a.btn-login {color: #fff; background-color: #0052d9; margin-left: 10px;}
.head-bar-box .usertools-box>a.btn-login:hover {color: #fff; background-color: var(--cbluelight);}
.head-box .webtitle {font-size: 16px; font-weight: bold; vertical-align: middle;}

.banner-box {height: 400px; background-image: url(../images/banner.jpg); background-position: center; background-size: cover; background-repeat: no-repeat;}
.slogan {text-align: center; font-size:48px; line-height: 60px; padding-top: 160px; color: #fff; text-shadow: 0px 2px 2px rgba(0,0,0,.5);}
.slogan span {color: #fff;}
.help-box {padding-top: 25px; padding-left: 18px;}
.help-box a{display: block; width: calc(50% - 15px); height: 130px; background-color: #fff; border-radius: 6px; border: 1px solid #eaf2f2; margin-bottom: 10px; margin-right: 10px; text-align: center; float: left;}
.help-box a img {width: 80%; height: auto;}
.help-box span {text-align: center; display: block; font-size: 12px;}


/*--导航--*/
.nav-box {z-index: 2;}
.nav-btn {margin-top: -40px; top:0px; cursor: pointer; transition: all .3s;}
.nav-btn {display: block; margin-right: 20px; background-image: linear-gradient(0deg,#fff,#f3f5f8); border: 2px solid #fff; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1); border-radius: 4px;  box-sizing: border-box;  width: 1px;  max-width: none;  height: auto; padding: 18px 18px; position: relative;  pointer-events: auto;}
.nav-btn:last-of-type {margin-right: 0px;}
.nav-btn span {font-size: 18px;}
.nav-btn a {font-size: 18px;}
.nav-btn:hover {box-shadow: 10px 10px 20px 0 rgba(55,99,170,.2); top:-5px}
.nav-btn:hover span { color: var(--cbluelight);}
.nav-btn::before {content: "";left: 0px; top:0px; position: absolute; width: 100%; height: 100%; background-image: url(../images/logobg.png); background-repeat: no-repeat; background-position-x: right; background-position-y: 10px; background-size: 70px; opacity: .05;}

.nav-icon {display: inline-block; height: 36px; line-height: 36px; vertical-align: middle; width: 36px; background-repeat: no-repeat; background-position: center; background-size: 32px; margin-right: 5px;}
.icon-home     {background-image: url(../images/nav/nav_home.png);}
.icon-news     {background-image: url(../images/nav/nav_news.png);}
.icon-purchase {background-image: url(../images/nav/nav_purchase.png);}
.icon-supplier {background-image: url(../images/nav/nav_supplier.png);}
.icon-help     {background-image: url(../images/nav/nav_help.png);}
.icon-about    {background-image: url(../images/nav/nav_about.png);}
/*--内容--*/
.viewbox {margin-top: 40px;}
.viewbox.fix {margin-top: -40px; padding-top: 70px; padding-bottom: 40px;}
.boxstyle {box-shadow: 0px 0px 5px 0 rgba(55,99,170,.1); background-color: var(--cwhite);}
.cbox           {}
.cbox .head-cbox {padding: 10px; margin-bottom: 30px;}
.cbox .head-cbox .ctitle {text-align: center;font-weight: 500; font-size: 28px; color: #000; line-height: 48px;}
.cbox .head-cbox .titleinfo {text-align: center; font-size: 14px; color: #3d485d;}
a.link       {color: var(--cblue); vertical-align: middle;}
a.link:hover {color: var(--cbluelight);}
.newsbox {padding: 10px;}
.news-pic-box {width: 500px; background-color: #000000;}
.news-pic-box .newspic-txt {position: absolute; width: 100%; bottom: 0px; height: 60px; line-height: 40px; text-align: center; font-size: 16px; color: #fff; background-color: rgba(0,0,0,.6);}

.news-list-box {}
.news-list-box ul.news-list   {padding-left: 20px;}
.news-list-box ul.news-list li {margin-bottom: 10px;}
.news-list-box ul.news-list li:last-of-type {margin-bottom: 0px;}


.news-list-box ul.news-list .date  		{width: 100px; border-right: 1px solid #f1f1f1; padding-right: 10px; padding-top: 5px;}
.news-list-box ul.news-list .date span  {display: block; text-align: right; font-size: 16px; text-align: right; line-height: 150%;}
.news-list-box ul.news-list .date .day  {font-size: 16px;}
.news-list-box ul.news-list .date .year {font-size: 14px; color: #bababa;}
.news-list-box ul.news-list .newstitle  {padding: 20px; font-size: 16px;}
.news-list-box ul.news-list a:hover .newstitle {color: var(--cbluelight);}
/*--首页普通列表--*/
.list-box { padding-top: 10px;}
.list-box ul li {padding: 15px 10px; padding-right: 10px;}
.list-box ul li a{display: block; font-size: 16px; padding-right: 30px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.list-box ul li a:hover span.info{color: var(--cbluelight);}
.list-box ul li a .date {float: right; color: #bababa; padding-left: 50px;}
.list-box ul li a .info {}

/*--切签--*/
.box      {padding: 0px 10px;}
.box .tab-head {height: 70px; line-height: 70px; border-bottom: 1px solid #f5f7fb;}
.box .tab-head a{height: 70px; line-height: 70px; font-size: 18px; padding: 0px 10px; margin-right: 10px; display: inline-block; position: relative;}
.box .tab-head a:hover {color: var(--cbluelight);}
.box .tab-head a.on    {color: #0052d9;}
.box .tab-head a.on:before {content: ""; position: absolute; bottom: 0px; height: 4px; left: 0px; right: 0px; background-color:#0052d9;}
.box .tab-head a:before {content: ""; position: absolute; bottom: 0px; height: 0px; left: 0px; right: 0px; background-color:#0052d9; transition: all .3s;}

.box .body {height: calc(100% - 70px);}
.height-b  {height: 400px;}
/*--元素--*/
.txt-line {display: inline-block; height: 18px; line-height: 18px; vertical-align: middle; width: 20px; text-align: center;}
.txt-line::before {content: ""; display: inline-block; width: 2px; height: 100%; background-color: var(--cblue);}
.boxbga {background-image: linear-gradient(180deg,#f3f5f8,#fff);}

/*--底部--*/
.foot-box {background-color: var(--dark); padding: 40px 0px 0px 0px; color: #fff;}
.wk_footer {margin: 0 auto;  color: #242933; line-height: 26px; background: none;}
.wk_footer .sitemap { padding: 0px 50px;}
.wk_footer .sitemap::after {content: ""; display: block; clear: both;}
.wk_footer .sitemap .sitenav {float: left; width: 180px;}
.wk_footer .sitemap .sitenav .firstnav {margin-bottom: 20px; font-size: 14px; color: #fff; font-weight: bold;}
.wk_footer .sitemap .sitenav .subnav {}
.wk_footer .sitemap .sitenav .subnav a,
.wk_footer .sitemap .sitenav .subnav span {display: block; line-height: 28px; margin: 0px; color: #eaeaea;}
.wk_footer .sitemap .sitenav .subnav a:hover {text-decoration: none;}
.wk_footer .sitemap .sitenav.wl {width: 380px;}
.wk_footer .sitemap .sitenav.wm {width: 300px;}
.wk_footer .sitemap .sitenav.ws {width: 160px;}

.wk_footer .copyright {text-align: center; height: 50px; line-height: 50px; margin-top: 40px; background: none; background-size: 150px; color: #fff; font-size: 14px;border-top: 1px solid hsla(0,0%,100%,.1);}
.wk_footer .copyright span,
.wk_footer .copyright a {color: #fff;}
.wk_footer .sizebig   {font-size: 24px; line-height: 30px !important; margin-bottom: 5px !important; color: #fff;}
.wk_footer .foot-logo {height: 60px; margin-bottom: 10px; }
.wk_footer .foot-logo img {height: 80%; width: auto; }
/*--轮播--*/
.slider-box { overflow: hidden; height: 330px; padding-top: 0px;}
.slider { position: relative; overflow: auto; width: 100% !important; }
.slider li { list-style: none; position: relative;}
.slider ul li { float: left; }
.slider ul li a {display: block;}
.slider ul li img{ width: 100%; height: 100%;}
.slider .dots {position: absolute;left: 0;right: 0;bottom: 7px; text-align: center;}
.slider .dots li {display: inline-block;width: 10px;height: 10px; line-height: 10px; vertical-align: middle; margin: 0 4px;text-indent: -999em; border-radius: 8px;cursor: pointer; background-color: #9f9f9f;}
.slider .dots li.active {background: var(--cbluelight);}
.energy-slider-box {height: 100%;}
/*--统计--*/
.statistics-box {padding-top:10px}
.statistics-box .datalist {border-bottom:1px dashed #e7f3f3; height: 80px; padding-top: 4px;}
.statistics-box .datalist .iconx {width: 70px; height: 70px; float: left; margin-right: 10px;}
.statistics-box .datalist .iconx img {width: 100%;}
.statistics-box .datalist .datatitle {display: block; font-size: 14px; height: 18px; line-height: 18px;  padding-top: 15px;}
.statistics-box .datalist .datainfo {display: block; font-size: 24px; height: 30px; line-height: 30px; color: #0052d9; font-weight: bold;}
.statistics-box .datalist .datainfo span {color: #0052d9;}
.statistics-box .datalist:last-of-type {border-bottom: none;}
.statistics-smart-box {position: relative; padding:10px 0px 10px 10px; z-index: 5; background-image: linear-gradient(0deg,#fff,#f3f5f8); border: 2px solid #fff; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);  border-radius: 4px; margin-right: 40px;}
.statistics-smart-box:last-of-type{margin-right: 0px;}
.statistics-smart-box .datalist .iconx {width: 70px; height: 70px; float: left; margin-right: 10px;}
.statistics-smart-box .datalist .iconx img {width: 100%;}
.statistics-smart-box .datalist .datatitle {display: block; font-size: 14px; height: 18px; line-height: 18px;  padding-top: 15px;}
.statistics-smart-box .datalist .datainfo {display: block; font-size: 24px; height: 30px; line-height: 30px; color: #0052d9; font-weight: bold;}
.statistics-smart-box .datalist .datainfo span {color: #0052d9;}
/*二级菜单*/
.subnav-side-box {width: 200px;}
.subnav-side-box .box-head {height: 70px; line-height: 70px; border-bottom: 1px solid #0052d9; font-size: 18px; padding-left: 5px; font-weight: bold;}
.subnav-side-box .body {padding: 10px 0px;}
.subnav-side-box .body a {display: block; height: 40px; line-height: 40px; padding-left: 20px; font-size: 16px; border-radius: 4px; background-image:none; margin-bottom: 10px; transition: all .3s;}
.subnav-side-box .body a.on,
.subnav-side-box .body a:hover {background-image: linear-gradient(170deg,#2EDBFD,#0152D9); color: #fff;}

.boxstyle.fix {margin-left: 210px;}
/*--信息列表--*/
.infolist {padding:20px 10px;}
.infolist .infolist-box a             {height: 58px; display: flex; border-radius: 4px; border: 1px solid #f2f9f9; padding: 5px 0px; background-color: #fafcfc; box-shadow: 0px 0px 5px 0 rgba(55,99,170,0); transition: all .3s; margin-bottom: 10px;}
.infolist .infolist-box a:hover       {background-color: #fff; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);}
.infolist .infolist-box a .title      {height: 58px; line-height: 58px; flex: 1; font-size: 16px; padding-left: 20px;}
.infolist .infolist-box a:hover .title {color: var(--cbluelight);}
.infolist .infolist-box a .date  	  {width: 100px; border-left: 1px solid #f1f1f1; padding-left: 10px; padding-top: 5px;}
.infolist .infolist-box a .date span  {display: block; font-size: 16px; text-align: left; line-height: 150%;}
.infolist .infolist-box a .date .day  {font-size: 16px;}
.infolist .infolist-box a .date .year {font-size: 14px; color: #bababa;}
.infolist .infolist-box a .download   {width: 120px; border-left: 1px solid #f1f1f1; padding-left: 30px; padding-top: 20px;}
.infolist .infolist-box a .download   {background-image: url(../images/help/donwload.png); background-size: 24px; background-position: 5px center; background-repeat: no-repeat; font-size: 14px;}
.height-auto {height: auto; min-height: 500px;}
.pages        {text-align: right; padding-top: 20px;}
.pages>button {padding: 0 8px; font-size: 14px;}
.inputnumber {background-color: #fff;  background-image: none; transition: all .3s; display: inline-block;  width: 90px; margin: 0;  padding: 0; border: 1px solid #d9d9d9; border-radius: 4px; width: 32px; margin-right: 8px; display: inline-block;}
.inputnumber {box-sizing: border-box; font-variant: tabular-nums; list-style: none; font-feature-settings: "tnum"; position: relative; height: 32px; color: rgba(0,0,0,.65); font-size: 16px;  line-height: 1.5;text-align: center; }
.inputnumber:hover {border-color: #40a9ff; border-right-width: 1px!important;}
.number-input {width: 100%; height: 28px; font-size: 14px; line-height: 28px; text-align: center; background-color: transparent; border: 0; border-radius: 4px; outline: 0;  transition: all .3s linear;}
.pages-btn {transition: all .3s; display: inline-block;  width: 90px; margin: 0;  padding: 0; border: 1px solid #d9d9d9; border-radius: 4px; width: 32px; height: 32px; line-height: 32px; margin-right: 8px; display: inline-block; background-color: #fff;}
.pages-btn:hover {border-color: #40a9ff; color: #40a9ff;}
.pages-btn[disabled='disabled'] {cursor: no-drop; pointer-events: none;}
.bread-nav-box {padding: 0px 0px 20px 0px; font-size: 14px;}
.info-show {padding: 50px;}
.info-show .info-head {padding: 10px; line-height: 150%; font-size: 32px; text-align: center; border-bottom: 1px solid #cbcbcb; font-weight: bold;}
.info-show .info-head span.time {font-size: 14px; display: block; text-align: center; padding-top: 10px; color: #666 !important; font-weight: 400;}
.info-show .info-body {padding: 20px; line-height: 200%; font-size: 16px; color: #2e3033;}
.info-show.purchase .info-head span{color: #f00;}
.info-show.notice {padding-top: 10px; padding-bottom: 10px;}
.info-show.notice .info-head {font-size: 18px;}
.info-show.notice .notice-box .notice-info {float: left; width: 33%;padding: 15px 0px;}
.notice-info .title {font-size: 14px; text-align: right; width: 150px; display: block;}
.infopic {text-align: center; padding-top: 30px;}
.infopic img{max-width: 60%;}
.hsearch-box {background-color: #f9f9f9; margin-bottom: 10px; border: 1px solid #f5f5f5;}
.hsearch-box .search-row-box {height: 60px; line-height: 60px; padding-left: 20px;}
.hsearch-box .search-row-box .search-title {width: 80px; font-size: 14px;}
.hsearch-box .search-row-box .search-info {}
.hsearch-box .search-row-box .search-info a {display: inline-block; height: 32px; line-height: 32px; padding: 0px 20px; background-color: rgba(0,122,255,.0); font-size: 14px; transition: all .3s; border-radius: 4px;}
.hsearch-box .search-row-box .search-info a.on,
.hsearch-box .search-row-box .search-info a:hover {background-color: rgba(0,122,255,1); font-size: 14px; color: #fff;}
.typex {margin-right: 10px; font-weight: bold; position: relative; top: -1px;}

.inputst {font-size: 14px; height: 34px; line-height: 34px; border: 1px solid #d9d9d9; padding-left: 5px; border-radius: 4px; box-sizing: border-box;}
.inputst[disabled] {background-color: #f1f1f1; cursor: no-drop;}
.ca {font-size: 14px; font-weight: bold; padding: 5px; text-align: center; color: #f00;}
/*--采购--*/
.notice-file-box {padding-top: 50px;}
.notice-file-box .title{font-size: 24px; font-weight: bold;}
.notice-file-box .file-list {padding-top: 20px;}
.notice-file-box .file-list>li {font-size: 14px; padding: 10px 0px;}
/*--锚地导航--*/
.fix-nav {position:fixed; z-index: 2; left: 50px; bottom:450px; width: 120px; background-color:rgba(255,255,255,.6) ;backdrop-filter: blur(10px); border:1px solid #e7e7e7; transition: all .3s;}
.fix-nav ul{padding: 0px 15px;}
.fix-nav ul li {height: 42px; line-height: 42px; text-align: center; border-bottom: 1px solid rgba(0,0,0,.2);}
.fix-nav ul li:last-of-type {border-bottom: none;}
.fix-nav ul li a:hover {color: var(--cbluelight);}
@media screen and (max-height: 700px) {
 .fix-nav {bottom: 100px;}
}
/*--公司介绍二级导航--*/
.bg3 {background: linear-gradient(180deg,#eceff2,#fff); margin-top: -36px;}
.subnav-introduce {text-align: center; text-align: center; padding: 100px 0px 50px 0px;margin-top: -40px;}
.subnav-introduce a{width: 200px; height: 46px; line-height: 46px; font-size: 14px; display: inline-block; text-align: center; color: #3d485d; background-color: #fff; margin-right: 10px; border: 1px solid rgba(0,0,0,0); transition: all .3s ;}
.subnav-introduce a.on {background-color: #0052d9; color: #fff;}
.subnav-introduce a:hover {background: #ecf2fe; border: 1px solid #0052d9; color: #0052d9;}
.subnav-introduce a.on:hover {background: #2670e8; color: #fff;}
.bg4 {background-color: #f5f7fa;}
/*--联系方式--*/
.contact-list-info {width: 180px; margin: auto; text-align: left !important;}
/*--关于我们--*/
.cbox {padding-top: 50px;}
.body-cbox {padding-top: 0px;}
.n-info {font-size: 16px; line-height: 30px; width: 1000px; margin: auto;}
.n-info p{font-size: 18px; line-height: 30px; text-indent: 36px;}
.about-icon-box {padding: 50px 0px;}
.about-icon-box li{ width: 200px;}
.about-icon-box li .about-icon{ width: 100px; height: 100px; margin: auto; border-radius: 100px; background-color: #fff; overflow: hidden; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);}
.about-icon-box li .about-icon img {width: 100%; height: auto;}
.about-icon-box li .about-icon-title {padding-top: 20px; font-size: 14px; line-height: 150%; text-align: center;}
.fzlc {padding: 30px 0px; position: relative; width: 1000px; margin: auto;}
.fzlc p {margin-top: 0px; flex:1; text-indent: 0px; padding-left: 80px; font-size: 18px; line-height: 32px;}
.infobox {margin-bottom: 40px; display: flex;}
.fzlc .timeline-title {font-size: 16px; text-align: right; width: 160px; line-height: 24px;}
.fzlc .timeline-title .time {color: #808080; font-size: 14px;}
.fzlc .linex {position: absolute; width: 1px; height: calc(100% - 160px); background-color: #bebebe; left: 200px;}
.business-box {width: 1000px; margin: auto; text-align: center; padding-bottom: 50px;}
.business-box li {width: calc(50% - 50px); display: inline-block; margin: 0px 10px; margin-bottom: 20px; height: 100px; padding: 30px; box-sizing: border-box; line-height: 150%; text-align: left; overflow: hidden;}
.business-box li {z-index: 5; background-image: linear-gradient(0deg,#fff,#f3f5f8); border: 2px solid #fff; box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);  border-radius: 4px; position: relative; padding-left: 200px;}
.business-box li img {position: absolute;top:0px; left: 0px; height: 100%;}
.business-box li span:first-of-type {display: block; font-size: 22px; color: var(--cblue);}
.business-box li span:last-of-type {display: block; font-size: 16px; padding-top: 10px;}
.zzbox {width: 1000px; margin: auto; padding-bottom: 50px;}
.zzbox .row {}
.picstyle1 {width: 240px; display: inline-block; margin: 0px 20px; margin-bottom: 20px;}
.picstyle1 img {width: 100%; height: auto;}
.picstyle2 {width: 150px; display: inline-block; margin: 0px 20px; margin-bottom: 20px;}
.picstyle2 img {width: 100%; height: auto;}
.bg-earth {background-color: #f6f6f6; background-image: url(../images/about/customer.png);background-position: center; background-repeat: no-repeat;}
.bg-zz {background-image: url(../images/about/zzbg.jpg);background-position: center; background-size: cover;}
.about-pic-box {text-align: center; padding-bottom: 80px;}
.about-pic-box li{display: inline-block; margin: 0px 10px;}
.about-pic-box li .pic-view {width: 300px; height: 162px;border: 4px solid #fff; box-shadow: 0px 0px 5px rgba(0,0,0,.3); overflow: hidden;}
.about-pic-box li .pic-view img{width: 100%; height: auto;left: 0px; margin-top: 0px; margin-left: 0px;  transition: all .3s;}
.about-pic-box li .pic-view:hover img{width: 110%; left: 50%; margin-left: -10px; margin-top: -5px;}
.about-pic-box li .pic-title {height: 50px; line-height: 50px; text-align: center; font-size: 14px;}
.about-pic-box li .pic-view2 {width: 250px; height: 148px;border: 4px solid #fff; box-shadow: 0px 0px 5px rgba(0,0,0,.3); overflow: hidden;}
.about-pic-box li .pic-view2 img{width: 100%; height: auto;left: 0px; margin-top: 0px; margin-left: 0px;  transition: all .3s;}
.about-pic-box li .pic-view2:hover img{width: 110%; left: 50%; margin-left: -10px; margin-top: -5px;}
.contact-info {padding-bottom: 80px;}
.contact-info li {height: 44px; font-size: 16px; line-height: 44px; text-align: center;}
.biglogo {text-align: center; margin-bottom: 40px;}
.biglogo img {width: 400px;}
.map {width: 700px; margin: auto; padding-bottom: 80px;}
.map img {width: 100%; border: 1px solid #d9d9d9;}
.pl48 {padding-left:34px;}
.pl60 {padding-left: 52px;}

/* CSS */
.no-spin-buttons::-webkit-inner-spin-button,
.no-spin-buttons::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.no-spin-buttons {
  -moz-appearance: textfield;
}
/*--加载--*/
.loading-box {position: absolute; height: 100%; width: 100%; top:0px; left: 0px; background-color: rgba(255,255,255,.1); z-index: 5;}
.loading { position: absolute;top: 50%; left: 50%;  transform: translate(-50%, -50%);height: 40px; display: flex;  align-items: center; }
.item { height: 50px; width: 5px; background: #dcdcdc; margin: 0px 3px; border-radius: 10px;  animation: loading 1s infinite; }   
.item:nth-child(2) {animation-delay: 0.1s; }
.item:nth-child(3) {animation-delay: 0.2s;}
.item:nth-child(4) {animation-delay: 0.3s; }
.item:nth-child(5) { animation-delay: 0.4s; }
.item:nth-child(6) {animation-delay: 0.5s;}
.item:nth-child(7) {animation-delay: 0.6s;}
.item:nth-child(8) { animation-delay: 0.7s;}
 /* 设置动画 */
@keyframes loading {
    0% {
        height: 0px;
    }

    50% {
        height: 50px;
    }

    100% {
        height: 0px;
    }
}