﻿@charset "UTF-8";

/* 系统 */

.platform h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  margin-top: 91px;
	font-family: OPPOSans-B;
}


.i-ban h3{
  font-family: OPPOSans-B;
}
.platform h4 {

  max-width: 579px;

  /* width: 576px; */


  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  margin: 0 auto;

  text-align: center;

  margin-top: 35px;

}
.platform h4 p{
	font-family: OPPOSans-R;
}
.system {

  max-width: 1300px;

  margin: 0 auto;

  display: flex;

  justify-content: space-between;

  margin-top: 93px;

  margin-bottom: 104px;

}

.syslf {

  max-width: 350px;

  /* width: 350px; */

}

.syscen {

  max-width: 535px;

  /* width: 535px; */

  display: flex;

  align-items: center;

}

.sysrg {

  max-width: 350px;

  /* width: 350px; */

}

.lfitem {

  height: 80px;

  font-family: PingFang-SC-Medium;

  font-size: 24px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  display: flex;

  justify-content: flex-end;
  transition: all .3s;

}
.lfitem:hover{
    transform: translateX(8px);
}

.lfitem:nth-child(2) {

  margin-right: 55px;

  margin-top: 104px;

}

.lfitem:nth-child(3) {

  margin-top: 103px;

}

.lfitem span {

  line-height: 80px;
  font-family: OPPOSans-R;
}

.lfico {

  width: 80px;

  height: 80px;

  border-radius: 100%;

  background-color: #445565;

  margin-left: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.syscen-box {

  max-width: 435px;

  /* width: 435px; */

  height: 435px;

  border-radius: 100%;

  margin: 0 auto;

  position: relative;

}

.syscen-box img {

  z-index: 5;

  position: relative;

}

.ciro {

  z-index: 1;

  -webkit-animation-delay: 2s;

  background-color: #f3f4f5;

  opacity: 0.2;

  position: absolute;

  border-radius: 50%;

  -webkit-animation: opac 3s infinite;
  display: none;

}

.ciro1 {

  z-index: 1;

  -webkit-animation-delay: 2.5s;

  background-color: #ffffff;

  opacity: 0.1;

  position: absolute;

  border-radius: 50%;

  -webkit-animation: opac1 4s infinite;
  display: none;
}



@-webkit-keyframes opac {

  from {

    opacity: 1;

    width: 100%;

    height: 100%;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

  }

  to {

    opacity: 0;

    width: 130%;

    height: 130%;

    top: 0;

    left: 0;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

  }

}

@-webkit-keyframes opac1 {

  from {

    opacity: 1;

    width: 100%;

    height: 100%;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

  }

  to {

    opacity: 0;

    width: 115%;

    height: 115%;

    top: 0;

    left: 0;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

  }

}

.rgitem {

  height: 80px;

  font-family: PingFang-SC-Medium;

  font-size: 24px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  display: flex;
  transition: all .3s;

}

.rgitem:hover{
    transform: translateX(-8px);
}

.rgitem:nth-child(2) {

  margin-left: 55px;

  margin-top: 104px;

}

.rgitem:nth-child(3) {

  margin-top: 103px;

}

.rgitem span {

  line-height: 80px;

}

.rgico {

  width: 80px;

  height: 80px;

  border-radius: 100%;

  background-color: #445565;

  margin-right: 44px;

  display: flex;

  align-items: center;

  justify-content: center;

}

/*.sysico:hover {*/

/*  background-color: #dc3545;*/

/*}*/

/* 守护 */

.guard {

  height: 100vh;

  background-image: url(../images/shouhu.jpg);

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center;

  position: relative;
  image-rendering: pixelated;

}

.guard h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  top: 234px;

  right: 130px;

  position: absolute;

  font-family: OPPOSans-B;
}

.guardinfo {

  top: 329px;

  right: 130px;

  max-width: 702px;

  /* width: 702px; */

  position: absolute;

}

