

.bn {
  height: 620px;
  background-color:#e62129;
  background-repeat: no-repeat;
  background-position: center bottom;
  position:relative;
}

.bn .item{
	position:absolute;
	left:0;
	right:0;
	top:30%;
	left: -15%;
	max-width:350px;
	margin:0 auto;
	color:#fff;
	font-size:40px;
	font-weight:bold
	}

.bn .item .p2{
	margin-top:5px;
}


.about .top {
  display: flex;
  margin-top: 230px;
  margin-bottom: 120px;
  align-items: flex-start;
  justify-content: space-between;
}

.about .top .title {
  flex: 1;
  font-size: 45px;
  line-height: 60px;
  font-weight: bold;
}

.about .top .txt {
  max-width: 940px;
  font-size: 17px;
  line-height: 25px;
  color: #787878;
  width:60%
}

.about .mid {
  border-top: 1px solid #eff3f6;
  border-bottom: 1px solid #eff3f6;
}

.about .mid ul {
  display: flex;
  height: 200px;
  align-items: center;
  justify-content: center;
  max-width:1165px;
  margin:0 auto;
}

.about .mid ul li {
  width:20%;
  text-align: center;
  font-weight: bold;
}


.about .mid ul li p:first-child {
  font-size: 15px;
  color: var(--red);
}

.about .mid ul li p:first-child span {
  font-size: 45px;
}

.about .mid ul li p:last-child {
  font-size: 16px;
  line-height: 16px;
}

.about .btm {
  display: flex;
  padding-top: 70px;
  align-items: center;
  justify-content: space-between;
}

.about .btm .left {
  display: flex;
  max-width: 50%;
  width: 100%;
}

.about .btm .left > div {
  margin: auto;
  text-align: center;
}

.about .btm .left .company {
  font-size: 25px;
  line-height: 50px;
  font-weight: bold;
}

.about .btm .left .adr {
  font-size: 16px;
  color: #a3a3a3;
}

.about .btm .left .tel {
  margin-top: 30px;
  font-size: 35px;
  line-height: 40px;
  color: var(--red);
  font-weight:bold
}
.about .btm .left .tel a{color: var(--red);}

.about .btm .right {
  max-width: 50%;
  width: 100%;
}

.about .btm .form {
  width: 100%;
  padding: 43px 95px 57px;
  box-sizing: content-box;
  border-radius: 30px;
  box-sizing: border-box;
  background-color: #f5f5f5;
}

.about .btm .form .title {
  font-size: 20px;
  font-weight:bold;
  line-height: 28px;
  margin-bottom: 25px;
}

.about .btm input {
  width: 100%;
  font-weight:bold;
  line-height: 40px;
  margin-bottom: 23px;
  font-size: 16px;
  border: 0;
  background-color: transparent;
  border-bottom: 2px solid black;
  font-family: "PingFang SC", "Source Han Sans SC", "HanHei SC",
    "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", 黑体,
    Arial, sans-serif;
  color: #1f0001;
}

.about .btm input::placeholder {
  font-weight: bold;
  font-size: 16px;
  color: black;
}

.about .btm .btn {
  width: 130px;
  height: 43px;
  line-height: 43px;
  margin-top: 14px;
  font-size: 16px;
  color: white;
  border-radius: 30px;
  transition: all .5s;
  cursor: pointer;
  text-align: center;
  background-color: var(--red);
}


@media (max-width: 1024px) {
.about .top{ display:block; margin:20% 0 10%;}
.about .top .title{ font-size:40px; margin-bottom:5%;}
.about .top .txt{ width:100%;}
}

@media (max-width: 768px) {
.about .mid ul li p:first-child span{ font-size:40px;}
.about .btm{ display:block}
.about .btm .left,.about .btm .right{ max-width:inherit}
.about .btm .right{ margin-top:10%;}
.about .btm{ padding-top:15%;}
.bn{ height:auto; padding:25%; background-size:cover}
.bn .item{font-size:30px;}
}

@media (max-width: 640px) {
.about .top .title{ font-size:30px; line-height:40px;}
.about .mid ul li{ width:50%; float:left; padding:10% 0;}
.about .mid ul{ height:auto; display:block; overflow:hidden;}
.about .btm .form{ padding:10% 15%;}
.about .btm .form .title{ font-size:18px;}
.about .btm .left .company{ font-size:22px;}
}

@media (max-width: 480px) {
.about .top .txt{ font-size:16px;}
.about .mid ul li{ width:100%;}
.bn { padding:45% 0; background-size:190%}
.bn .item{ padding:0 15px; left:0;}
}






