body{
  margin: 0;
  padding: 0;
  font-family: "微软雅黑", Arial;
}
a{
  color: #404040;
  text-decoration: none;
}
.pagination{
  display: flex;
  justify-content: flex-start;
}
.pagination li{
  margin: 0 4px;
  border-radius: 4px;
  height: 30px;
  background-color: #f3f3f4;
  cursor: pointer;
  line-height: 30px;
}

.pagination li.active{
  background-color: #5d9dfc;
  color: #FFFFFF;
}
.pagination a,.pagination span{
  display: block;
  padding: 0 16px;
}
.pagination a:hover {
  border-radius: 4px;
  background-color: #5d9dfc;
  color: #FFFFFF;
}
.pagination a.page-num-current {
  color: #fff;
  background: #333;
  border: 1px solid #333;
}
#app {
  font-weight: normal;
  width: 100%;
  height: 100%;
}
.w-1200{
  width: 1200px;
  margin: auto;
}
.w-25{
  width: 25%;
}
.w-75{
  width: 75%;
}
.w-30{
  width: 30%;
}
.w-70{
  width: 70%;
}
.h-100{
  height: 100% !important;
}
.h-64{
  height: 64px !important;
}
.w-100{
  width: 100% !important;
}
.vh-100 {
  height: 100vh !important;
}
.vh-60{
  height: calc(100vh - 60px) !important;
}
.flex {
  display: flex !important;
}
.align-center {
  align-items: center !important;
}
.justify-start{
  justify-content: flex-start !important;
}
.justify-end{
  justify-content: flex-end !important;
}
.justify-center{
  justify-content: center !important;
}
.justify-between{
  justify-content: space-between !important;
}
.overflow-hidden {
  overflow: hidden !important;
}
.flex-column {
  flex-direction: column !important;
}
.flex-column-reverse {
  flex-direction: column-reverse !important;
}
.flex-row {
  flex-direction: row !important;
}
.flex-row-reverse {
  flex-direction: row-reverse !important;
}
.flex-wrap{
  flex-wrap: wrap !important;
}
.flex-flow{
  flex-flow: row wrap !important;
  flex-wrap: wrap !important;
  -ms-flex-wrap: wrap;
}
.shadow {
  box-shadow: 0 .5rem 1rem #00000026 !important;
}
.mx-auto {
  margin-right: auto !important;
  margin-left: auto !important;
}

/* #ifndef APP-PLUS-NVUE */
.m-auto{ margin: auto; }
/* #endif */
.m-1 { margin: 10px; }
.m-2 { margin: 20px; }
.m-3 { margin: 30px; }
.m-4 { margin: 40px; }
.m-5 { margin: 50px; }
.mt-0 { margin-top: 0; }
/* #ifndef APP-PLUS-NVUE */
.mt-auto { margin-top: auto; }
/* #endif */
.mt-1 { margin-top: 10px; }
.mt-2 { margin-top: 20px; }
.mt-3 { margin-top: 30px; }
.mt-4 { margin-top: 40px; }
.mt-5 { margin-top: 50px; }
.mb-0 { margin-bottom: 0; }
/* #ifndef APP-PLUS-NVUE */
.mb-auto { margin-bottom: auto; }
/* #endif */
.mb-1 { margin-bottom: 10px; }
.mb-2 { margin-bottom: 20px; }
.mb-3 { margin-bottom: 30px; }
.mb-4 { margin-bottom: 40px; }
.mb-5 { margin-bottom: 50px; }
.ml-0 { margin-left: 0; }
/* #ifndef APP-PLUS-NVUE */
.ml-auto { margin-left: auto; }
/* #endif */
.ml-1 { margin-left: 10px; }
.ml-2 { margin-left: 20px; }
.ml-3 { margin-left: 30px; }
.ml-4 { margin-left: 40px; }
.ml-5 { margin-left: 50px; }
.mr-0 { margin-right: 0; }
/* #ifndef APP-PLUS-NVUE */
.mr-auto { margin-right: auto; }
/* #endif */
.mr-1 { margin-right: 10px; }
.mr-2 { margin-right: 20px; }
.mr-3 { margin-right: 30px; }
.mr-4 { margin-right: 40px; }
.mr-5 { margin-right: 50px; }
.my-0 { margin-top: 0; margin-bottom: 0; }
/* #ifndef APP-PLUS-NVUE */
.my-auto { margin-top: auto; margin-bottom: auto; }
/* #endif */
.my-1 { margin-top: 10px; margin-bottom: 10px; }
.my-2 { margin-top: 20px; margin-bottom: 20px; }
.my-3 { margin-top: 30px; margin-bottom: 30px; }
.my-4 { margin-top: 40px; margin-bottom: 40px; }
.my-5 { margin-top: 50px; margin-bottom: 50px; }
.mx-0 { margin-left: 0; margin-right: 0; }
/* #ifndef APP-PLUS-NVUE */
.mx-auto { margin-left: auto; margin-right: auto; }
/* #endif */
.mx-1 { margin-left: 10px; margin-right: 10px;}
.mx-2 { margin-left: 20px; margin-right: 20px;}
.mx-3 { margin-left: 30px; margin-right: 30px;}
.mx-4 { margin-left: 40px; margin-right: 40px;}
.mx-5 { margin-left: 50px; margin-right: 50px;}