.guard h4 {

  /* font-family: PingFang-SC-Medium; */

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

}
.guard h4 p{
  font-family: OPPOSans-R;
}
.guardlx {

  position: absolute;

  top: 486px;

  right: 138px;

}

/* 定位 */

.locatiom {

  background-image: url(../images/locbanner.jpg);

  background-position: top center;

  background-size: cover;

  height: 100vh;

  position: relative;
  image-rendering: pixelated;

}

.locatiom h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  width: 100%;

  position: absolute;

  top: 103px;

  left: 0;

  transform: translateX(-50%);
	font-family: OPPOSans-B;
}

.locatiom h4 {

  /* font-family: PingFang-SC-Medium; */

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  text-align: center;

  position: absolute;

  top: 189px;

  left: 0;

  transform: translateX(-50%);

  width: 100%;

}
.locatiom h4 p{
  font-family: OPPOSans-R;
}

/* 环境 */

.huanjing {

  height: 100vh;

  background-image: url(../images/huanjingbanner.jpg);

  background-position: top center;

  background-size: cover;

  position: relative;

image-rendering: pixelated;
}

.huanjing h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  line-height: 36px;

  font-weight: 400;

  letter-spacing: 0px;

  color: #111111;

  position: absolute;

  top: 237px;

  left: 209px;
	font-family: OPPOSans-B;
}

.huanjing h4 {

  max-width: 720px;

  /* width: 720px; */

  font-family: PingFang-SC-Medium;

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  position: absolute;

  top: 342px;

  left: 209px;

}
.huanjing h4 p{
  font-family: OPPOSans-R;
}

.hjbox {

  position: absolute;

  top: 512px;

  left: 208px;

  display: flex;

}

.hjitem {

  margin-right: 71px;

}

.hjitem p {

  font-family: PingFang-SC-Medium;

  font-size: 24px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #333333;

  margin-top: 30px;
  font-family: OPPOSans-R;
}

.hjitem:last-child {

  margin-right: 0;

}

.hjitem .imgbox {

  height: 65px;

  display: flex;

  align-items: center;

  justify-content: center;

}

/* 预警 */

.yujing h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  margin-top: 98px;
	font-family: OPPOSans-B;
}

.yujing h4 {

  /* font-family: PingFang-SC-Medium; */

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  text-align: center;

  margin-top: 54px;

}
.yujing h4 p{
  font-family: OPPOSans-R;
}
.yujing-picbox {

  text-align: center;

  margin-top: 75px;

}

.yujing-picbox img{
    image-rendering: pixelated;
}

.yujingfourbox {

  max-width: 1200px;

  margin: 0 auto;

  display: flex;

  justify-content: space-between;

  margin-top: 66px;

}

.yujingbox {

  height: 51px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.yujingitem p {

  font-family: OPPOSans-R;

  font-size: 24px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #333333;

  margin-top: 36px;

  margin-bottom: 94px;

}

/* 安防 */

.anfang {

  height: 953px;

  background-color: #f7f8f6;

  position: relative;

}
.anfang img{
    image-rendering: pixelated;
}

.anfang h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  padding-top: 79px;

  font-family: OPPOSans-B;

}

.anfang h4 {

  /* font-family: PingFang-SC-Medium; */

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  text-align: center;

  margin-top: 42px;

}
.anfang h4 p{
  font-family: OPPOSans-R;
}
.anfang .anfangbox p {

  /* font-family: PingFang-SC-Medium; */

  font-family: OPPOSans-R;

  font-size: 24px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #333333;

  margin-top: 28px;

}

.anfangpicbox {

  display: flex;

  justify-content: center;

}

.anfang1 {

  position: absolute;

  /* top: 463px; */

  top: 48.22916666666667%;

  /* left: 316px; */

  left: 16.45833333333333%;

}

.anfang2 {

  position: absolute;

  /* top: 329px;

  left: 837px; */

  top: 34.27083333333333%;

  left: 43.59375%;

}

.anfang3 {

  position: absolute;

  /* top: 755px;

  left: 653px; */

  top: 78.64583333333333%;

  left: 34.01041666666667%;

}

