.about1 {
  padding: 104px 0 50px 0;
  background: #fff;
  position: relative;
  z-index: 1; }

.about1:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 974px;
  top: 0;
  left: 0;
  z-index: -1;
  background: #F5F6F7; }

.about1 .wrap .message {
  display: flex;
  justify-content: space-between; }

.about1 .wrap .message .l {
  width: 695px; }

.about1 .wrap .message .l h1 {
  font-weight: 800;
  font-size: 32px;
  color: #121212;
  margin: 0 0 60px; }

.about1 .wrap .message .l .text {
  font-weight: 400;
  font-size: 18px;
  color: #111111;
  line-height: 38px; }

.about1 .wrap .message .figure {
  display: flex;
  justify-content: space-between;
  width: 672px;
  flex-wrap: wrap;
  margin: 14px 0 0 0; }

.about1 .wrap .message .figure .item {
  width: 330px;
  height: 180px;
  background: #FFFFFF;
  border-radius: 15px;
  margin: 0 0 12px;
  padding: 10px 0 0 21px;
  position: relative;
  cursor: pointer;
  transition: .3s; }

.about1 .wrap .message .figure .item .position {
  color: #EC4000;
  font-size: 80px;
  position: absolute;
  top: 20px;
  right: 45px;
  opacity: .1; }

.about1 .wrap .message .figure .item span {
  font-weight: 500;
  font-size: 40px;
  color: #EC4000;
  font-family: 'DIN', sans-serif;
  position: relative; }

.about1 .wrap .message .figure .item span:after {
  content: attr(data-text);
  font-weight: 800;
  font-size: 18px;
  color: #EC4000;
  margin: 0 0 0 5px; }

.about1 .wrap .message .figure .item .pick {
  margin: 40px 0 0 0; }

.about1 .wrap .message .figure .item .pick h5 {
  font-weight: bold;
  font-size: 18px;
  color: #333333;
  margin: 0 0 14px; }

