*{box-sizing:border-box}
@font-face {
    font-family: 'MiSansRegular';
    src: url('../fonts/MiSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }
  @font-face {
    font-family: 'MiSansBold';
    src: url('../fonts/MiSans-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }
body{margin:0;background:#dcdcdc;font-family:Arial,Helvetica,sans-serif;color:#fff;font-family: 'MiSansRegular';}
.width1220{max-width: 1220px;margin: 0 auto;}
.page{margin:0 auto;background:#e9e9e9;overflow:hidden}



/*.top{height:80px;background:#fff;color:#111;display:flex;align-items:center;padding-left:220px;font-size:18px;font-weight:700}*/
.top {
  height: 80px;
  background: #fff;
  color: #111;
}
.top_M{  max-width: 1220px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lang-switch {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-family: 'MiSansBold';
}

.lang-switch a {
  color: black;
  text-decoration: none;
  transition: color 0.2s;
}

.lang-switch a:hover {
  color: #0067f1;
}

.lang-switch .divider {
  margin: 0 6px;
  color: #666;
}

.top_M img{width: 180px;}
.blue{position:relative;background:linear-gradient(120deg,#10bbf4 0%,#0067f1 52%,#083fd8 100%);overflow:hidden}
.inner{position:relative;z-index:1;margin:0 auto}
.project_logo{position: relative;top: 45px;}
.project_logo img{width: 150px;}
.project_logo1{position: static;display: flex;justify-content: center;}
.hero{padding:110px 0 30px;text-align:center; background: url('../images/d4.jpg') no-repeat;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-color: #0B5DEF;
    /*background-size: 100% 100%;*/
    }
.hero h1{width:1100px;margin:0 auto 20px;font-size:30px;line-height:54px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);font-family: 'MiSansBold';}
.gold-line{height:30px;width:100%;background:linear-gradient(to right, #d6b882, #dfc896, #d1b07a);margin:18px 0 34px;color: #0a64ec;line-height: 30px;/*! font-weight: bold; */font-size: 18px;margin-top: 40px;text-align: center;font-family: 'MiSansBold';}
.text{font-size:16px;line-height:1.65;color:rgba(255,255,255,.9);text-align:left;margin:0 0 18px;}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;margin-bottom: 130px;}
.metric{height:138px;padding:24px 18px;text-align:left}
.metric b{display:block;font-size:38px;line-height:1;text-align: center;margin-top: 5px;font-family: 'MiSansBold';font-weight: normal;-webkit-box-reflect: below 2px linear-gradient(transparent, rgba(0, 0, 0, .2));}
.metric span{font-size:14px;line-height:1.35;color:#fff;position: absolute;left: 53%;transform: translate(-50%);width: 100%;margin: 0;top: 38%;text-align: center;}
.font_m{height: 120px;width: 88%;display: inline-block;background-size: 100%;position: relative;background-repeat: no-repeat;}
.section{padding:72px 0 82px;background:#e9e9e9;color:#333}
.copy{font-size:15px;line-height:1.7;color:#343434;text-align:left;margin:35px 0 20px;}
.photo{display: flex;justify-content: center;flex-wrap: wrap;}
.photo img{width: 500px;}
.video,.video1{width:520px;height:292px;margin:54px auto 0;background:#050505;display:grid;place-items:center;background: url("../images/d1.jpg");background-size: 100%;}
.play{width:54px;height:54px;border:2px solid #777;border-radius:50%;position:relative}
.play:after{content:"";position:absolute;left:19px;top:13px;border-left:18px solid #aaa;border-top:12px solid transparent;border-bottom:12px solid transparent}


.slider{padding:76px 0 86px;background:#e9e9e9;color:#333;text-align:center}
.card-wrap{position:relative;width:1220px;margin:34px auto 0}
.card{width:1000px;margin:0 auto;/*background:#fff;padding-bottom:32px;box-shadow:0 2px 8px rgba(0,0,0,.18)*/}
.card img{width: 100%;}
/*.person{height:330px;}
 .card h3{margin:28px 0 18px;font-size:18px;color:#0c60d9;text-transform:uppercase}
.card p{font-size:14px;line-height:1.7;text-align:left;padding:0 42px;margin:0;color:#333} */
.arrow{position:absolute;top:45%;font-size:64px;line-height:1;color:#fff;font-weight:100;cursor: pointer;}
.left{left:0}
.right{right:0}
.dots{margin-top:20px;font-size:24px;color:#bbb;letter-spacing:8px}
.footer{padding:88px 0 160px;background: url("../images/g2.jpg");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-color: #0D7DFD;
    /*background-size: 100% 100%;*/}
.footer .inner{/*! width:980px */}
.footer .video{margin-top:46px}
.project_m{position: relative;display: flex;flex-wrap: wrap;justify-content: center;}
.titleMain{}
.photo p{width: 100%;text-align: center;color: #dcc694;}
.timeMain{}
.timeMain img{width: 100%;}
.title-bar{height:32px;background:#106de8;color:#fff;font-size:15px;/*! font-weight:800; */line-height:32px;text-align:center;text-transform:uppercase;font-family: 'MiSansBold';}
.title-bar.gold{background:#d8bd5f;color:#1653b9}
.arrow img{width: 50px;}
.data-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1100px;margin:30px auto;}
.data-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:1100px;margin:30px auto;}
.data-card{padding:20px 12px;text-align:center;border-radius:10px;
    background: url("../images/icon4.png");
background-size: 100% auto;
    background-repeat: no-repeat;
}
/*background:rgba(255,255,255,0.1);*/
.data-card .num{font-size:32px;margin:8px 0;font-family: 'MiSansBold';}
.data-card .tip{font-size:14px;opacity:0.9;line-height:22px;}
.data_Img{}
.data_Img img{width: 50px;}
.dots {
    margin-top:20px;
    display:flex;
    gap:10px;
    justify-content:center;
    font-size:0;
    letter-spacing:0;
}
.dots .dot {
    width:10px;
    height:10px;
    border-radius:50%;
    background:#fff;
    display:inline-block;
    cursor:pointer;
}
.dots .dot.active {
    background:#666666;
}
.video-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.65);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
  }
  .video-modal-box {
    position: relative;
    width: 720px;
    max-width: 90%;
  }
  .video-modal-content {
    width: 100%;
    height: 420px;
    background: #000;
    display: grid;
    place-items: center;
  }
  .modal-close {
    position: absolute;
    right: -45px;
    top: -47px;
    width: 26px;
    height: 26px;
    /*! background: #fff; */
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #A3A3A3;
    font-size: 46px;
    cursor: pointer;
  }
  .video-modal-content video{width: 100%;height: 420px;}
  .card{width:1000px;margin:0 auto;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.18);overflow:hidden;min-height: 1110px;}
.card-img{width:100%;display:block;}
.card-title-bar{/*! background:#0067f1; */color:#0C58E6;font-family:'MiSansBold';font-size:20px;padding:100px 20px 15px;text-align:left;text-transform:uppercase;text-align: center;}
.card-desc{padding:10px 24px 140px;color:#333;font-size:16px;line-height:1.75;text-align:left;}
/*.card_Main{height: 500px;}*/
@media(max-width:1220px){
    .width1220{padding:0 20px;}
    .hero h1{width:100%;font-size:24px;line-height:42px;}
    .metrics{grid-template-columns:repeat(2,1fr);}
    .data-grid-4{grid-template-columns:repeat(2,1fr);}
    .card-wrap{width:100%;}
    .card{width:100%;max-width:520px;min-height: 900px;}
    .font_m{background: transparent !important;}
}
@media(max-width:1110px){}
@media(max-width:768px){
    .top{padding-left:20px;height:70px;}
    .top_M img{width:140px;}
    .hero{padding:70px 0 50px;}
    .hero h1{font-size:20px;line-height:36px;}
    .metrics{grid-template-columns:1fr;}
    .data-grid-4{grid-template-columns:1fr;}
    .metric b{font-size:30px;}
    .photo img{width:100%;max-width:500px;}
    .video{width:100%;max-width:520px;height: 250px;background-size: cover;}
    .slider{padding:50px 0 60px;}
    .arrow img{width:24px;}
    .timeMain img{width:100%;}
    .font_m{width: 47%;display: flex;justify-content: center;margin: 0 auto;background: transparent !important;}
    .title-bar,.gold-line{font-size: 10px;}
    .metric span{top: 35%;}
    .modal-close{right: 0;}
    .card-title-bar{font-size:16px;padding:10px 16px;}
    .card-desc{padding:16px 18px;font-size:14px;}
}