.anfang4 {

  position: absolute;

  /* top: 665px;

  left: 1075px; */

  top: 69.27083333333333%;

  left: 55.98958333333333%;

}

.anfang5 {

  position: absolute;

  /* top: 463px;

  left: 1370px; */

  top: 48.125%;

  left: 71.35416666666667%;

}

/* 平台 */

.pingtai h3 {

  /* font-family: PingFang-SC-Bold; */

  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  margin-top: 92px;
	font-family: OPPOSans-B;
}

.pingtai h4 {

  /* font-family: PingFang-SC-Medium; */

  font-size: 18px;

  line-height: 36px;

  letter-spacing: 0px;

  color: #666666;

  text-align: center;

  margin-top: 50px;

}
.pingtai h4 p{
  font-family: OPPOSans-R;
}


.yanglaofuwupingtai {

  max-width: 1300px;

  /* width: 1300px; */

  margin: 0 auto;

  margin-top: 79px;

  display: flex;

  justify-content: space-between;

}



.ylfwptcen {

  max-width: 35.07692307692308%;

  /* width: 35.07692307692308%; */

}

.ylfwptlfitem {

  display: flex;
  transition: all .3s;

}
.ylfwptlfitem:hover{
    transform: translateX(8px);
}

.ylfwptlfitem:nth-child(1) {

  margin-top: 49px;

}

.ylfwptlfitem:nth-child(2) {

  margin-top: 125px;

}

.ylfwptlfitem:nth-child(3) {

  margin-top: 124px;

}

.ylfwptlfitem p {

  /* font-family: PingFang-SC-Medium; */
	font-family: OPPOSans-R;
  font-size: 24px;

  line-height: 80px;

  letter-spacing: 0px;

  color: #666666;

}

.ylfwptlfpicbox {

  width: 80px;

  height: 80px;

  background-color: #445565;

  border-radius: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-left: 33px;

}



.ylfwptrgitem {

  display: flex;
  transition: all .3s;

}
.ylfwptrgitem:hover{
    transform: translateX(-8px);
}

.ylfwptrgitem:nth-child(1) {

  margin-top: 49px;

}

.ylfwptrgitem:nth-child(2) {

  margin-top: 125px;

}

.ylfwptrgitem:nth-child(3) {

  margin-top: 124px;

}

.ylfwptrgitem p {

  font-family: PingFang-SC-Medium;

  font-size: 24px;

  line-height: 80px;

  letter-spacing: 0px;

  color: #666666;

}

.ylfwptrgpicbox {

  width: 80px;

  height: 80px;

  background-color: #445565;

  border-radius: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-right: 33px;

}



/*.ylfwptlfpicbox:hover {*/

/*  background-color: #dc3545;*/

/*}*/

/*.ylfwptrgpicbox:hover {*/

/*  background-color: #dc3545;*/

/*}*/

/* 联系 */



.lxwm {

  height: 960px;

  background-color: #f9f9f9;

}

.lxwm h3 {

  /* font-family: PingFang-SC-Bold; */
	font-family: OPPOSans-B;
  font-size: 50px;

  font-weight: 400;

  line-height: 36px;

  letter-spacing: 0px;

  color: #111111;

  text-align: center;

  padding-top: 96px;

}

.lxwmbox {

  max-width: 1153px;

  /* width: 1153px; */

  margin: 0 auto;

  margin-top: 93px;

}

.message-input {

  display: flex;

  color: #acacac;

  font-size: 18px;

  justify-content: space-between;

  margin-bottom: 49px;

}

.inputbox {

  display: flex;

  width: 48%;

}

.message-input em {

  font-size: 16px;

  line-height: 70px;

  color: #ff0000;

  margin-right: 26px;

}

.lx-input {

  width: 100%;

  height: 70px;

  background-color: #ffffff;

  border-radius: 4px;

  border: solid 1px #e3e3e3;

  display: flex;

}