.about1 .wrap .message .figure .item .pick p {
  font-weight: 400;
  font-size: 14px;
  color: #666666; }

.about1 .wrap .message .figure .item:hover {
  transform: translateY(-5px); }

.about1 .wrap .center {
  margin: 104px 0 0 0;
  position: relative; }

.about1 .wrap .center p {
  font-weight: bold;
  font-size: 130px;
  color: #FFFFFF;
  opacity: 0.5;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 100%;
  text-align: center; }

.about1 .wrap .center img {
  width: 100%; }

.about1 .wrap .center .play {
  position: absolute;
  right: 60px;
  bottom: 50px;
  width: 80px;
  height: 80px;
  background: rgba(26, 26, 26, 0.8);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer; }

.about1 .wrap .center .play .iconfont {
  color: #FFFFFF;
  font-size: 25px; }

.about1 .wrap .content {
  margin: 155px 0 0 0;
  padding: 0 99px 0 257px;
  display: flex;
  justify-content: space-between;
  position: relative; }

.about1 .wrap .content .eng {
  position: absolute;
  left: 0;
  pointer-events: none; }

.about1 .wrap .content .l .list:not(:last-child) {
  margin: 0 0 62px; }

.about1 .wrap .content .l .list h1 {
  font-weight: bold;
  font-size: 22px;
  color: #111111;
  margin: 0 0 10px; }

.about1 .wrap .content .l .list p {
  font-weight: 400;
  font-size: 16px;
  color: #808080; }

.about1 .wrap .content .rote {
  width: 182px;
  height: 182px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center; }

.about1 .wrap .content .rote .rote {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  animation: rote 10s infinite linear; }

@keyframes rote {
  to {
    transform: rotate(360deg); } }
.about1 .wrap .content .rote .color {
  width: 68px; }

@media screen and (max-width: 1920px) {
  .about1 {
    padding: 5.4166666667vw 0 2.6041666667vw 0;
    background: #fff;
    position: relative;
    z-index: 1; }

  .about1:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 50.7291666667vw;
    top: 0;
    left: 0;
    z-index: -1;
    background: #F5F6F7; }

  .about1 .wrap .message {
    display: flex;
    justify-content: space-between; }

  .about1 .wrap .message .l {
    width: 36.1979166667vw; }

  .about1 .wrap .message .l h1 {
    font-weight: 800;
    font-size: 1.6666666667vw;
    color: #121212;
    margin: 0 0 3.125vw; }

  .about1 .wrap .message .l .text {
    font-weight: 400;
    font-size: 0.9375vw;
    color: #111111;
    line-height: 1.9791666667vw; }

  .about1 .wrap .message .figure {
    display: flex;
    justify-content: space-between;
    width: 35vw;
    flex-wrap: wrap;
    margin: 0.7291666667vw 0 0 0; }

  .about1 .wrap .message .figure .item {
    width: 17.1875vw;
    height: 9.375vw;
    background: #FFFFFF;
    border-radius: 0.78125vw;
    margin: 0 0 0.625vw;
    padding: 0.5208333333vw 0 0 1.09375vw;
    position: relative;
    cursor: pointer;
    transition: .3s; }

  .about1 .wrap .message .figure .item .position {
    color: #EC4000;
    font-size: 4.1666666667vw;
    position: absolute;
    top: 1.0416666667vw;
    right: 2.34375vw;
    opacity: .1; }

  .about1 .wrap .message .figure .item span {
    font-weight: 500;
    font-size: 2.0833333333vw;
    color: #EC4000;
    font-family: 'DIN', sans-serif;
    position: relative; }

  .about1 .wrap .message .figure .item span:after {
    content: attr(data-text);
    font-weight: 800;
    font-size: 0.9375vw;
    color: #EC4000;
    margin: 0 0 0 0.2604166667vw; }

  .about1 .wrap .message .figure .item .pick {
    margin: 2.0833333333vw 0 0 0; }

  .about1 .wrap .message .figure .item .pick h5 {
    font-weight: bold;
    font-size: 0.9375vw;
    color: #333333;
    margin: 0 0 0.7291666667vw; }

  .about1 .wrap .message .figure .item .pick p {
    font-weight: 400;
    font-size: 0.7291666667vw;
    color: #666666; }

  .about1 .wrap .message .figure .item:hover {
    transform: translateY(-0.2604166667vw); }

  .about1 .wrap .center {
    margin: 5.4166666667vw 0 0 0;
    position: relative; }

  .about1 .wrap .center p {
    font-weight: bold;
    font-size: 6.7708333333vw;
    color: #FFFFFF;
    opacity: 0.5;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
    text-align: center; }

  .about1 .wrap .center img {
    width: 100%; }

  .about1 .wrap .center .play {
    position: absolute;
    right: 3.125vw;
    bottom: 2.6041666667vw;
    width: 4.1666666667vw;
    height: 4.1666666667vw;
    background: rgba(26, 26, 26, 0.8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer; }

  .about1 .wrap .center .play .iconfont {
    color: #FFFFFF;
    font-size: 1.3020833333vw; }

  .about1 .wrap .content {
    margin: 8.0729166667vw 0 0 0;
    padding: 0 5.15625vw 0 13.3854166667vw;
    display: flex;
    justify-content: space-between;
    position: relative; }

  .about1 .wrap .content .eng {
    position: absolute;
    left: 0;
    pointer-events: none; }

  .about1 .wrap .content .l .list:not(:last-child) {
    margin: 0 0 3.2291666667vw; }

  .about1 .wrap .content .l .list h1 {
    font-weight: bold;
    font-size: 1.1458333333vw;
    color: #111111;
    margin: 0 0 0.5208333333vw; }

  .about1 .wrap .content .l .list p {
    font-weight: 400;
    font-size: 0.8333333333vw;
    color: #808080; }

  .about1 .wrap .content .rote {
    width: 9.4791666667vw;
    height: 9.4791666667vw;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center; }

  .about1 .wrap .content .rote .rote {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    pointer-events: none;
    animation: rote 10s infinite linear; }

  @keyframes rote {
    to {
      transform: rotate(360deg); } }
  .about1 .wrap .content .rote .color {
    width: 3.5416666667vw; } }

/*# sourceMappingURL=about.css.map */
@media screen and (max-width: 768px) {
  .about1 .wrap .message {
    display: block;
  }
  .about1 .wrap .message .l,.about1 .wrap .message .figure {
    width: 100%;
  }
  .about1 .wrap .message .l h1 {
    font-size: 20px;
    margin-bottom: 20px;
  }
  .about1 .wrap .message .figure {
    margin-top: 30px;
  }
  .about1 .wrap .message .figure .item {
    width: 48%;
    height: unset;
    padding: 10px 20px;
    margin: 0 0 20px;
  }
  .about1 .wrap .message .figure .item span {
    font-size: 20px;
  }
  .about1 .wrap .message .figure .item .pick h5 {
    font-size: 14px;
  }
  .about1 .wrap .message .figure .item .pick p {
    font-size: 10px;
  }
  .about1 .wrap .message .figure .item span:after {
    font-size: 10px;
  }
  .about1 .wrap .message .l .text {
    font-size: 14px;
    line-height: 1.8;
  }
  .about1:after {
    height: 100%;
  }
  .about1 .wrap .message .figure .item .position {
    font-size: 18px;
    top: 13px;
    right: 20px;
  }
  .about1 .wrap .content .l .list h1 {
    font-size: 12px;
  }
  .about1 .wrap .content .l .list p {
    font-size: 10px;
  }
  .about1 .wrap .content {
    padding: 0 0 0 35px;
  }
  .about1 .wrap .content .rote {
    display: none;
  }
  .about1 {
    padding: 40px 0 30px;
  }

}