.p-0 { padding: 0; }
.p { padding: 5px; }
.p-1 { padding: 10px; }
.p-2 { padding: 20px; }
.p-3 { padding: 30px; }
.p-4 { padding: 40px; }
.p-5 { padding: 50px; }
.px-1{
  padding: 0 10px;
}
.px-2{
  padding: 0 20px;
}
.px-3{
  padding-left: 30px;
  padding-right: 30px;
}
.px-4{
  padding-left: 40px;
  padding-right: 40px;
}
.px-5{
  padding-left: 50px;
  padding-right: 50px;
}
.py-1{
  padding: 10px 0;
}
.py-2{
  padding: 20px 0;
}
.py-3{
  padding: 30px 0;
}
.py-4{
  padding: 40px 0;
}
.py-5{
  padding: 50px 0;
}
.pt-0 { padding-top: 0; }
.pt { padding-top: 5px; }
.pt-1 { padding-top: 10px; }
.pt-2 { padding-top: 20px; }
.pt-3 { padding-top: 30px; }
.pt-4 { padding-top: 40px; }
.pt-5 { padding-top: 50px; }
.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: 10px !important; }
.pb { padding-bottom: 5px !important; }
.pb-2 { padding-bottom: 20px !important; }
.pb-3 { padding-bottom: 30px !important; }
.pb-4 { padding-bottom: 40px !important;}
.pb-5 { padding-bottom: 50px; }
.pl-0 { padding-left: 0; }
.pl { padding-left: 5px; }
.pl-1 { padding-left: 10px; }
.pl-2 { padding-left: 20px; }
.pl-3 { padding-left: 30px; }
.pl-4 { padding-left: 40px; }
.pl-5 { padding-left: 50px; }
.pr-0 { padding-right: 0; }
.pr { padding-right: 5px; }
.pr-1 { padding-right: 10px; }
.pr-2 { padding-right: 20px; }
.pr-3 { padding-right: 30px; }
.pr-4 { padding-right: 40px; }
.pr-5 { padding-right: 50px; }
.py-0 { padding-top: 0; padding-bottom: 0; }
.py { padding-top: 5px; padding-bottom: 5px; }
.py-1 { padding-top: 10px; padding-bottom: 10px; }
.py-2 { padding-top: 20px; padding-bottom: 20px; }
.py-3 { padding-top: 30px; padding-bottom: 30px; }
.py-4 { padding-top: 40px; padding-bottom: 40px; }
.py-5 { padding-top: 50px; padding-bottom: 50px; }
.px-0 { padding-left: 0; padding-right: 0; }
.px-1 { padding-left: 10px; padding-right: 10px;}
.px { padding-left: 5px; padding-right: 5px;}
.px-2 { padding-left: 20px; padding-right: 20px;}
.px-3 { padding-left: 30px; padding-right: 30px;}
.px-4 { padding-left: 40px; padding-right: 40px;}
.px-5 { padding-left: 50px; padding-right: 50px;}