.lx-inputimgbox {

  width: 30px;

  height: 70px;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-left: 20px;

}

.message-input input {

  outline: none;

  border: none;

  width: 100%;

  color: #acacac;

  font-size: 18px;

  margin-left: 20px;
  font-family: OPPOSans-R;
}

.message-input input::-webkit-input-placeholder {

  color: #acacac;

  font-size: 18px;

}

.ssq {

  display: flex;

  margin-bottom: 48px;

}

.ssq em {

  font-size: 16px;

  line-height: 70px;

  color: #ff0000;

  margin-right: 26px;

}

.sheng {

  width: 31.56981786643539%;

  height: 70px;

  background-color: #ffffff;

  border-radius: 4px;

  border: solid 1px #e3e3e3;

  margin-right: 12px;

  cursor: pointer;

}

.shi {

  width: 31.56981786643539%;

  height: 70px;

  background-color: #ffffff;

  border-radius: 4px;

  border: solid 1px #e3e3e3;

  margin-right: 12px;

  cursor: pointer;

}

.qu {

  width: 31.56981786643539%;

  height: 70px;

  background-color: #ffffff;

  border-radius: 4px;

  border: solid 1px #e3e3e3;

  cursor: pointer;

}

.not-arrow {

  cursor: pointer;

  width: 261px;

  font-family: PingFang-SC-Medium;

  font-size: 18px;

  line-height: 70px;

  letter-spacing: 0px;

  color: #333333;

  outline: none;

  margin-left: 49px;

  -webkit-appearance: none;

  -moz-appearance: none;

  -ms-appearance: none;

  /*去掉下拉箭头*/

  /*在选择框的最右侧中间显示小箭头图片（*如果select加边框箭头靠右的话，可以将小箭头图片右侧做一点空白宽度占位）*/

  background: url("../images/lxwm3.png") no-repeat scroll right center

    transparent;

}

.liuyan {

  display: flex;

}

.liuyan em {

  font-size: 16px;

  color: #ff0000;

  margin-right: 26px;

}

.liuyanbox {

  width: 100%;

  height: 163px;

  background-color: #ffffff;

  border-radius: 4px;

  border: solid 1px #e3e3e3;

}

.liuyanbox textarea {

  width: 100%;

  resize: none;

  outline: none;

  border: none;

  padding: 28px 20px;

  /* font-family: PingFang-SC-Medium; */
	font-family: OPPOSans-R;
  font-size: 18px;

  line-height: 30px;

  letter-spacing: 0px;

  color: #acacac;

}



.liuyanbox textarea::-webkit-input-placeholder {

  color: #acacac;

  font-size: 18px;

}

.text-right {

  font-family: PingFang-SC-Medium;

  font-size: 14px;

  line-height: 30px;

  letter-spacing: 0px;

  color: #acacac;

  margin-top: 12px;

}

.submit {

  width: 300px;

  height: 80px;

  background-color: #f76d00;

  border-radius: 8px;

  font-family: PingFang-SC-Medium;

  font-size: 24px;

  letter-spacing: 0px;

  color: #ffffff;

  text-align: center;

  line-height: 80px;

  margin: 0 auto;

  margin-top: 76px;

}
.submit button{
  font-family: OPPOSans-M;
}
button {

  outline: none !important;

  border: none !important;

  color: #ffffff !important;

  background-color: transparent !important;

}



@media (max-width: 1920px) {

}

@media (max-width: 1599px) {

  .anfang3 {

    top: 70%;

  }

  .anfang4 {

    top: 60%;

    left: 50%;

  }

}

@media (max-width: 1477px) {

}



@media (max-width: 1365px) {

  .system {

    width: 96%;

  }

  .huanjing h4,.huanjing h3{
    left: 69px;
  }

  .syscen-box {

    width: unset;

    height: unset;

  }

  .yanglaofuwupingtai {

    width: 82%;

  }

  .hjbox{
    left: 73px;
  }

  .ylfwptlfitem:nth-child(3),.ylfwptlfitem:nth-child(2),.ylfwptrgitem:nth-child(2),.ylfwptrgitem:nth-child(3){
    margin-top: 93px;
  }

  .guardinfo,.guard h3{
    right: 69px;
  }


  .yujing h4,.anfang h4,.pingtai h4{
    margin: 0 auto;
    margin-top: 54px;
    width: 94%;
  }

}



