/*
 * Author: buff <admin@buffge.com>
 * Created on : 2018-8-2, 10:17:15
 * QQ:1515888956
 */
body, html {
  padding: 0;
  margin: 0;
}

.flex {
  display: flex;
}

.flex.wrap {
  flex-wrap: wrap;
}

.flex.colume {
  flex-direction: column;
}

.flex.center {
  justify-content: center;
}

.no-select {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.one-line {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.hidden {
  display: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  box-shadow: 0 0 0 60px #fff inset;
}

/*
 * Author: buff <admin@buffge.com>
 * Created on : 2018-8-8, 14:38:08
 * QQ:1515888956
 */
/*
 * Author: buff <admin@buffge.com>
 * Created on : 2018-8-2, 10:17:15
 * QQ:1515888956
 */
body, html {
  padding: 0;
  margin: 0;
}

.flex {
  display: flex;
}

.flex.wrap {
  flex-wrap: wrap;
}

.flex.colume {
  flex-direction: column;
}

.flex.center {
  justify-content: center;
}

.no-select {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.one-line {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.hidden {
  display: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  box-shadow: 0 0 0 60px #fff inset;
}

body {
  background-color: #f5f5f5;
}

body {
  font-family: "Microsoft YaHei";
}

/*$mainColor:linear-gradient(to right,#39b7ff , #4182ea);*/
.layui-layer-btn .layui-layer-btn0 {
  color: #fff !important;
}

.flex {
  display: flex;
}

.about {
  width: 100%;
  position: relative;
}

.about .list-about-box {
  width: 100%;
  flex-direction: column;
}

.about .list-about-box .about-item {
  height: 700px;
  width: 100%;
  background-position: center;
  justify-content: center;
  flex-wrap: wrap;
}

.about .list-about-box .about-item .banner1 {
  width: 100%;
  height: 100%;
  z-index: -1;
  position: relative;
  object-fit: cover;
}

.about .list-about-box .about-item .items {
  position: absolute;
  margin: 0;
  padding: 0;
  width: 80%;
  align-items: center;
  flex-wrap: wrap;
}

.about .list-about-box .about-item .items .left-box {
  flex-direction: column;
  align-items: center;
  width: 50%;
}

.about .list-about-box .about-item .items .left-box .content-box {
  width: 60%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.about .list-about-box .about-item .items .left-box .content-box .content-title {
  font-size: 3rem;
  color: #ffffff;
}

.about .list-about-box .about-item .items .left-box .content-box .content-con {
  font-size: 1.5rem;
  color: #ffffff;
}

.about .list-about-box .about-item .items .left-box .content-box .btn-code {
  background: #ff27e3;
  color: #fff;
  padding: 5px 25px;
  border-radius: 25px;
  margin-top: 20px;
  font-size: 1.5rem;
}

.about .list-about-box .about-item .items .right-box {
  flex-direction: column;
  align-items: center;
  width: 50%;
}

.about .list-about-box .about-item .items .right-box .right-mobile {
  width: 344px;
  height: 581px;
  background: url(/static/images/iqmoon/about/shouji.png);
  background-size: 344px 581px;
  margin-top: 76px;
}

.about .list-about-box .about-item .items .right-box .right-mobile .swiper-container {
  width: 231px;
  height: 411px;
  margin-top: 67px;
  margin-left: 60px;
}

.about .list-about-box .about-item .items .right-box .right-mobile .swiper-container .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.about .list-about-box .about-item .items .right-box .right-mobile .swiper-container .swiper-slide .phone-ban {
  width: 231px;
  height: 411px;
}

.about .list-about-box .banner-middle {
  width: 0;
  height: 0;
}

.blue1 {
  color: #000000 !important;
}

.blue {
  background: #2789ff !important;
}

.mask {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index: 129;
  left: 0;
  top: 0;
}

.code-content {
  display: none;
  width: 385px;
  height: 360px;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  padding: 25px;
  z-index: 130;
  background: #ffffff;
  border-radius: 10px;
}

.code-content .code-box {
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.code-content .code-box .close {
  width: 16px;
  height: 16px;
  z-index: 88;
  position: absolute;
  right: 10px;
  top: 10px;
}

.code-content .code-box .title {
  color: #000000;
  height: 60px;
  font-size: 26px;
}

.code-content .code-box .rq-code .code-img {
  width: 200px;
  height: 200px;
}

@media only screen and (max-width: 767px) {
  .about {
    flex-direction: column;
    align-items: center;
    height: 100%;
  }
  .about .about-item {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .about .about-item .banner1 {
    object-fit: cover;
    height: 337px !important;
  }
  .about .about-item .items {
    width: 100% !important;
  }
  .about .about-item .items .left-box {
    width: 100% !important;
  }
  .about .about-item .items .left-box .content-box {
    width: 100% !important;
  }
  .about .about-item .items .left-box .content-box .content-title {
    font-size: 1.8rem !important;
  }
  .about .about-item .items .left-box .content-box .content-con {
    font-size: 1rem !important;
  }
  .about .about-item .items .left-box .content-box .btn-code {
    padding: 3px 20px !important;
    font-size: 1rem !important;
  }
  .about .about-item .items .right-box {
    width: 100% !important;
  }
  .about .about-item .item1 {
    margin-top: 56px;
  }
  .about .about-item .banner2 {
    object-fit: cover;
    margin-top: 555px !important;
  }
  .about .about-item .banner3 {
    margin-top: 191px;
  }
  .about .items2 {
    margin-top: -140px !important;
  }
  .about .items2 .item3 {
    width: 100% !important;
  }
  .about .items2 .item3 .content-title {
    font-size: 1.8rem !important;
  }
  .about .items2 .item3 .content-con {
    font-size: 1rem !important;
  }
  .about .items2 .item3 .btn-code {
    padding: 3px 20px !important;
    font-size: 1rem !important;
  }
  .about .items3 .item5 {
    margin-top: 268px !important;
    width: 100% !important;
  }
  .about .items3 .item5 .content-title {
    font-size: 1.8rem !important;
  }
  .about .items3 .item5 .content-con {
    font-size: 1rem !important;
  }
  .about .items3 .item5 .btn-code {
    padding: 3px 20px !important;
    font-size: 1rem !important;
  }
  .about .banner-middle {
    margin-top: 100px !important;
    width: 100% !important;
    height: 200px !important;
  }
  .about .banner-middle .middle-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
}