/* banner */

.banner {
  width: 100%;
  height: 100%;
  position: relative;
}


.banner .swiper-container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0 auto;

}

.banner .swiper-slide {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}


.banner .swiper-slide {
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.banner .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 1s linear 2s;
  transform: scale(1.05, 1.05);
}

.banner .swiper-slide-active img,
.banner .swiper-slide-duplicate-active img {
  transition: 6s linear;
  transform: scale(1, 1);
}


.banner .swiper-slide .txt {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0rem;
  top: 0rem;
  z-index: 5;

}

.banner .swiper-slide .txt img{
  width: 6.2rem;
  height: auto;
  left: 2.6rem;
  top: 1.8rem;
  position: absolute;
    transform: scale(1, 1);
}

.banner .swiper-button-next {
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  background: url(../images/bannerR.svg) no-repeat center;
  background-size: 100%;
  right: 4%;
  top: 50%;
  z-index: 5;
  cursor: pointer;
}

.banner .swiper-button-prev {
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  background: url(../images/bannerL.svg) no-repeat center;
  background-size: 100%;
  left: 4%;
  top: 50%;
  z-index: 5;
  cursor: pointer;
}

.banner .swiper-pagination {
  width: 100%;
  bottom: 0.4rem;
  text-align: center;
  position: absolute;
  z-index: 5;
}

.banner .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 0.1rem;
  background: #fff;
  width: 0.1rem;
  height: 0.1rem;
  opacity: 1;
  border-radius: 50%;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  display: inline-block;
}

.banner .swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #ff6a17;
}



.swiper-button-prev::after, .swiper-container-rtl .swiper-button-next::after {
  content: 'prev';
  display: none;

}

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
  content: 'next';
  display: none;
}





/* yewu */


.yewubg{
  margin: -1.42rem auto 0 auto;
}

.yewubg ul li{
  float: left;
  position: relative;
  z-index: 5;
  width: 23%;
  height: 2.82rem;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0px 0 8px 8px rgba(0,0,0,.03);
  margin-right: 2.5%;
  
}

.yewubg ul li:nth-child(2n){
  top: -0.37rem;

}

.yewubg ul li:last-child{
  margin-right: 0;
}

.yewubg ul li a{
  display: block;
  padding-top: 0.5rem;
}

.yewubg ul li h5{
  float: left;
  width: 47%;
  margin-left: 13%;
}

.yewubg ul li h5 span{
  display: block;
  font-size: 0.22rem;
  color: #333;
  font-weight: bold;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
margin-bottom: 1.1rem;
}

.yewubg ul li h5 span i{
  display: none;
  font-size: 0.15rem;
  color: #999999;
  font-family: Arial, Helvetica, sans-serif;
  text-transform: capitalize;
  font-weight: normal;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  margin: 0.05rem 0 0.8rem 0;
}