@media (max-width: 1199px) {

  .i-ban {

    height: 80vh;

  }

  .locatiom {

    height: 70vh;

    background-size: unset;

    background-repeat: no-repeat;

  }

  .huanjing {

    height: 80vh;

  }

  .guard {

    height: 60vh;

  }

  .anfang {

    height: 60vh;

  }

  .huanjing h3 {

    line-height: 50px;

  }

  .anfang3 {

    top: 60%;

  }

  .anfang4 {

    top: 55%;

    left: 50%;

  }

  .ylfwptrgitem:nth-child(2) {

    margin-top: 40px;

  }

  .ylfwptrgitem:nth-child(3) {

    margin-top: 40px;

  }

  .ylfwptlfitem:nth-child(2) {

    margin-top: 40px;

  }

  .ylfwptlfitem:nth-child(3) {

    margin-top: 40px;

  }

  .lfico {

    margin-left: 0;

  }

  .lfitem:nth-child(2) {

    margin-right: 35px;

  }

  .rgitem:nth-child(2) {

    margin-left: 35px;

  }

  .rgico {

    margin-right: 0;

  }

  .lxwmbox {

    width: 94%;

  }

  .not-arrow {

    width: 94%;

    margin-left: 0;

  }

}



@media (max-width: 990px) {

  .platform h3 {

    line-height: 50px;

  }

  .system {

    display: unset;

    max-width: unset;

  }

  .lfitem span {

    display: none;

  }

  .syslf {

    max-width: unset;

    width: 96%;

    margin: 0 auto;

    display: flex;

    justify-content: space-around;

  }

  .lfitem:nth-child(1) {

    margin-top: 50px;

    margin-right: 0;

  }

  .lfitem:nth-child(2) {

    margin-top: 0;

    margin-right: 0;

  }

  .lfitem:nth-child(3) {

    margin-top: 50px;

    margin-right: 0;

  }

  .syscen {

    max-width: unset;

    /* margin-top: 60px;

    margin-bottom: 60px; */

  }

  .sysrg {

    display: flex;

    max-width: unset;

    width: 96%;

    margin: 0 auto;

    justify-content: space-around;

    margin-bottom: 91px;

  }

  .rgitem span {

    display: none;

  }

  .rgitem:nth-child(2) {

    margin-top: 50px;

    margin-left: 0;

  }

  .rgitem:nth-child(3) {

    margin-top: 0;

    margin-left: 0;

  }

  .guard {

    height: 80vh;

  }

  .guard h3 {

    right: unset;

  }

  .guardlx {

    right: 50%;

    transform: translateX(50%);

  }

  .locatiom h3 {

    line-height: 50px;

    top: 80px;

  }

  .huanjing {

    height: 100vh;

  }

  .yujing h3 {

    line-height: 50px;

  }

  .anfang h3 {

    padding-top: 50px;

    line-height: 50px;

  }

  .anfang {

    height: 100vh;

  }



  .locatiom {

    height: 94vh;

  }

  .pingtai h3 {

    line-height: 50px;

  }

  .yujingfourbox {

    width: 96%;

    margin: 0 auto;

    margin-top: 66px;

    flex-wrap: wrap;

  }

  .yujingitem {

    width: 45%;

  }

  .yujingitem p {

    text-align: center;

  }

  .lxwmbox {

    width: 96%;

  }

  .not-arrow {

    width: 96%;

    margin: 0 auto;

    margin-left: 0;

  }

  .anfang1 {

    top: 45%;

  }

  .anfang3 {

    top: 50%;

    left: 30%;

  }

  .anfang4 {

    top: 48%;

  }

}



@media (max-width: 767px) {

}

