@charset "UTF-8";
html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu { 
  margin: 0;
  padding: 0; 
}
html{
  font-size: 13.33333vw;
}
body { 
    font-family: "Microsoft YaHei"; 
    font-size: 12px; 
    -webkit-tap-highlight-color: transparent; 
}
@font-face{
  font-family: OPPOSans-B;
  src: url(../font/OPPOSans-B.ttf) format("truetype");
}
@font-face{
  font-family: OPPOSans-R;
  src: url(../font/OPPOSans-R.ttf) format("truetype");
}
@font-face{
  font-family: FZLTXH-GBk;
  src: url(../font/方正兰亭细黑_GBK_1.TTF) format("truetype");
}
@font-face{
  font-family: FZLTZH-GBk;
  src: url(../font/方正兰亭准黑_GBK_0.TTF) format("truetype");
}


html, body{
  /* overflow: hidden;
  -webkit-text-size-adjust: none; */
}

a { text-decoration: none; }

.rel { position: relative; }

.abs { position: absolute; }

.fl { float: left; }

.fr { float: right; }

li { list-style: none; }

.clr { line-height: 0; height: 0; clear: both; font-size: 0; overflow: hidden; }

.clearfix:after { display: block; height: 0; visibility: hidden; clear: both; content: "."; }

.no_select { -moz-user-select: none; -webkit-user-select: none; user-select: none; }

html { -webkit-text-size-adjust: none; }

/* 禁用iPhone中Safari的字号自动调整 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/* 设置HTML5元素为块 */
img { border: none; max-width: 100%; height: auto; vertical-align: top; }

/* 设置图片视频等自适应调整 */
strong, span, label { display: inline-block; vertical-align: middle; }

select, input { -webkit-appearance: none; line-height: 24px; border-radius: 0; /* mobile-select设置*/ }

.min_width{
  min-width: 820px;
}
.textl{
  text-align: left;
}
.textr{
  text-align: right;
}
/* 字体大小 */
.fonts18{ font-size: 18px; }
.fonts36{ font-size: 36px; }

/* 字间距 */
.lets2{ letter-spacing: 2px; }
.lets4{ letter-spacing: 4px; }

/* 紫色线 */
.wire50{
  width: 50px;
  height: 3px;
  background-color: #7c38ff;
}
.logo{
  width: 184px;
}
.djwl_main{
  width: 100%;
  font-size: 14px;
}
.fixed-top{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1030;
  width: 100%;
  height: 100px;
}
.header{
  width: 100%;
  background-color: #fff;
}
.wid64{
  width: 64%;
  margin: 0 auto;
}
.wid74{
  width: 74%;
  margin: 0 auto;
}
.inner{
  width: 100%;
}
.logo a{
  display: inline-block;
  margin-top: 20px;
}
.navbar>li{
  float: left;
  margin: 50px 35px 24px 35px;
  position: relative;
  display: block;
}
.navbar>li>a, .navbar>li>span{
  color: #1f1f1f;
  font-size: 20px;
  letter-spacing: 1px;
  font-weight: 500;
  /* font-family: 'OPPOSans-R'; */
  font-family: ''
}
.navbar>li>a:hover{
  color: #7c38ff;
  font-weight: 700;
  transition: all 0.1s linear;
}
.navbar li.cur:after{
  content: '';
  display: block;
  width: 84px;
  height: 5px;
  border-radius: 2px;
  background: #7c38ff;
  position: absolute;
  left: 0px;
  bottom: -24px
}
.navbar li.cur a{
  color: #7c38ff;
  font-weight: 600;
}

.djwl_content{
  margin-top: 100px;
  background-color: #fff;
}
.serve .banner .slider_main .masthead{
  top: 4.63vw;
  left: 20%;
  width: 18%;
  color: #fff;
  cursor: default;
}
.serve .banner .slider_main .masthead .text_wrap .text_title36{
  letter-spacing: 6px;
  font-weight: 200;
  margin-top: 10px;
}   
.serve .banner .slider_main .masthead .text_wrap .text_title{
  font-size: 25px;
  letter-spacing: 2px;
}
.serve .banner .slider_main .masthead .text_wrap .text_wire{
  opacity: 0;
  transition: .5s linear;
}
.serve .banner .slider_main .masthead .text_wrap:hover .text_wire{
  opacity: 1;
}
.footer{
  width: 100%;
}
.footer-link{
  width: 100%;
  padding: 3.8vw 0;
  color: #fff;
  font-size: 0.9vw;
  background-color: #2c2a29;
}
.footer-link .link-list{
  float: left;
  width: 25%;
}
.footer-link .link-list ul{
  width: 100%;
}
.footer-link .link-list ul li{
  line-height: 36px;
}
.footer-link .link-list p{
  line-height: 26px;
}
.footer-link .recruit h6{
  font-size: 16px;
  font-weight: 600;
  margin: 12px 0 14px;
}
.footer-link .recruit .boss{
  display: inline-block;
  margin-top: 36px;
  font-weight: 600;
  padding: 16px 30px;
  background-color: #fff;
  color: #7c38ff;
}
.footer-link .recruit .boss:hover{
  background-color: #7c38ff;
  color: #fff;
  transition: all .2s;
}
.footer-link .link-list .white-icon{
  display: block;
  width: 50px;
  height: 50px;
}
.footer-link .link-list .white-icon div.icon{
  width: 50px;
  height: 50px;
}
.footer-link .link-list .white-icon div.icon span{
  width: 50px;
  height: 50px;
  display:block;
}
.footer-num{
  width: 100%;
  padding: 20px 0;
  background-color: #1f1f1f;
}
.footer-num a{
  width: 33%;
  display: inline-block;
  text-align: center;
  color: #adadad;
}
.footer-num a:hover{
  color: #7c38ff;
  transition: .2s linear;
}