/* 圆角-20*/
.rounded-4 { border-radius: 4px;}
.rounded-6 { border-radius: 6px;}
.rounded-10 { border-radius: 10px;}
.rounded-15 { border-radius: 15px;}
.rounded-20 { border-radius: 20px;}
.rounded-top-10 {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.rounded-right-10 {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.rounded-bottom-10 {
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}
.rounded-left-10 {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.border-0{
  border: none;
}
.border-1{
  border: 1px solid #EEEEEE;
}
.fw-light {
  font-weight:300!important
}
.fw-lighter {
  font-weight:lighter!important
}
.fw-normal {
  font-weight:400!important
}
.fw-bold {
  font-weight:700!important
}
.fw-bolder {
  font-weight:bolder!important
}
.font-12{font-size: 12px;}
.font-13{font-size: 13px;}
.font-14{font-size: 14px;}
.font-16{font-size: 16px;}
.font-18{font-size: 18px;}
.font-20{font-size: 20px;}
.font-24{font-size: 24px;}
.font-30{font-size: 30px;}
.font-36{font-size: 36px;}
.font-50{font-size: 50px;}
.font-72{font-size: 72px;}
.font-90{font-size: 90px ;}
/* 行高 */
.line-height-20{line-height: 20px;}
.line-height-24{line-height: 24px;}
.line-height-30{line-height: 30px;}
.line-height-36{line-height: 36px;}
.line-height-40{line-height: 40px;}
.line-height-48{line-height: 48px;}
.line-height-50{line-height: 50px;}
.line-height-60{line-height: 60px;}
.line-height-80{line-height: 80px;}

.text-center{
  text-align: center;
}
/* 文字颜色 */
.text-loan {color:#beb9a7}
.text-white {color: #ffffff;}
.text-primary {color: #007bff;}
.text-hover-primary { color: #0056b3;}
.text-secondary {color: #6c757d;}
.text-hover-secondary { color: #494f54;}
.text-success {color: #28a745;}
.text-hover-success{color: #19692c;}
.text-info { color: #17a2b8;}
.text-hover-info {color: #0f6674;}
.text-warning {color: #ffc107;}
.text-hover-warning { color: #ba8b00;}
.text-danger { color: #dc3545;}
.text-hover-danger { color: #aa100a;}
.text-light { color: #f8f9fa;}
.text-hover-light { color: #cbd3da;}
.text-dark { color: #343a40;}
.text-hover-dark{ color: #121416;}
.text-body { color: #212529;}
.text-muted { color: #6c757d;}
/* 浅灰色 */
.text-light-muted { color: #A9A5A0;}
.text-light-black { color: rgba(0, 0, 0, 0.5);}
.text-light-white { color: rgba(255, 255, 255, 0.5);}

/* 背景颜色 */
.bg-loan { background-color: #f2f2f2;}
.bg-primary { background-color: #007bff;}
.bg-hover-primary:hover{ background-color: #0062cc;}
.bg-secondary { background-color: #6c757d;}
.bg-hover-secondary:hover{ background-color: #545b62;}
.bg-success { background-color: #28a745;}
.bg-hover-success { background-color: #1e7e34;}
.bg-info { background-color: #17a2b8;}
.bg-hover-info { background-color: #117a8b;}
.bg-warning { background-color: #ffc107;}
.bg-hover-warning { background-color: #d39e00;}
.bg-danger { background-color: #dc3545;}
.bg-hover-danger{ background-color: #aa100a;}
.bg-light { background-color: #f8f9fa;}
.bg-hover-light{ background-color: #dae0e5;}
.bg-dark { background-color: #343a40;}
.bg-hover-dark { background-color: #1d2124;}
.bg-white { background-color: #ffffff;}
.bg-transparent { background-color: transparent;}

.cursor{
  cursor: pointer;
}
.flex-shrink-0 {
  flex-shrink:0!important
}
.flex-shrink-1 {
  flex-shrink:1!important
}
.flex-wrap {
  flex-wrap:wrap!important
}
.flex-nowrap {
  flex-wrap:nowrap!important
}
.flex-wrap-reverse {
  flex-wrap:wrap-reverse!important
}
.position-relative{position:relative!important}
.position-absolute{position:absolute!important}

.top-50{top:50%!important}
.top-100{top:100%!important}
.bottom-0{bottom:0!important}
.bottom-50{bottom:50%!important}
.bottom-100{bottom:100%!important}
.start-0{left:0!important}
.start-50{left:50%!important}
.start-100{left:100%!important}
.end-0{right:0!important}
.end-50{right:50%!important}
.end-100{right:100%!important}

.col-md-4{
  flex: 0 0 auto;
  width: calc(33.33333333% - 10px);
  padding-right: 5px;
  padding-left: 5px;
}

.main-login{
  width: 30%;
  background-color: #ffffff;
}
.loginBg{
  width: 70%;
  background-color: #e4e2e1;
}
.main-header{
  height: 60px;
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
  background-color: #aa100a;
}
.main-left{
  width: 240px;
}
.main-right{
  width: calc(100% - 240px);
}
.top-logo{
  width: 240px;
  transition: inline-block .3s,left .3s,width .3s,margin-left .3s,font-size .3s;
}
.top-main{
  width: calc(100% - 240px);
  background-color: #ffffff;
  height: 60px;
  transition: inline-block .3s,left .3s,width .3s,margin-left .3s,font-size .3s;
}
.site-sidebar .main-left,.site-sidebar .top-logo{
  width: 64px !important;
  transition: inline-block .3s,left .3s,width .3s,margin-left .3s,font-size .3s;
}
.site-sidebar .main-right,.site-sidebar .top-main{
  width: calc(100% - 64px) !important;
  transition: inline-block .3s,left .3s,width .3s,margin-left .3s,font-size .3s;
}

.h-40-border{
  height: 40px;
  border-bottom: #aa100a solid 2px;
}
.navActvie{
  color: #f39800;
}
.nav-main{
  border: 1px #ec9b3e solid;
}
.spic{
  width: calc(25% - 40px);
  padding: 10px;
  height: 240px;
  background-size: 100% 100%;
  margin: 5px 6px;
  line-height: 24px;
  text-align: center;
  border-radius: 5%;
  border: solid 4px aliceblue;
 }
.spic:hover{
  border: solid 4px rgb(236, 155, 62);
}
.spics{
  width: calc(33% - 20px);
  height: 260px;
  background-size: 100% 100%;
  margin: 0 10px;
  text-align:center;
  border-radius: 5%;
  padding-bottom: 20px;
}
.a-block{
  display: block;
}
.a-active{
  color: #FFFFFF;
  background-color: #ec9b3e;
}
.a-block:hover{
  color: #FFFFFF;
  background-color: #ec9b3e;
}
/deep/ .el-divider--horizontal{
  margin: 12px auto !important;
}
.page-heading {
  padding-top: 60px;
  position: relative;
  z-index: 1;
  height:150px;
}

.page-heading .title {
  font-size: 54px;
  font-weight: 400;
  line-height: 1;
  color: #fff;
  letter-spacing:8px
}
.page-heading .breadcrumb{
  font-size: 16px;
  text-transform: none;
  color: #fff;
  background: none;
  border-radius: 0;
  margin-bottom: 0;
  font-weight: 200;letter-spacing:4px
}
.page-heading .breadcrumb > a {
  color: #fff;
}
.page-heading .breadcrumb > a:hover{
  text-decoration: underline;
  color: #a0ce4e;
}
.home-main-contant-style{
  padding: 4% 0;
}

/* banner */
.banner{position:relative;height:800px;overflow:hidden;width:100%;}
.banner .show{width:2500px;position:absolute;left:50%;top:0px;margin-left:-1250px;height:800px;overflow:hidden;}
.banner .show ul{position:relative;height:800px;overflow:hidden;width:2500px;float:left;}
.banner .show ul li{text-align:center;width:2500px;float:left;height:800px;position:absolute;display:none}
.banner .focus{width: 100px; padding:10px;background-color: rgba(255,255,255,0.3);border-radius: 6px;margin: auto;display: flex;justify-content: flex-start}
.banner .focus a{width:14px;height:14px;background-color: #c0c0c0;border-radius: 7px; float:left;margin:0 10px;display:inline-block}
.banner .focus a.on{background-color: #FFFFFF}
.wrapper{width:1000px;margin: auto;}
.banner .hot{
  width: 100%;
  position: absolute;
  bottom: 10px;
}