.yewubg ul li h5 em{
  display: block;
  width: 0.44rem;
  height: 0.44rem;
  background: #ff6a17 url(../images/more.svg) no-repeat  center;
    background-size: 0.22rem 0.22rem;
  border-radius: 50%;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.yewubg ul li p{
  float: right;
  width: 0.6rem;
  height: 0.6rem;
  overflow: hidden;
  margin-right: 12%;
}

.yewubg ul li p .ico1{
  display: block;
  width: 0.6rem;
  height: 0.6rem;

}


.yewubg ul li p .ico2{
  display: block;
  width: 0.6rem;
  height: 0.6rem;
}



.yewubg ul li::after{
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
  height: 0rem;
  background: #0d345f url(../images/ywlist.svg) no-repeat bottom  right;
  border-radius: 6px;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.yewubg ul li.on h5 span{
  color: #fff;

}

.yewubg ul li.on h5 span i{
  color: #fff;

}

.yewubg ul li.on h5 em{

  background: #fff url(../images/more1.svg) no-repeat  center;
background-size: 0.22rem 0.22rem;
}


.yewubg ul li.on::after{
  height: 100%;
}

.yewubg ul li.on p .ico1{
  transform: translateY(-100%);
}

.yewubg ul li.on p .ico2{
  transform: translateY(-100%);
}



/* title */

.title h5{
  display: inline-block;
  font-size: 0.4rem;
  color: #333;
  font-weight: bold;
  background: url(../images/title.png) no-repeat left center;
    background-size: 0.85rem 0.42rem;
  padding-left: 1.05rem;
  line-height: 0.42rem;
}

.title h5 i{
  font-size: 0.2rem;
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  margin-left: 0.15rem;
  display:  none;
}

.title span{
  display: block;
  font-size: 0.2rem;
  color: #666666;
  margin-top: 0.2rem;
}

/* product */

.probg{
  width: 100%;
  margin: -1.4rem auto 0 auto;
  background: url(../images/aboutbg.jpg) no-repeat top center;
  background-size: cover;
  padding-top: 2.15rem;
}


.probg .product{
  margin: 0 auto;
  position: relative;
  z-index: 5;

}

.probg .product::after{
  width: 8.22rem;
  height: 1.86rem;
  position: absolute;
  right: 0rem;
  top: 0rem;
  content: "";
  z-index: -1;
  background: url(../images/pro_t.svg) no-repeat  center;
  background-size: 100%;
}

.probg .product .title{
  margin-top: 0.1rem;
}

.probg .product .pro_box{
  margin: 0.38rem auto 0 auto;
}

.probg .product .pro_box .pro_nr{
  position: relative;
}

.probg .product .pro_box .pro_nr .swiper-container{
  padding-bottom: 0.55rem;
}

.probg .product .pro_box .pro_nr .swiper-slide{
  position: relative;
}

.probg .product .pro_box .pro_nr .swiper-slide .pic{
  position: relative;
  width: 100%;
  height: 7.02rem;
  border-radius: 6px;
  

}

.probg .product .pro_box .pro_nr .swiper-slide .pic img{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  border-radius: 6px;
}


.probg .product .pro_box .pro_nr .swiper-slide .txt{
  position: absolute;
  width: 3.6rem;
  height: 4.2rem;
  right: 7%;
  bottom: -0.55rem;
  background: url(../images/prolist.png) no-repeat  center;
  background-size: 100%;
  border-radius: 8px;
}

.probg .product .pro_box .pro_nr .swiper-slide .txt a{
  display: block;
  width: 74%;
  margin: 0 auto;
  padding-top: 0.65rem;
}

.probg .product .pro_box .pro_nr .swiper-slide .txt a h5{
  font-size: 0.28rem;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.probg .product .pro_box .pro_nr .swiper-slide .txt a i{
  font-size: 0.15rem;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  opacity: 0.6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: none;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  margin: 0.1rem 0 0.27rem 0;
}

.probg .product .pro_box .pro_nr .swiper-slide .txt a p{
  font-size: 0.16rem;
  color: #fff;
  line-height: 0.36rem;
max-height: 1.8rem;
  overflow: hidden;

}

.probg .product .pro_box .pro_nr .swiper-slide .txt a em{
display: block;
    background: #fff url(../images/more1.svg) no-repeat center center;
    border-radius: 50%;
    width: 0.44rem;
    height: 0.44rem;
    margin-top: 0.55rem;
    background-size: 0.2rem 0.2rem;
}

.probg .product .pro_box .prolist {
  position: absolute;
  left: 9.5%;
  bottom: 1.1rem;
  z-index: 5;
}

.probg .product .pro_box .prolist ul li{
  float: left;
  width: 1.4rem;
  height: 1.2rem;
  background: #fff;
  border-radius: 7px;
  margin: 0 0.13rem;
  position: relative;
  z-index: 5;
}

.probg .product .pro_box .prolist ul li a{
  display: block;
  text-align: center;
  padding-top: 0.43rem;
}

.probg .product .pro_box .prolist ul li a span{
  font-size: 0.2rem;
  color: #333;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.probg .product .pro_box .prolist ul li a i{
  font-size: 0.14rem;
  color: #999;
  font-family: Arial, Helvetica, sans-serif;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: none;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  margin-top: 0.04rem;
}


.probg .product .pro_box .pro-next{
  position: absolute;
  left: 60%;
  bottom: 1.6rem;
  cursor: pointer;
  background: url(../images/right.svg) no-repeat  center;
  background-size: 100%;
  width: 0.35rem;
  height: 0.2rem;
  z-index: 9;
}

.probg .product .pro_box .pro-prev{
  position: absolute;
  left: 4.5%;
  bottom: 1.6rem;
  cursor: pointer;
  background: url(../images/left.svg) no-repeat  center;
  background-size: 100%;
  width: 0.35rem;
  height: 0.2rem;
  z-index: 9;
}


.probg .product .pro_box .prolist ul li::after{
  width: 100%;
  height: 0rem;
  position: absolute;
  left: 0rem;
  top: 0rem;
  content: "";
  z-index: -1;
  background: #ff6a17;
  border-radius: 7px;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.probg .product .pro_box .prolist ul li.on::after{
  height: 100%;
}

.probg .product .pro_box .prolist ul li.on a span{
  color: #fff;

}

.probg .product .pro_box .prolist ul li.on a i{
  color: #fff;
}



.about{
  margin: 1rem auto 0 auto;
  padding-bottom: 2.5rem;
  
}

.about .aboutbox{
  width: 44%;
  float: right;
}

.about .aboutbox img{
  display: none;
  width: 3.18rem;
  height: 0.37rem;
}

.about .aboutbox em{
  display: none;
  width: 0.46rem;
  height: 0.04rem;
  background: #ff6a17;
  margin: 0.3rem 0;
}

.about .aboutbox h5{

    font-size: 0.4rem;
    color: #333;
    font-weight: bold;
    background: url(../images/title.png) no-repeat left center;
    background-size: 0.85rem 0.42rem;
    padding-left: 1.05rem;
    line-height: 0.42rem;
}

.about .aboutbox p{
  font-size: 0.16rem;
  color: #666;
  line-height: 0.36rem;
  height: 1.8rem;
  overflow: hidden;
  margin-top: 0.2rem;
}

.about .aboutbox .more{
  display: block;
  background: #ff6a17 ;
  width: 1.72rem;
  height: 0.49rem;
  line-height: 0.49rem;
  margin-top: 0.6rem;
    border-radius: 45px;
    position: relative;
 z-index: 5;
    background: url(../images/abmore.svg) no-repeat right center;
    background-size: 100%;
}



.about .aboutbox .more i{
  display: block;
  padding-left: 0.4rem;
  font-size: 0.16rem;
  color: #fff;
}



/* news */

.newsbg{
  width: 100%;
  margin: 0 auto;
  padding-top: 0.55rem;
  padding-bottom: 0.3rem;
}

.newsbg .news_t{
  overflow: hidden;

}

.newsbg .news_t .title{
  float: left;
}

.newsbg .news_t .newslist{
  float: right;
} 

.newsbg .news_t .newslist ul li{
  float: left;
  margin-left: 0.23rem;
  margin-right: 0.02rem;
  width: 1.48rem;
  height: 0.5rem;
  line-height: 0.5rem;
  background: #fff;
  border: 1px solid #ededed;
  border-radius: 45px;
  position: relative;
  z-index: 5;
}

.newsbg .news_t .newslist ul li a{
  display: block;
  text-align: center;
  font-size: 0.18rem;
  color: #333;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.newsbg .news_t .newslist ul li::after{
  width: 0%;
  height:100%;
  position: absolute;
  left: 0%;
  top: 0px;
  content: "";
  z-index: -1;
  background: #ff6a17;
  border-radius: 45px;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  opacity: 0;
}



.newsbg .news_t .newslist ul li.on::after{
  width: 100%;
  border: 1px solid #ff6a17;
  opacity: 1;
}

.newsbg .news_t .newslist ul li.on a{
  color: #fff;
}

.newsbg .newsbox{
  margin: 0.5rem auto 0 auto;
} 

.newsbg .newsbox .swiper-slide{
  position: relative;
}

.newsbg .newsbox .swiper-slide .newsimg{
  float: left;
  position: relative;
  width: 44.5%;
  height: 6.67rem;
  overflow: hidden;
}

.newsbg .newsbox .swiper-slide .newsimg img{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.newsbg .newsbox .swiper-slide:hover .newsimg img{
  transform: scale(1.1);
}


.newsbg .newsbox .swiper-slide .txt{
  float: right;
  width: 52%;
}

.newsbg .newsbox .swiper-slide .txt ul li{
  position: relative;
  z-index: 5;
  width: 100%;
min-height: 1.1rem;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 0.18rem;
}

.newsbg .newsbox .swiper-slide .txt ul li .wen{
  height: 0.34rem;
  line-height: 0.34rem;
  position: relative;
  padding-top: 0.3rem;
}

.newsbg .newsbox .swiper-slide .txt ul li .wen i{
  display: block;
  float: left;
  border-radius: 50%;
  width: 0.32rem;
  height: 0.32rem;
  line-height: 0.32rem;
  border: 1px solid #cccccc;
  text-align: center;
  font-size: 0.18rem;
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  margin-right: 0.15rem;
}

.newsbg .newsbox .swiper-slide .txt ul li .wen a {
  font-size: 0.18rem;
  color: #333;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  float: left;
  width: 80%;
}

.newsbg .newsbox .swiper-slide .txt ul li .da{
  margin-left: 0.49rem;
  margin-top: 0.04rem;
  font-size: 0.16rem;
  color: #666;
  line-height: 0.3rem;
  display: block;
  overflow: hidden;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.newsbg .newsbox .swiper-slide .txt ul li::before{
  width: 0;
  height: 1px;
  position: absolute;
  left: 0rem;
  bottom: 0rem;
  content: "";
  z-index: -1;
  background: #ff6a17;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}


.newsbg .newsbox .swiper-slide .txt ul li:hover::before{
  width: 100%;
}

.newsbg .newsbox .swiper-slide .txt ul li:hover .wen i{
  border: 1px solid #ff6a17;
  background: #ff6a17;
  color: #fff;
}

.newsbg .newsbox .swiper-slide .txt ul li:hover .wen a{
  color: #ff6a17;
  font-weight: bold;
}



/* ys */

.ysbg{
  margin: 0 auto;
  width: 100%;
  height: 10rem;
  background: url(../images/ysbg.jpg) no-repeat top center;
background-size: cover;
}


.ysbg .ys{
  padding-top: 1.1rem;
}

.ysbg .ys .title{
  text-align: center;
}

.ysbg .ys .ysbox{
  padding-top: 0.65rem;

}

.ysbg .ys .ysbox ul {
  float: left;
}

.ysbg .ys .ysbox ul:nth-child(1) {
  float: left;
    margin-left: 4%;
    width: 37%;
}

.ysbg .ys .ysbox ul:nth-child(1) li{


}

.ysbg .ys .ysbox ul:nth-child(1) li h5{
  width: 2.13rem;
  height: 0.62rem;
  line-height: 0.62rem;
  text-align: center;
  font-size: 0.24rem;
  color: #fff;
  font-weight: bold;
  background: #ff6a17;
  border-radius: 45px;
  margin: 0.45rem 0 0.35rem 0;
  
}

.ysbg .ys .ysbox ul:nth-child(1) li p{
  line-height: 0.7rem;
  margin-left: 0.4rem;
  background: url(../images/ysico1.svg) no-repeat left center;
  background-size: 0.26rem 0.25rem;
  padding-left: 0.35rem;
  font-size: 0.16rem;
  color: #333;
}

.ysbg .ys .ysbox ul:nth-child(2) {
  float: left;
  width: 2.4rem;
}

.ysbg .ys .ysbox ul:nth-child(2) li h5{
  width: 1.7rem;
  height: 0.46rem;
  line-height: 0.46rem;
  text-align: center;
  font-size: 0.24rem;
  color: #333;
  font-weight: bold;
  background: #fff;
  border-radius: 45px;
  margin: 0.4rem auto 0.5rem auto;
  
}

.ysbg .ys .ysbox ul:nth-child(2) li p{
  width: 1.73rem;
  height: 0.46rem;
  line-height: 0.46rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 45px;
  margin: 0 auto 0.25rem auto;
  font-size: 0.18rem;
  color: #eff1f3;

}

.ysbg .ys .ysbox ul:nth-child(2) li p i{
  display: block;
  float: left;
  font-size: 0.18rem;
  color: #fff;
  font-weight: bold;
  font-family: Arial, Helvetica, sans-serif;
  text-align: center;
  width: 0.42rem;
  height: 0.42rem;
  margin: 0.02rem 0.15rem 0 0.02rem;
  background: url(../images/numico.png) no-repeat center;
  background-size: 100%;
}



.ysbg .ys .ysbox ul:nth-child(3) {
  float: right;
    margin-right: 4%;
    width: 37%;
}

.ysbg .ys .ysbox ul:nth-child(3) li h5{
  width: 2.13rem;
  height: 0.62rem;
  line-height: 0.62rem;
  text-align: center;
  font-size: 0.24rem;
  color: #fff;
  font-weight: bold;
  background: #0d345f;
  border-radius: 45px;
  margin: 0.45rem 0 0.35rem 0;
  float: right;
  
}

.ysbg .ys .ysbox ul:nth-child(3) li p{
  line-height: 0.7rem;
 height: 0.7rem;
  margin-right: 0.35rem;
  background: url(../images/ysico2.svg) no-repeat right center;
  background-size: 0.26rem 0.25rem;
  padding-right: 0.35rem;
  font-size: 0.16rem;
  color: #333;
  text-align: right;
}



/* lc */


.lcbg{
  margin: 0 auto;
  width: 100%;
  height: 9rem;
  background: url(../images/lcbg.jpg) no-repeat top center;
  background-size: 100%;
  overflow: hidden;
}

.lcbg .lc{
  padding-top: 1.05rem;
}

.lcbg .lc .lc_l{
  float: left;
  width: 50%;
}

.lcbg .lc .lc_l .title h5{
  color: #fff;

}

.lcbg .lc .lc_l .title h5 i{
  color: #bbd1ea;
}


.lcbg .lc .lc_l .lcbox{
  margin-top: 0.4rem;

}

.lcbg .lc .lc_l .lcbox ul li{
  float: left;
  width: 44%;
  height: 2.6rem;
  background: #fff;
  text-align: center;
  padding: 0 3%;
  border-radius: 350px 350px 0 0;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.lcbg .lc .lc_l .lcbox ul li:nth-child(2),
.lcbg .lc .lc_l .lcbox ul li:nth-child(3){
  background: #f1f5f8;
}

.lcbg .lc .lc_l .lcbox ul li:nth-child(4),
.lcbg .lc .lc_l .lcbox ul li:nth-child(3){
  border-radius: 0px 0px 350px 350px;
}

.lcbg .lc .lc_l .lcbox ul li span{
  display: block;
  border: 1px solid #c4cfda;
  border-radius: 50%;
  width: 0.65rem;
  height: 0.65rem;
  margin: 0.45rem auto 0 auto;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.lcbg .lc .lc_l .lcbox ul li span img{
display: block;
  width: 50%;
  height: 50%;
  margin: 0 auto;
  position: relative;
  top: 25%;
}

.lcbg .lc .lc_l .lcbox ul li h5{
  font-size: 0.18rem;
  color: #333;
  font-weight: bold;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  margin: 0.25rem auto 0.08rem auto;
}

.lcbg .lc .lc_l .lcbox ul li p{
  font-size: 0.18rem;
  color: #666666;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.lcbg .lc .lc_l .lcbox ul li.on{
  background: #0d345f;
}

.lcbg .lc .lc_l .lcbox ul li.on span{
  background: #fff;

}

.lcbg .lc .lc_l .lcbox ul li.on h5{
  color: #fff;
}

.lcbg .lc .lc_l .lcbox ul li.on p{
  color: #fff;
}



/* 貸款計算器 */


.lcbg .lc .lc_r{
  float: right;
  width: 42%;
  background: url(../images/messagebg.jpg) no-repeat top center;
  background-size: 100%;
  box-shadow: 0px 0 8px 8px rgba(0,0,0,.02);
}

.calculator{
  width: 100%;
}

.calculator .calculator_t{
  margin: 0 auto;
  font-size: 0.3rem;
  color: #333333;
  font-weight: bold;
  text-align: center;
  padding-top: 0.36rem;

}

.calculator .calculator_box{
  margin: 0.23rem auto 0 auto;
  width: 100%;
} 

.calculator .calculator_box .nr{
  width: 84%;
  margin: 0 auto;
} 

.calculator .calculator_box .input-group{
  width: 100%;
  margin: 0 auto 0.17rem auto;
  overflow: hidden;
}


.calculator .calculator_box .input-group .show{
  overflow: hidden;
}

.calculator .calculator_box .input-group label{
  width: 100%;
  font-size: 0.18rem;
  color: #333;
  height: 0.37rem;
  line-height: 0.27rem;
  display: block;
}

.calculator .calculator_box .input-group label img{
  display: inline-block;
  width: 0.27rem;
  height: 0.27rem;
  margin-right: 0.15rem;
  position: relative;
  top: 0.07rem;
}

.calculator .calculator_box .input-group .input_r{
  width: 100%;
  height: 0.55rem;
  margin: 0.06rem auto 0rem auto;
  border: 1px solid #f0f0f0;
  background: #fff;
  border-radius: 8px;
}


.calculator .calculator_box .input-group .input_r i{
  float: right;
  font-size: 0.18rem;
  color: #333;
  font-weight: bold;
  font-family: Arial, Helvetica, sans-serif;
  width: 0.6rem;
  height: 0.55rem;
  line-height: 0.55rem;
  background: #ecf3fa;
  border-radius: 0 8px 8px 0;
  text-align: center;

}

.calculator .calculator_box .input-group .input_r input{
  font-size: 0.18rem;
  color: #333;
  float: left;
  text-align: left;
  width: 70%;
  height: 0.55rem;
  position: relative;
  text-indent: 0.1rem;
  background: none;
}


.calculator .calculator_box .input-group .input_xt{
  height: 0.05rem;
  position: relative;
  width: 100%;
}

.calculator .calculator_box .input-group .input_xt input {
  border: none;
  border-bottom: none;
  outline: none;
  background: #f2f2f2;
  text-align: right;
  width: 100%;
  position: absolute;
  left: 0;
  padding: 0;
}

.calculator .calculator_box .input-group .term-selector{
  margin: 0.15rem 0;
  height: 0.8rem;

}

.term-selector {
  display: flex;
  justify-content: space-between;
  overflow-x: auto;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}
.term-selector::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}

.term-selector>div{
  padding-bottom: 0 !important;
  height: 0.8rem !important;
}
.term-option {
  padding: 0 0.14rem;
  height: 0.65rem;
  line-height: 0.65rem;
  border: 1px solid #f0f0f0;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s;
  font-size: 0.18rem;
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0 0.16rem;
  display: inline-block !important;
}

.term-option:nth-child(9){
  padding: 0 0.1rem;
}

.term-option:last-child{
  padding: 0 0.1rem;
}


.term-option.active {
  background-color: #ff6b00;
  color: white;
  border-color: #ff6b00;
}


.calculator .calculator_box .input-group .term-range{
  margin-top: 0.1rem;

}

.calculator .calculator_box .input-group .term-range #minTerm{
  float: left;
  font-size: 0.15rem;
  color: #333;
  
}

.calculator .calculator_box .input-group .term-range #maxTerm{
  float: right;
  font-size: 0.15rem;
  color: #333;
}


.input_xt input[type="range"] {
  width: 100%;
  height: 5px;
  -webkit-appearance: none;
  background: #f2f2f2;
  border-radius: 4px;
  outline: none;
}

.input_xt input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20%;
  height: 5px;
  background: #ff6a17;
  border-radius: 5%;
  cursor: pointer;
  transition: background 0.3s;
}

.calculator .calculator_box .repayment-results{
  margin: 0 auto 0.48rem auto;
  height: 1rem;
}


.calculator .calculator_box .repayment-result{
  border: 1px solid #c3cfdb;
  background: #e4eef8;
  border-radius: 8px;
  height: 0.5rem;
  width: 2.35rem;
  height: 1rem;
  float: left;
}

.calculator .calculator_box .repayment-result .box{
  background: url(../images/m4.svg) no-repeat left top;
  background-size: 0.56rem 0.56rem;
  margin: 0.2rem 0 0 0.15rem;
  padding-left: 0.7rem;
}

.calculator .calculator_box .repayment-result:nth-child(2){
  float: right;
  border: 1px solid #edcebd;
  background: #fbeae2;
}

.calculator .calculator_box .repayment-result:nth-child(2) .box{
  background: url(../images/m5.svg) no-repeat left top;
  background-size: 0.56rem 0.56rem;
  margin: 0.2rem 0 0 0.15rem;
  padding-left: 0.7rem;
}

.calculator .calculator_box .repayment-result label{
  font-size: 0.18rem;
  color: #333;
}

.calculator .calculator_box .repayment-result .input_xt{
  height: 0.3rem;
}

.calculator .calculator_box .repayment-result .input_xt input{
  font-size: 0.18rem;
  color: #333;
  font-weight: bold;
  height: 0.3rem;
  background: none;
}


.calculator .calculator_box a{
  display: block;
  margin: 0rem auto 0 auto;
  width: 100%;
  height: 1rem;
  line-height: 1rem;
  background: url(../images/tijiao.jpg) no-repeat center;
  text-align: center;
}


.calculator .calculator_box a i{
  display: block;
  font-size: 0.18rem;
  color: #fff;
  font-weight: bold;
  text-align: center;
}