.line50_3{
  display: block;
  width: 50px;
  height: 3px;
  background-color: #7c38ff;
  margin: 1.04vw 0;
}
.m_auto{
  margin: 20px auto;
}

.jspb:hover .june-box-sf120, div.rel .june-move-sf120:hover, .mr .june-mr-sf120{
  -webkit-transform: scale(1.2,1.2);
  transform: scale(1.2,1.2);
}
.jspb:hover .june-box-sf110,div.rel .june-move-sf110:hover, .mr .june-mr-sf110{
  -webkit-transform:scale(1.1,1.1);
  transform:scale(1.1,1.1);
}
.jspb:hover .june-box-sf105,div.rel .june-move-sf105:hover, .mr .june-mr-sf105{
  -webkit-transform:scale(1.05,1.05);
  transform:scale(1.05,1.05);
}
.rel:hover .june-fadein, .june-fadeout, .jspb:hover .june-box-fadein, .june-box-fadeout, .j-b:hover .b-1-fadein,
.junefade .juneo, .junefade:hover .junei, img.june-fadeout,img.june-box-fadeout{
  opacity: 1;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}
.june-fadein, .rel:hover .june-fadeout, .june-box-fadein, .jspb:hover .june-box-fadeout, .j-b:hover .b-1-fadeout,
.junefade:hover .juneo, .junefade .junei, img.june-fadein, img.june-box-fadein{
  opacity: 0;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
.mr .june-mr-rx40,.rel:hover .june-rx40,div.rel .june-move-rx40:hover,.jspb:hover .june-box-rx40,.j-b:hover .b-1-rx40{
  margin-left:40px;
}

.home .product_service .service .product .product_details ul li.rel:hover .case .case_title a{
  color: #7c38ff;
}
.product .product_details ul li.rel .img .rel .colour:hover a{
  color: #fff;
}
.product .product_details ul li.rel .img .rel .colour:hover{
  background-color: #7c38ff;
}
.brandimg:hover {
  animation: shake 1s both;
}


/*可多次触发动画*/
div .trans0s{transition:0s linear;}
div .trans01s{transition:.1s linear;}
div .trans02s{transition:.2s linear;}
div .trans03s{transition:.3s linear;}
div .trans04s{transition:.4s linear;}
div .trans05s{transition:.5s linear;}
div .trans06s{transition:.6s linear;}
div .trans07s{transition:.7s linear;}
div .trans08s{transition:.8s linear;}
div .trans09s{transition:.9s linear;}
div .trans1s{transition:1s linear;}
div .trans1d1s{transition:1.1s linear;}
div .trans1d2s{transition:1.2s linear;}
div .trans1d3s{transition:1.3s linear;}
div .trans1d4s{transition:1.4s linear;}
div .trans1d5s{transition:1.5s linear;}
div .trans1d6s{transition:1.6s linear;}
div .trans1d7s{transition:1.7s linear;}
div .trans1d8s{transition:1.8s linear;}
div .trans1d9s{transition:1.9s linear;}
div .trans2s{transition:2s linear;}
@media screen and (max-width: 767px) {
  .wid64{
    width: 768px;
    margin: 0 auto;
  }
  .nav{
    float: left;
  }
  .navbar li{
    margin: 50px 15px 24px;
  }
  .navbar li.cur:after{
    width: 66px;
    bottom: -29px;
  }
  .navbar>li>a, .navbar>li>span{
    font-size: 16px;
  }
}
@media screen and (min-width: 768px) {
  .navbar>li{
    margin: 50px 15px 24px;
  }
}
@media screen and (max-width: 1000px) {
  .serve .banner .slider_main .masthead {
      left: 10%;
  }
}
@media screen and (max-width: 1200px) {
  .serve .banner .slider_main .masthead {
      left: 12%;
  }
}
@media screen and (min-width: 1200px) {
  .navbar>li{
    margin: 50px 20px 24px;
  }
}
@media screen and (min-width: 1920px) {
  .navbar>li{
    margin: 50px 35px 24px;
  }
}