/* ========================================================================

  Common style

========================================================================== */





/*  Fonts

-------------------------- */

@font-face {

  font-family: 'PingFang SC-Regular';

  /* src: url("PingFangSC-Regular.woff"); */
  src: url("PINGFANG REGULAR.TTF");

}



@font-face {

  font-family: 'PingFang SC-Medium';

  /* src: url("PingFangSC-Medium.woff"); */
  src: url("PingFang Medium.ttf");

}





/* 

 * iconfont

 */

 @font-face {
  font-family: "iconfont";
  src: 
       url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAXsAAsAAAAAC4AAAAWeAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDagqJFIgAATYCJAMkCxQABCAFhGcHdBsWCiMRdoNRekj2zwTTbRjXWDkPSB5MaO7Pt6Iy+JP0TD78b+qfC8SgIprUTGgyiygTEZimMDFNu6eqX+IEAEaM2/UhbM25sZrwEaoka0cebTFPhfzlU9jVmuqQv7hY2pnYTLzZe8D7AGARHYGqTWsrVIQqEBlR4Vl3aqSrhngtE68doCdeAwKARYkmVEfXAI+Qhc6Vi5GAAbUSIB9LFs4TnNBrUTA9dgJ9QDv2VOZPsh8agJqkXgKwL35/8iPK0gMUNDToKiO+Tg8e+wbfZtCiKgL0RwhbQIDdKQAaADSAgiOLk/X92ZWgU7Ug1tm2LIOesyN6UD/4hvlm8Jv132aoKr5BLttZFhFMheRkoAH1D4+GDlqAaEF6EGxLe/TAN/D5nBGEwYBRCEMDRkNDnTHQMI4NQkMfW480dLjzAhiutsWwdwQgBsg8gNIJtg6dvuPyvZqoi47WhjO60GAi6Skhh8cHJevio1fk8nkWc75DsrzLiDLxNhH5t4hsfidiEcua0qpJ0GRsOVt+SHyY2zAl5fkC2VvN9Xquiw8r+es3kPUryARPwsgG8TobIl89KZ26xoUqNxzydTAnbihTRCMFEo/eE+U5fObG3bHCsbPmw6ejvUfunToX4zt6l1MOEMLKDzxyC6Gld4lOG3j/wzdBiW/hKWwQf5i1UeINjlNuAJZjXLDy7pvvEvpkYJc/9a3X3gJZJN364N0Pn5nOuvxMXoCwJdV5XlShJysogkKVS9hZwoIFB45wG46IUR5v8LrrcozPc/hqQIoVfEelKSXaKxxThCZLIz/RULp7yixLLeGv1JSrN7DK//H+/R+toEss/7h9v6uELx4dKx4veZovGS3OvEv4p0vGi8cUvlYaLxkrBrqH5rnM+X15Pd25ffnTvfk9uUCkpvN7o1BPHjqn+/K784yr9mLLo4kdVR2JD7wWmV6VfvRYemVHZcY8UjOSSekXnDvuA0R/ANQtLX8X7DIjKEHltpgIf4SL67sz9s4+zpVHLLeUO7ErY1e4utkrD4Y/WFMTIP6wQITS1t3cSw9W1zwQ5icPVEu/BR1rQypCll6Nu0AS474oN9q7e62m8jvkLTNvV3YG/fHzl9EvRz8zMjWwfS72LsruSKpI6jR+wTwcdYf+M7jujD/+xF8R+5Ibt+yoENK/1I4oFzK+ir/+xPcR5woblxxpp4e/6VybabZxzx7jbJPtNY4RZlhc32Z6raXPE3/nnRX8UFQ/8fuJhOPDIz3d/sT0BH9U6u6a3J8ok5gwNHw8MT3RP6Sg+JgEnLYef/55/7nz5875n3jOZ7Jmz5LlWUar8WWOUliWg7T1ZWNOW0i21aSYJMSh2bNM1jrf2kahzuOpExp/5Shitnaj8Gutii0iaEfaTL0D9XpQKz3Dtv9LHjvkiXHQrViAuospptep6BQZQovw/Wt20gDUvYb0f9kNZw+nRdhDG3473G+o8Znw1VDMzaPrZiXg+84wmv93lOcEiSphz0x/jxpgYD5ROQSJMe+bKgtQ1TI/w23APGg6KQAsWwX8LYoRPlnXiByt409oROZAQYdEoKFHhomx5YEGHMpACz0agUW+zrM5RFoKGoQxADDaJgBBmBtAIQT3A40wz5oY27ugQYxvQYsw/wELMwm+HAdj67ivjJVgC/UfbEOj4gGJ232hnvqKmzp+yMGiAWmUVPueOCIvcUSYdSaiQDEN8FDuhn1P4JkcNhIZEZ/HsWq7ctTQsLkyVoIt1P/Q3zY0qpWl/PleqKe+4pGmX5qDxIntQxolI0xPfRw145FMDrPOROxUoNTRNMBjXhp71k3g23dy2EhkZnT6PBZXUmP1aH9jeKA3ALCglxvIatpd3T2d3j6/k5mWgq02cso3SS/raHK2GiVyrHbc38ifA/JsG9xXbXtsegp4HBbZbAAAAA==') format('woff2'),
       url('iconfont.woff') format('woff'),
       url('iconfont.ttf') format('truetype');
}



.iconfont {

  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  transition: all .3s ease-in-out;

}









/*  Agent

-------------------------- */

body {

  font-family: 'PingFang SC-Regular';

  font-size: 16px;

  margin: 0;

  color: #333;

  overflow-x: hidden;

}



img, ul {

  vertical-align: top;

}



ul {

  padding-left: 0;

  margin-top: 0;

  margin-bottom: 0;

  list-style: none;

}



dl {

  margin-top: 0;

  margin-bottom: 0;

}

dd {

  margin-left: 0;

}



img {

  max-width: 100%;

  border: none;

  -webkit-tap-highlight-color: transparent;  

}



a {

  text-decoration: none;

  color: #333;

  transition: all .3s ease-in-out;

  -webkit-tap-highlight-color: transparent;  

}

@media (any-hover: hover) {

  a:hover{

    color: #2FA5FD;

  }

}





/* 

 * form

 */

i {

  font-style: normal;

}

input[type="text"],

textarea {

  font-family: 'PingFang SC-Regular';

  color: #919191;

  font-size: 16px;

  width: 100%;

  padding: 0;

  border: none;

  box-sizing: border-box;

  line-height: 22px;

}

button {

  padding: 0;

  background: none;

  border: none;
  
  color: #333;

}

input[type="checkbox"] {

  margin: 0;

}



input:focus,

textarea:focus {

  outline: none;

}





/*  Tools

-------------------------- */



.width-auto {

  padding-left: 15px;

  padding-right: 15px;

  box-sizing: border-box;

}



@media (min-width: 768px) { 

  .width-auto {

    padding-left: 14.43%;

    padding-right: 14.43%;

  }

}



@media (min-width: 1200px) { 

  .width-auto {

    padding-left: 18.4%;

    padding-right: 18.4%;

  }

}





.tc {

  text-align: center;

}





/*  more

-------------------------- */
.form-submit .layui-btn{
	background: none;
	color: #000;
}
.web-more a, .form-submit button  {

  display: inline-block;

  text-align: center;

  width: 197px;

  height: 50px;

  border: 1px solid #2FA5FD;

  border-radius: 50px;

  line-height: 50px;

  box-sizing: border-box;



  transition: all .3s ease-in-out;

}

.form-submit input{

  display: inline-block;

  text-align: center;

  width: 197px;

  height: 50px;

  border: 1px solid #2FA5FD;

  border-radius: 50px;

  line-height: 50px;

  box-sizing: border-box;



  transition: all .3s ease-in-out;

}



.web-more2 {

  display: inline-block;

  font-size: 14px;

  width: 120px;

  height: 35px;

  text-align: center;

  line-height: 35px;

  box-sizing: border-box;

  border: 1px solid #2fa5fd;

  border-radius: 8px;

}





@media (any-hover: hover) {

  .web-more a:hover,

  .form-submit button:hover,

  .web-more2:hover {

    background-color: #2FA5FD;

    color: #fff;

    cursor: pointer;

  }

}





/*  Swiper Plugin

-------------------------- */



.swiper-btn-prev,

.swiper-btn-next {

  position: absolute;

  top: 50%;

  background: none;

  transition: color .3s ease-in-out;

  z-index: 7;



  width: 24px;

  height: 24px;

  font-size: 24px;

  color: #2FA5FD;

}



.swiper-btn-prev.swiper-button-disabled,

.swiper-btn-next.swiper-button-disabled {

  opacity: 0;

}



.swiper-btn-prev {

  left: 15px;

}

.swiper-btn-next {

  right: 15px;

  -webkit-transform: rotate(180deg);
  
  transform: rotate(180deg);

}





@media (min-width: 768px) {

  .swiper-btn-prev,

  .swiper-btn-next {

    color: #9F9F9F;

  }



  .swiper-btn-prev {

    left: -67px;

  }

  .swiper-btn-next {

    right: -67px;

  }

}



@media (any-hover: hover) {

  .swiper-btn-prev:hover,

  .swiper-btn-next:hover{

    color: #2FA5FD;

    cursor: pointer;

  }

}


/*  Videojs Plugin

-------------------------- */

.vjs-poster img {
  object-fit: cover;
}



/*  Modal Plugin

-------------------------- */

.blocker {

  position: fixed;

  left: 0;

  right: 0;

  bottom: 0;

  top: 0;

  z-index: 12;

  

  display: flex;

  align-items: center;



  background-color: rgba(0, 0, 0, .4);

  padding: 58px 15px 15px 15px;

  box-sizing: border-box;

}

.modal {

  /*display:none;*/

  width: 100%;

  max-height: 100%;

  position: relative;

}



.close-modal {

  position: absolute;

  top: -41px;

  right: 0;

}

.close-modal::before{

  font-family: 'iconfont';

  content: '\e67a';

  font-size: 30px;

  color: #fff;

  transition: all .3s ease-in-out;

}



.modal-content {

  width: 100%;

  overflow-y: auto;

}



@media (min-width: 768px) {

  .blocker {

    padding-left: 15%;

    padding-right: 15%;

  }

}



@media (min-width: 1200px) { 

  .blocker {

    padding-left: 30%;

    padding-right: 30%;

  }

}

@media (any-hover: hover) {

  .close-modal:hover::before {

    color: #2FA5FD;

  }

}



/*  Header

-------------------------- */

.header {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 25px 15px;

  box-sizing: border-box;

  background-color: #FAFAFA;

  position: fixed;

  left: 0;

  right: 0;

  top: 0;

  z-index: 9;
  z-index: 999999;



  transition: all .3s ease-in-out;

}



.ny-header {

  position: sticky;

}





/* 

 * header-logo

 */

.header-logo {

  margin-top: 0;

  margin-bottom: 0;

  font-weight: normal;

  font-size: inherit;

}

.header-logo a {

  display: block;

  position: relative;

}

.header-logo img {

  width: 162px;

  transition: all .3s ease-in-out;

}

.header-logo img:last-child {

  position: absolute;

  left: 0;

  top: 0;

  opacity: 0;

}





/* 

 * header-offcanvas

 */

.header-offcanvas {

  position: fixed;

  right: 0;

  top: 0;

  bottom: 0;

  z-index: 10;



  width: 240px;

  background-color: #fff;

  padding: 84px 25px;

  /*transform: translateX(200%);*/

  transition: transform .3s ease-in-out;

}



/* .header-ul */

.header-ul {

  font-family: 'PingFang SC-Medium';

  font-size: 20px;

}

/*.header-ul li {

  margin-bottom: 30px;

}*/

.header-ul li.on a {

  color: #2FA5FD;

}



/* header-language */

.header-language div{

  width: 91px;

  height: 33px;



  display: inline-flex;

  align-items: center;

  justify-content: center;

  

  font-size: 12px;

  border: 1px solid #333;

  border-radius: 34px;

  box-sizing: border-box;



  transition: all .3s ease-in-out;

}

.header-language a {

  padding: 4px 9px;

}

.header-language a:last-child {

  font-size: 14px;

  text-transform: uppercase;

}

.header-language a.on {

  color: #fff;

  background: linear-gradient(90deg, #58E6C7 0%, #39B5E7 100%);

  border-radius: 23px;

}







/*

 * offcanvas-backdrop

 */



.offcanvas-backdrop {

  position: fixed;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;

  z-index: 8;

  background: rgba(0, 0, 0, .4);



  display: none;

  opacity: 0;

  transition: all .3s ease-in-out;

}







/*

 * header-toggle

 */



.header-toggle {

  width: 30px;

}

.header-toggle span {

  display: block;

  height: 2px;

  border-radius: 2px;

  background-color: #333;

  margin-top: 7px;

  transition: all .3s ease-in-out;

}

.header-toggle span:first-child {

  margin-top: 0;

}





/* header-close */

.header-close {

  position: absolute;

  top: 38px;

  right: 15px;

}

.header-close span:nth-child(1) {

  transform: rotate(45deg);

  transform-origin: 6px 6px;

}

.header-close span:nth-child(3) {

  transform: rotate(-45deg);

  transform-origin: 2px -4px;

}

.header-close span:nth-child(2) {

  opacity: 0;

}





@media (min-width: 1024px) {

  .header {

    padding: 28px 3%;

  }

  .header-logo img {

    width: 223px;

  }



  .header-offcanvas {

    display: flex;

    flex: 1;

    width: auto;

    padding: 0;

    position: static;

    background: none;

    transform: none;

  }

  .header-ul {

    flex: 1;

    padding-left: 3%;

    padding-right: 3%;

    display: flex;

    align-items: center;

    justify-content: space-between;

  }

  .header-ul li {

    margin-bottom: 0;

  }  



  .header-toggle {

    display: none;

  }

}



@media (min-width: 1300px) {

  .header {

    padding-left: 6.115%;

    padding-right: 6.115%;

  }



  .header-ul {

    padding-left: 8%;

    padding-right: 8%;

  }

}



@media (min-width: 1600px) {

  .header-ul {

    padding-left: 0;

    padding-right: 80px;

    justify-content: flex-end;

  }

  .header-ul li {

    margin-left: 60px;

  }

}



/*

 * header js

 */



 /* show-offcanvas */

.show-offcanvas .header-offcanvas {

  transform: translateX(0);

}

.show-offcanvas .offcanvas-backdrop {

  display: block;

  opacity: 1;

}

@media (min-width: 1024px) {

  .show-offcanvas .offcanvas-backdrop {

    display: none;

    opacity: 0;

  }

}



/* scroll */

.home-header {

  background: none;

}

.home-header .header-logo img:first-child {

  opacity: 0;

}

.home-header .header-logo img:last-child {

  opacity: 1;

}

.home-header > .header-toggle span {

  background-color: #fff;

}



@media (min-width: 1024px) {

  .home-header, .home-header a {

    color: #fff;

  }

  .home-header .header-language div {

    border-color: #fff;

  }

}

@media (any-hover: hover) {

  .home-header a:hover {

    color: #2FA5FD;

  }
  
  
  .header-ulul li a:hover {

    color: #2FA5FD;

  }

  .home-header .header-language a.on:hover {

    color: #fff;

  }

}







/*  Footer

-------------------------- */

.footer {

  background: url('../image/64ca13b2680e4.jpg') no-repeat center;

  background-size: cover;

  padding: 97px 15px 80px 15px;

  text-align: center;

  margin-top: 184px;

}

.footer,

.footer a {

  color: #fff;

}



.footer-floor1 {

  font-family: 'PingFang SC-Medium';

  font-size: 32px;

}

.footer-floor2 {

  margin-top: 7px;

}

.footer-floor3 {

  font-size: 50px;

  margin-top: 37px;

}

.footer-floor3 a {

  display: inline-block;

}

.footer-floor4 {

  margin-top: 82px;

}
.footer-floor4 img{
	width: 223px;
}
.footer-floor5 {

  display: flex;

  flex-wrap: wrap;

  padding-top: 56px;

}

.footer-floor5 dd {

  width: 33.33%;

  margin-top: 20px;

}

.footer-floor6 p{

  margin-top: 36px;

  margin-bottom: 0;

}

.footer-floor7 {

  margin-top: 25px;

}

.footer-floor8 {

  margin-top: 7px;

}

.footer-floor9 {

  margin-top: 29px;

}



@media (min-width: 768px) {

  .footer-floor5 {

    justify-content: center;

  }

  .footer-floor5 dd{

    width: auto;

    margin-left: 20px;

    margin-right: 20px;

  }

  .footer-floor6 {

    display: flex;

    justify-content: center;

  }

  .footer-floor6 p {

    margin-left: 22px;

    margin-right: 22px;

  }

}

@media (any-hover: hover) {

  .footer a:hover {

    text-decoration: underline;

  }



  .footer-floor3 a:hover {

    text-decoration: none;


    transform: rotate(360deg);

  }

}





/*  Form

-------------------------- */



.form {

  padding: 15px;

  background-color: #F7F7F7;

}

.form ul{

  margin-top: -15px;

}

.form li {

  margin-top: 15px;

}



.form-title {

  display: inline-block;

  font-family: 'PingFang SC-Medium';

  font-size: 18px;

  color: #666;



  margin-bottom: 10px;

}

.form-title i {

  color: #FF0000;

  position: relative;

  top: 4px;

}



.form-coat {

  background-color: #fff;

  padding: 7px 15px;

  position: relative

}

.form textarea {

  height: 64px;

}



.form-checks{

  background-color: #fff;

  padding: 15px;

}

.form-checks dl {

  margin-top: -21px;

}

.form-checks dd {

  margin-top: 21px;

  font-size: 14px;

  color: #919191;

}



.form-checks label {

  margin-left: 12px;

}

.form-submit {

  margin-top: 40px;

}

div.form-error {

  color: #FF0000;

  margin-top: 10px;

}



@media (min-width: 600px) { 

  .form {

    padding: 33px 37px;

  }

  .form ul {  

    margin-top: -30px;

  }

  .form li {

    margin-top: 30px;

  }

  .form-coat {

    padding-top: 13px;

    padding-bottom: 13px;

  }



  .form-checks dl{

    display: flex;

    flex-wrap: wrap;

  }

  .form-checks dd {

    width: auto;

    margin-right: 40px;

  }

}







/*  fixation

-------------------------- */

.fixation {

  position: fixed;

  right: 3%;

  bottom: 30%;

  z-index: 7;

  display: none;

}

.fixation li,

.fixation a,

.fixation div {

  transition: all .3s ease-in-out;

}



.fixation li {

  width: 44px;

  height: 44px;

  font-size: 20px;

  text-align: center;

  border-radius: 44px;

  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);

  overflow: hidden;

  box-sizing: border-box;

  border: 1px solid transparent;

  line-height: 44px;

}



.fixation a {

  display: block;

  color: #fff;

  background: linear-gradient(90deg, #58E6C7 0%, #39B5E7 100%);

}



.fixation li:last-child {

  margin-top: 14px;

}



@media (any-hover: hover) {

  .fixation li:hover {

    background: linear-gradient(90deg, #58E6C7 0%, #39B5E7 100%);

  }

  .fixation li:hover div {

    background-color: #fff;

  }

  .fixation li:hover a {

    -webkit-text-fill-color: transparent;

    -webkit-background-clip: text;

    background-clip: text;

  }

}









/*  ny banner

-------------------------- */

.ny-banner {

  font-family: 'PingFang SC-Medium';

  font-size: 52px;

  color: #fff;

  text-align: center;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  padding-top: 196px;

  padding-bottom: 225px;

}



.ny-banner span {

  position: relative;

}

.ny-banner span::before {

  content: '';

  display: block;

  width: 85px;

  height: 4px;

  background-color: #fff;

  position: absolute;

  left: 50%;

  bottom: -37px;

  margin-left: -42.5px;

}







/*  ny location

-------------------------- */

.ny-location,

.ny-location a {

  color: #999;

}

.ny-location {

  font-size: 14px;

  padding-top: 60px;

  padding-bottom: 55px;

}





/*  news

-------------------------- */

.news {

  font-size: 12px;

  position: relative;

}





.news img {

  width: 100%;
  height: 199px;

}





.news h2,

.news p {

  font-family: 'PingFang SC-Medium';

  margin-top: 0;

  margin-bottom: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.news h2 {

  font-size: 16px;

  font-weight: 500;

  margin-top: 20px;

}

.news p {

  color: #666;

  padding-top: 10px;

  padding-bottom: 13px;

}

.news .date {

  color: #999;

}





.news .swiper-btn-prev,

.news .swiper-btn-next {

  margin-top: -61px;

}







/*  pages

-------------------------- */

.pages,

.pages a {

  color: #999;

}

.pages {

  display: flex;

  align-items: center;

  justify-content: center;

  margin-top: 104px;

}

.pages a, .pages span {

  display: none;

}
.pages a {
  transition: color .3s ease-in-out;
}
.pages a.iconfont {

  display: block;

  font-size: 22px;

}

.pages a:first-child {

  margin-right: 28px;

}

.pages a:last-child {

  margin-left: 28px;

  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);

}







@media (min-width: 400px) {

  .pages span, .pages a {

    display: block;

  }

  .pages a:not(.iconfont) {

    font-size: 12px;

    width: 23px;

    height: 23px;

    border-radius: 23px;

    text-align: center;

    line-height: 23px;

    margin-left: 2.5px;

    margin-right: 2.5px;

  }



  .pages span {

    position: relative;

    top: -5px;

    margin-left: 11px;

    margin-right: 11px;

  }



  .pages a.cur {

    color: #fff;

    background-color: #2FA5FD;

  }



  .pages a:first-child {

    margin-right: 48px;

  }

  .pages a:last-child {

    margin-left: 48px;

  }

}

@media (any-hover: hover) {

  .pages a:not(.iconfont):hover {

    color: #fff;

    background-color: #2FA5FD;

  }

  .pages a.iconfont:hover {

    color: #2FA5FD;

  }

}







/*  ny-nav

-------------------------- */

.ny-nav {

  font-size: 14px;

  border-top: 1px solid #f5f5f5;

  border-bottom: 1px solid #f5f5f5;

  

  display: flex;

  justify-content: center;



  padding: 20px 15px;

}

.ny-nav-content {

  margin-top: -15px;

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

}

.ny-nav a {

  margin-top: 15px;

  margin-left: 7px;

  margin-right: 7px;

}

.ny-nav a.cur {

  color: #2FA5FD;

}



@media (min-width: 768px) {

  .ny-nav {

    padding-left: 18.4%;

    padding-right: 18.4%;

  }



  .ny-nav a {

    margin-left: 35px;

    margin-right: 35px;

  }



  

}

@media (min-width: 1280px) { 

  .ny-nav a.cur {

    position: relative;

  }

  .ny-nav a.cur::before {

    content: '';

    height: 4px;

    position: absolute;

    left: 0;

    right: 0;

    bottom: -20px;

    background-color: #2FA5FD;

  }

}





/* ========================================================================

  Page of Home

========================================================================== */





/*  Banner

-------------------------- */

.home-banner .bg {

  height: 420px;

  background-position: -40px;

  background-repeat: no-repeat;

  background-size: cover;

}

.home-banner .img {

  display: none;

}





/* 

 * .memo

 */

.home-banner .memo {

  display: flex;

  align-items: center;

  position: absolute;

  right: 12px;

  bottom: 25px;

  color: #d9dee1;

}



.home-banner .words {

  text-align: right;

  margin-right: 20px;

}

.home-banner .tip {

  font-family: 'PingFang SC-Medium';

  font-size: 18px;

  font-weight: normal;

}

.home-banner .text {

  margin-top: 10px;

}



.home-banner .player {
  display: block;
  width: 86px;
  height: 86px;

  box-shadow: 0 0 10px rgba(0, 0, 0, .33);
  border-radius: 100%;
  position: relative;
  z-index: 10;
}
.home-banner .player svg {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 6;
}
.home-banner .player svg path{
  transition: all .3s ease-in-out;
}




/* 

 * swiper-button-prev + swiper-button-next

 */



.home-banner .swiper-btn-prev,

.home-banner .swiper-btn-next  {

  width: 46px;

  height: 46px;

  margin-top: -23px;

  font-size: 46px;

  color: #fff;

}





@media (min-width: 768px) {

  .home-banner .bg {

    display: none;

  }

  .home-banner .img {

    display: block;
    width: 100%;
  }



  .home-banner .tip {

    font-size: 24px;

  }

  .home-banner .text {

    font-size: 20px;

  }



  .home-banner .swiper-btn-prev {

    left: 15px;

  }

  .home-banner .swiper-btn-next {

    right: 15px;

  }

}



@media (min-width: 1024px) {  

  .home-banner .memo {

    bottom: 110px;

  }



  .home-banner .swiper-btn-prev {

    left: 3%;

  }

  .home-banner .memo,

  .home-banner .swiper-btn-next {

    right: 3%;

  }



  .home-banner .player {

    width: 100px;
    height: 100px;
  }

}



@media (min-width: 1200px) {   

  .home-banner .swiper-btn-prev {

    left: 6.115%;

  }

  .home-banner .memo,

  .home-banner .swiper-btn-next {

    right: 6.115%;

  }

}



@media (any-hover: hover) {

  .home-banner .swiper-btn-prev:hover,

  .home-banner .swiper-btn-next:hover {

    color: #2FA5FD;

  }



  .home-banner .player:hover svg path{

    fill: #2FA5FD;

  }

}





/*  home-title

-------------------------- */

.home-title {

  font-family: 'PingFang SC-Medium';  

}

.home-title span {

  font-size: 42px;

  position: relative;

}

.home-title span::before {

  content: '';

  display: block;

  width: 44px;

  height: 1px;

  background-color: #2FA5FD;

  position: absolute;

  left: 50%;

  bottom: -16px;

  margin-left: -22px;

}

.home-title div {

  font-size: 20px;

  color: #999;

  margin-top: 17px;

  text-transform: capitalize;

}





/*  news

-------------------------- */



/* 

 * home-news-title

 */



.home-news-title {

  padding-top: 53px;

  padding-bottom: 45px;

}





/* 

 * home-news-more

 */

.home-news-more {

  margin-top: 46px;

}





/*  about

-------------------------- */



/* 

 * home-about-title

 */

.home-about-title {

  padding-top: 91px;

  padding-bottom: 33px;

}



/* 

 * home-about

 */

.home-about {

  padding-left: 15px;

  padding-right: 15px;

}



.home-about-words .txt{

  font-family: 'PingFang SC-Medium';

  color: #999;

  line-height: 1.7;

}

.home-about-words p {

  margin-top: 0;

  margin-bottom: 0;

}



/* more */

.home-about-words .web-more {

  text-align: center;

  margin-top: 80px;

}



/* pic */

.home-about-pic {

  display: none;

}



@media (min-width: 768px) {  

  .home-about {

    padding-left: 16.56%;

    padding-right: 16.56%;

  }

}

@media (min-width: 1200px) {  

  .home-about {

    display: flex;

    justify-content: center;

    align-items: flex-end;

    padding-right: 0;

  }

  .home-about-words {

    flex: 1;

    padding-right: 94px;

  }

  .home-about-words .web-more {

    text-align: left;

  }

  .home-about-pic {

    width: 48%;

    display: block;

    position: relative;

  }

  .home-about-pic img {

    position: absolute;

    left: 0;

    bottom: 0;

    right: 0;

  }

}



@media (min-width: 1600px) { 

  .home-about-pic {

    width: 62.29%;

  }

}





/*  products

-------------------------- */



/* 

 * home-product-title

 */



.home-product-title {

  padding-top: 63px;

  padding-bottom: 57px;

}





/* 

 * home-product

 */

.home-product a {

  display: block;

  position: relative;

  color: #fff;

  overflow: hidden;

}



.home-product img {

  transition: all .3s ease-in-out;
  width: 100%;

}

.home-product h2 {

  font-family: 'PingFang SC-Medium';

  font-size: 32px;

  font-weight: normal;



  margin-top: 0;

  margin-bottom: 0;

  position: absolute;

  left: 15px;

  right: 15px;

  top: 0;

  bottom: 0;



  display: flex;

  align-items: center;

  justify-content: center;

}

.home-product p{
  font-family: 'PingFang SC-Medium';
    font-size: 20px;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    position: absolute;
    left: 15px;
    right: 15px;
    top: 80px;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (any-hover: hover) {

  .home-product a:hover img {

    transform: scale(1.05);

  }


}



/* 

 * more

 */

.home-product-more {

  margin-top: 40px;

}







/*  case

-------------------------- */





/* 

 * home-case-title

 */



.home-case-title {

  padding-top: 51px;

  padding-bottom: 33px;

}



/* 

 * home-case

 */



.home-case ul {

  margin-top: -15px;

}

.home-case li {

  margin-top: 15px;

}

.home-case a {

  display: block;

  position: relative;

  color: #fff;



  overflow: hidden;

}

.home-case img {

  width: 100%;

  transition: all .3s ease-in-out;

}

.home-case .memo {

  font-family: 'PingFang SC-Medium';

  position: absolute;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;



  padding: 41px 33px;

  background-color: rgba(0, 0, 0, .3);

}



.home-case h2,

.home-case p {

  margin-top: 0;

  margin-bottom: 0;

  transition: all .3s ease-in-out;

}

.home-case h2 {

  font-weight: normal;

}

.home-case p {

  color: #ccc;

  margin-top: -3px;

  text-transform: capitalize;

}



@media (min-width: 520px) { 

  .home-case ul {

    display: flex;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }

  .home-case li {

    width: 50%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

  }

}



@media (min-width: 768px) { 

  .home-case ul {

    margin-left: -10px;

    margin-right: -10px;

    margin-top: -32px;

  }

  .home-case li {

    padding-left: 10px;

    padding-right: 10px;

    margin-top: 32px;

  }

}



@media (min-width: 1200px) {  

  .home-case li {

    width: 33.33%;

  }

}



@media (any-hover: hover) {

  .home-case a:hover h2,

  .home-case a:hover p {

    color: #2FA5FD;

  }



  .home-case a:hover img {

    transform: scale(1.02);

  }

}





/* 

 * more

 */

.home-case-more {

  padding-top: 40px;

  padding-bottom: 64px;

}





/*  solution

-------------------------- */

.home-solution {
  background-image: url('64f042e11ca80.jpg');
  background-repeat: no-repeat;

  background-position: center bottom;

  /*background-size: cover;*/

  /* background-attachment: fixed; */

  padding-top: 100px;

  padding-bottom: 162px;

  position: relative;
}

.home-solution::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, .3);
}

/* 

 * title

 */

.home-solution-title,

.home-solution-title div {

  color: #fff;

}

.home-solution-title span::before {

  background-color: #fff;

}





/* 

 * solution-swiper

 */

.solution-swiper {

  margin-top: 87px;

  position: relative;

  padding-left: 76px;

  padding-right: 76px;

}

.solution-swiper .swiper-slide {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}

.solution-swiper a {

  display: block;

  font-family: 'PingFang SC-Medium';

  color: #fff;

  text-align: center;

}



.solution-swiper h2,

.solution-swiper p {

  margin-top: 0;

  margin-bottom: 0;

}

.solution-swiper h2 {

  font-weight: normal;

  font-size: 20px;

}

.solution-swiper p {

  margin-top: 20px;

  text-transform: capitalize;

}



/* swiper-btn-prev + swiper-btn-next */



.solution-swiper .swiper-btn-prev,

.solution-swiper .swiper-btn-next {

  width: 46px;

  height: 46px;

  font-size: 46px;

  color: #fff;

  top: 0;

}





/* 

 * more

 */

.home-solution-more {

  margin-top: 40px;

}





@media (min-width: 768px) {  

  .solution-swiper {

    padding-left: 15.85%;

    padding-right: 15.85%;

  }

  .solution-swiper .swiper-btn-prev {

    left: 7.7%;

  }

  .solution-swiper .swiper-btn-next {

    right: 7.7%;

  }

}

@media (any-hover: hover) {

  .solution-swiper .swiper-btn-prev:hover,

  .solution-swiper .swiper-btn-next:hover {

    color: #2FA5FD;

  }

}







/*  contact

-------------------------- */

.home-contact {
  overflow: hidden;
  padding-top: 142px;

}





/* 

 * title

 */

.home-contact-title {

  text-align: center;

}





/* 

 * txt

 */



.home-contact .txt {

  color: #000;

}

.home-contact .txt p {

  margin-top: 19px;

  margin-bottom: 0;

}

.home-contact .txt p:first-child,

.home-contact .pic {

  margin-top: 25px;

}

.home-contact .pic {

  text-align: center;

}



@media (min-width: 1200px) {  

  .home-contact {

    display: flex;

    align-items: center;

  }



  .home-contact-title {

    text-align: left;

  }

  .home-contact-title span::before {

    left: 0;

    margin-left: 0;

  }

  .home-contact .pic {

    flex: 1;

    padding-left: 149px;

    margin-top: 0;

  }

  .home-contact .pic img {

    width: 100%;

  }

}











/* ========================================================================

  Page of news

========================================================================== */



/*  news-title

-------------------------- */

.news-title {

  font-family: 'PingFang SC-Medium';

  font-size: 32px;

}



/*  news-title2

-------------------------- */

.news-title2 {

  padding-top: 58px;

  padding-bottom: 42px;

  border-top: 1px solid #f3f3f3;

  margin-top: 60px;

}





/* news-focus

-------------------------- */

.news-focus {

  position: relative;

  margin-top: 40px;

}



.news-focus-content {

  font-family: 'PingFang SC-Medium';

  font-size: 12px;

}

.news-focus-content a{

  display: block;

  position: relative;

  color: #fff;

}

.news-focus-content img {
    height: 100%;
  width: 100%;

}

.news-focus-content h2 {

  font-size: 16px;

  font-weight: normal;

  margin-top: 0;

  margin-bottom: 0;

}

.news-focus-content .date,

.news-focus-content p {

  display: none;

}

.news-focus-content .mask {

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  

  padding: 15px;

  display: flex;

  justify-content: flex-end;
    
  flex-direction: column;

}

.news-focus2,

.news-focus3 {

  margin-top: 20px;

}

.news-focus2 .mask,

.news-focus3 .mask {

  background: linear-gradient(0deg,rgba(0, 0, 0, .4),rgba(0, 0, 0, 0) 100%);

}



@media (min-width: 480px) { 

  .news-focus-content {

    display: grid;
    grid-gap: 10px;
    grid-template-columns: 64.4% auto;
    grid-template-rows: repeat(2, 1fr);

  }

  .news-focus-content a,

  .news-focus2 .pic,

  .news-focus3 .pic {

    height: 100%;

  }

  .news-focus-content .pic {

    overflow: hidden;

  }

 

  .news-focus1 {

    grid-column: 1 / 2;

    grid-row: 1 / 3;

  }

  .news-focus2,

  .news-focus3 {

    margin-top: 0;

    /* grid-column: 8 / 15; */

  }

  .news-focus2 {

    grid-row: 1 / 2;

  }

  .news-focus3 {

    grid-row: 2 / 3;

  }



  .news-focus1 a{

    display: flex;

    flex-direction: column;

    justify-content: space-between;

  }

  .news-focus1 .mask{

    position: static;

    flex: 1;

    padding: 0;

    /*justify-content: center;*/

  }



  .news-focus1 a h2 {

    color: #333;

    margin-top: 10px;

  }

  .news-focus1 .date,

  .news-focus1 p {

    display: block;

  }

  .news-focus1 a .date {

    color: #666;

  }

  .news-focus1 p {

    color: #999;

    height: 33px;

    overflow: hidden;

    margin-top: 6px;

    margin-bottom: 0;

  }

  .news-focus2 img,

  .news-focus3 img {

    transform: scale(2);

  }

  

}



@media (min-width: 1420px) { 

  .news-focus-content {

    /* grid-gap: 4px; */

  }



  .news-focus-content h2 {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

  .news-focus-content .date,

  .news-focus-content p {

    display: block;

  }  



  .news-focus1 h2 {

    font-size: 24px;

  }



  .news-focus2 img,

  .news-focus3 img {

    transform: scale(1);

  }

  .news-focus2 .mask,

  .news-focus2 .mask {

    padding: 30px;

  }

  .news-focus2 p,

  .news-focus3 p {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    margin-top: 12px;

    margin-bottom: 12px;

  }

  

}





/* ========================================================================

  Page of Product category

========================================================================== */

.pro-category {

  margin-top: 61px;

}

.pro-category:first-child {

  margin-top: 0;

}

.pro-category .title {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.pro-category h2{

  font-family: 'PingFang SC-Medium';

  font-size: 20px;

  font-weight: normal;

  margin-top: 0;

  margin-bottom: 0;

}

.pro-category .box {

  text-align: right;

  background-repeat: no-repeat;

  background-position: left center;

  background-size: 100% auto;

  margin-top: 20px;

}



.pro-category .pic {

  text-align: center;

  display: inline-block;

  width: 84.7%;

}



.pro-category:nth-child(2n) .box {

  text-align: left;

  background-position: right center;

}



@media (min-width: 640px) { 

  

  .pro-category .title {

    justify-content: flex-start;

  }

  .pro-category:nth-child(2n) .title{

    flex-direction: row-reverse;

  }

  .pro-category h2{

    font-size: 32px;

  }

  .pro-category:nth-child(2n+1) .web-more2 {

    margin-left: 60px;

  }

  .pro-category:nth-child(2n) .web-more2 {

    margin-right: 60px;

  }

  .pro-category .box {

    background-size: 80% auto;

  }

  .pro-category .pic {

    width: 47%;

  }

}

@media (min-width: 1920px) { 

  .pro-category .box {

    background-size: auto 242px;

    margin-top: -47px;

  }

}







/* ========================================================================

  Page of Product list

========================================================================== */



.pro-list {

  margin-top: -58px;

}

.pro-list li {

  text-align: center;

  margin-top: 58px;

}

.pro-list .pic,

.pro-list img {

  transition: all .3s ease-in-out;

}



.pro-list .pic {

  display: inline-block;

  border: 1px solid #e5e5e5;

  text-align: center;

  overflow: hidden;

}



.pro-list h2 {

  font-family: 'PingFang SC-Medium';

  font-weight: normal;

  font-size: 16px;

  margin-top: 14px;

  margin-bottom: 15px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



@media (min-width: 480px) { 

  .pro-list{

    display: flex;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }

  .pro-list li {

    width: 50%;

    box-sizing: border-box;

    padding-left: 7px;

    padding-right: 7px;

  }

  .pro-list .pic {

    display: block;

  }

}



@media (min-width: 640px) { 

  .pro-list li {

    width: 33.33%;

  }

}



@media (min-width: 1480px) { 

  .pro-list {

    margin-left: -45px;

    margin-right: -45px;

  }

  .pro-list li {

    padding-left: 45px;

    padding-right: 45px;

  }

}





@media (any-hover: hover) {

  .pro-list .pic:hover {

    border-color: #2FA5FD;

  }

  .pro-list .pic:hover img {

    transform: scale(1.05);

  }

}



/* ========================================================================

  Page of Product info

========================================================================== */



/*  pro-info-detail

-------------------------- */

.pro-info-detail {

  margin-bottom: 56px;

}



/* 

 * pro-detail-left

 */



.detail-mobile-box {

  text-align: center;

  position: relative;

}

.detail-mobile-box .pic {

  display: inline-block;

  border: 1px solid #e5e5e5;

}

.detail-pc-box {

  display: none;

}



/* 

 * pro-detail-right

 */

.pro-detail-right {

  margin-top: 30px;

  color: #666;

  font-family: 'PingFang SC-Medium';

}

.pro-detail-right *{

  font-weight: normal;

  margin: 0;

}

.pro-detail-right h2 {

  font-size: 32px;

  color: #333;

  padding-bottom: 9px;

}

.pro-detail-right h3 {

  font-size: 18px;

  margin-top: 24px;

  margin-bottom: 5px;

}

.pro-detail-right p {

  font-size: 14px;
	white-space: pre-line;
}



.pro-detail-right2 p {

  margin-top: 15px;

}

.pro-detail-right2 span {

  font-size: 16px;

}



@media (min-width: 992px) { 

  .pro-info-detail {

    display: flex;

    align-items: center;

    justify-content: space-between;

  }

  .pro-detail-left {

    width: 47.8%;

  }

  .pro-detail-right {

    flex: 1;

    padding-left: 6.83%;

    padding-right: 0;

    margin-top: 0;

  }



  .detail-mobile-box {

    display: none;

  }



  .detail-pc-box {

    display: block;

  }



  .detail-pc-box img {

    width: 100%;

  }

  .detail-pc-box .big {

    border: 1px solid #e5e5e5;

  } 

  .detail-pc-box .small {

    display: flex;

    margin-top: 17px;

  }

  .detail-pc-box .small li {

    width: 128px;

    border: 1px solid #e5e5e5;

    box-sizing: border-box;

    margin-right: 18px;

    transition: all .3s ease-in-out;

  }

}

@media (min-width: 1580px) { 

  .pro-detail-right {

    padding-left: 6.83%;

    padding-right: 6.83%;

    margin-top: -133px;

  }

  

}

@media (any-hover: hover) {

  .detail-pc-box .small li.cur,

  .detail-pc-box .small li:hover {

    border-color: #2FA5FD;

    cursor: pointer;

  }

}











/*  pro-info-title

-------------------------- */

.pro-info-title {

  font-family: 'PingFang SC-Medium';

  font-size: 24px;

  color: #fff;

  background: linear-gradient(90deg, #58E6C7 0%, #39B5E7 100%);

  padding: 7px 15px;

}



.pro-info-title span {

  font-family: 'PingFang SC-Regular';

  font-size: 16px;

}





@media (min-width: 420px) { 

  .pro-info-title {

    padding-left: 24px;

    padding-right: 24px;

  }

  .pro-info-title span {

    margin-left: 30px;

    text-transform: capitalize;

  }

}



/*  pro-info-diagram

-------------------------- */

.pro-info-diagram {

  text-align: center;

  margin-top: 78px;

  margin-bottom: 100px;

}





/*  pro-info-related

-------------------------- */

.pro-info-related {

  position: relative;

  text-align: center;

  padding-top: 49px;

  padding-bottom: 75px;

}



.pro-info-related .pic,

.pro-info-related img {

  transition: all .3s ease-in-out;

}



.pro-info-related .pic {

  display: inline-block;

  border: 1px solid #e5e5e5;

  text-align: center;

  overflow: hidden;

}



.pro-info-related h2 {

  font-family: 'PingFang SC-Medium';

  font-weight: normal;

  font-size: 16px;

  margin-top: 9px;

  margin-bottom: 15px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}





.pro-info-related .iconfont {

  margin-top: -61px;

}

@media (any-hover: hover) {

  .pro-info-related .pic:hover {

    border-color: #2FA5FD;

  }

  .pro-info-related .pic:hover img {

    transform: scale(1.05);

  }

}







/*  pro-info-form

-------------------------- */

.pro-info-form {

  margin-top: 25px;

}



@media (min-width: 600px) { 

  .pro-info-form ul {

    display: flex;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }



  .pro-info-form li {

    width: 100%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

    position: relative;

  }

  .pro-info-form .form-title {

    position: absolute;

    margin-bottom: 0;

    left: 22px;

    top: 10px;

    z-index: 6;

  }

  .pro-info-form .form-coat {

    padding-left: 78px;

  }

  .pro-info-form .username,

  .pro-info-form .company,

  .pro-info-form .email,

  .pro-info-form .telephone {

    width: 50%;

  }

  .pro-info-form .form-industry-box {

    background-color: #fff;

    padding-top: 46px;

    padding-bottom: 20px;

  }

  .pro-info-form .form-industry-box .form-title {

    top: 19px;

  }

  .pro-info-form textarea {

    height: 137px;
	border: none;
  }

}



@media (min-width: 1200px) { 

  .pro-info-form ul {

    margin-left: -25px;

    margin-right: -25px;

  }

  .pro-info-form li {

    padding-left: 25px;

    padding-right: 25px;

  }

  .pro-info-form .form-title {

    left: 45px;

  }

  .pro-info-form .form-checks {

    padding-left: 20px;

    padding-right: 20px;

  }

  

}



/* ========================================================================

  Page of case

========================================================================== */



.case-list {

  text-align: center;

  padding-top: 23px;

}



.case-list li {

  margin-top: 37px;

}

.case-list .pic {

  overflow: hidden;

}

.case-list img {

  transition: all .3s ease-in-out;

}

.case-list h2 {

  font-weight: normal;

  font-size: 16px;

  margin-top: 12px;

  margin-bottom: 0;

}



@media (min-width: 480px) { 

  .case-list {

    display: flex;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }

  .case-list li {

    width: 50%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

  }



  .case-list img {

    width: 100%;
    
    height: 235.25px

  }



  .case-list h2 {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

}



@media (min-width: 992px) { 

  .case-list li {

    width: 33.33%;

  }

}



@media (min-width: 1480px) {  

  .case-list {

    margin-left: -10px;

    margin-right: -10px;

  }

  .case-list li {

    padding-left: 10px;

    padding-right: 10px;

  }

}



@media (any-hover: hover) {

  .case-list .pic:hover img {

    transform: scale(1.05);

  }

}







/* ========================================================================

  Page of solution

========================================================================== */





.solution-list {

  text-align: center;

  margin-top: -60px;

}



.solution-list li {

  margin-top: 60px;

}

.solution-list .pic {

  overflow: hidden;

}

.solution-list img {

  transition: all .3s ease-in-out;

}

.solution-list h2 {

  font-weight: normal;

  font-size: 16px;

  margin-top: 20px;

  margin-bottom: 0;

}



@media (min-width: 480px) { 

  .solution-list {

    display: flex;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }

  .solution-list li {

    width: 50%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

  }



  .solution-list img {

    width: 100%;

  }



  .solution-list h2 {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

}



@media (min-width: 992px) { 

  .solution-list li {

    width: 33.33%;

  }

}



@media (min-width: 1480px) {  

  .solution-list {

    margin-left: -10px;

    margin-right: -10px;

  }

  .solution-list li {

    padding-left: 10px;

    padding-right: 10px;

  }

}



@media (any-hover: hover) {

  .solution-list .pic:hover img {

    transform: scale(1.05);

  }

}







/* ========================================================================

  Page of Solution info

========================================================================== */





/*  solution-article

-------------------------- */

.solution-article .title {

  font-family: 'PingFang SC-Medium';

  font-size: 24px;  

  margin-bottom: 24px;

}



.solution-article p {

  margin-top: 0;

  margin-bottom: 0;

}



.solution-article .more {

  margin-top: 67px;

}

.solution-article .more a{

  display: inline-block;

  width: 197px;

  height: 50px;

  text-align: center;

  line-height: 50px;

  border-radius: 15px;

  border: 1px solid #2FA5FD;

}





/*  solution-bar

-------------------------- */

.solution-bar {

  margin-top: 67px;

}

.solution-bar h2 {

  font-size: 16px;

  font-weight: normal;

  margin: 0;

  padding-top: 12px;

  padding-bottom: 11px;

  border-bottom: 1px solid #d9d9d9;

}



.solution-bar .pic {

  overflow: hidden;

}

.solution-bar img {

  width: 100%;

}

.solution-bar .more {

  padding-top: 10px;

  padding-bottom: 24px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.solution-bar span {

  font-size: 12px;

  color: #666;

}

.solution-bar .iconfont {

  font-size: 12px;

  color: #b3b3b3;

}



@media (min-width: 480px) {  

  .solution-bar {

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }



  .solution-bar li {

    width: 50%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

  }



  .solution-bar h2 {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

}

@media (min-width: 1240px) {  

  .solution-info {

    display: flex;

    justify-content: space-between;

  }

  .solution-article {

    width: 65%;

  }

  .solution-bar {

    width: 23.1%;

    margin: 0;

  }

  .solution-bar li {

    width: 100%;

    padding-left: 0;

    padding-right: 0;

  }

}

@media (any-hover: hover) {

  .solution-article .more a:hover {

    background-color: #2FA5FD;

    color: #fff;

  }

  .solution-bar .iconfont:hover {

    color: #2FA5FD;

  }

}









/* ========================================================================

  Page of activity

========================================================================== */

.job-title {

  font-family: 'PingFang SC-Medium';

  font-size: 36px;

  text-align: center;

  margin-top: 51px;

}





.activity-list {

  text-align: center;

  padding-top: 9px;

}



.activity-list li {

  margin-top: 15px;

}

.activity-list a {
 position: relative;

  display: inline-block;

  overflow: hidden;

}

.activity-list img {

  transition: all .3s ease-in-out;

}

@media (min-width: 400px) { 

  .activity-list {

    display: flex;
    
    justify-content: center;

    flex-wrap: wrap;

    margin-left: -7px;

    margin-right: -7px;

  }



  .activity-list li {

    width: 50%;

    padding-left: 7px;

    padding-right: 7px;

    box-sizing: border-box;

  }

}



@media (min-width: 700px) { 

  .activity-list li {

    width: 33.33%;

  }

}



@media (min-width: 1480px) { 

  .activity-list {

    margin-left: -15px;

    margin-right: -15px;

  }

  .activity-list li {

    width: 25%;

    padding-left: 15px;

    padding-right: 15px;

    margin-top: 30px;

  }

}



@media (any-hover: hover) {

  .activity-list a:hover img {

    transform: scale(1.05);

  }

}





/* ========================================================================

  Page of culture

========================================================================== */

.culture-list {

  text-align: center;

}



.culture-list li {

  margin-top: 27px;

}



.culture-list a {

  display: inline-block;

  text-align: left;

  position: relative;

  color: #fff;

  overflow: hidden;

}

.culture-list img {

  width: 100%;

  transition: all .3s ease-in-out;

}

.culture-list .mask {

  position: absolute;

  left: 30px;

  right: 30px;

  bottom: 18px;

}



.culture-list h2,

.culture-list p {

  margin: 0;

}



.culture-list h2 {

  font-family: 'PingFang SC-Medium';

  font-style: normal;

  font-size: 24px;

  font-weight: normal;

}



.culture-list p {

  margin-top: 11px;

}



@media (min-width: 640px) { 

  .culture-list {

    display: flex;

    flex-wrap: wrap;

    margin-left: -13px;

    margin-right: -13px;

  }



  .culture-list li {

    padding-left: 13px;

    padding-right: 13px;

    width: 50%;

    box-sizing: border-box;

  }

}



@media (min-width: 1200px) {

  .culture-list li {

    width: 33.33%;

  }

}



@media (any-hover: hover) {

  .culture-list li a:hover {

    color: #2FA5FD;

  }

  .culture-list li a:hover img {

    transform: scale(1.02);

  }

}





/* ========================================================================

  Page of Job

========================================================================== */

.job-list {

  margin-top: 29px;

}





.job-list h2,

.job-list p {

  margin: 0;

}



.job-list li {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 15px;

  background-color: #f3f3f3;

}

.job-list li:nth-child(2n) {

  background-color: #fff;

}



.job-list .box {

  flex: 1;

  padding-right: 15px;

}

.job-list h2 {

  font-family: 'PingFang SC-Medium';

  font-size: 18px;

  font-weight: normal;

}

.job-list p {

  display: none;

}

.job-list .more {

  font-size: 14px;

  color: #2FA5FD;

}









@media (min-width: 500px) {

  

  .job-list li {

    padding: 27px 26px 28px 26px;

  }

  .job-list .box {

    padding-right: 33px;

    margin-right: 33px;

    overflow: hidden;

  }

  .job-list p {

    display: block;

    font-size: 14px;

    margin-top: 8px;

    max-width: 303px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

  .job-list .more {

    color: #fff;

    width: 120px;

    height: 35px;

    text-align: center;

    line-height: 35px;

    border-radius: 7px;

    background-color: #2FA5FD;

    position: relative;

  }

  .job-list .more::before {

    content: '';

    position: absolute;

    left: -33px;

    top: 0;

    bottom: 0;

    width: 1px;

    background-color: #d9d9d9;

  }

}



@media (any-hover: hover) {

  .job-list .more:hover {

    cursor: pointer;

  }

}



/* ========================================================================

  Page of Job info

========================================================================== */

.job-edit {

  margin-top: 30px;

}

.job-edit h2 {

  font-size: 18px;

}

.job-edit p {

  text-indent: 1em;

}



.go-back {
  display: inline-block;
  font-size: 12px;
  margin-top: 30px;
  transform: rotate(180deg);
  color: #2FA5FD;
}



/* ========================================================================

  Page of About

========================================================================== */







/*  about-article

-------------------------- */

.about-article {

  font-family: 'PingFang SC-Medium';

  color: #999;

  font-size: 20px;

  padding-left: 15px;

  padding-right: 15px;

}



.about-article p {

  margin-top: 0;

  margin-bottom: 0;

}



.about-article .pic {

  text-align: center;

  margin-top: 30px;

}



@media (min-width: 768px) { 

  .about-article {

    padding-left: 14.43%;

    padding-right: 14.43%;

  }



}

@media (min-width: 1200px) { 

  .about-article {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    padding-left: 18.4%;

    padding-right: 0;

  }

  .about-article .words {

    width: 52.8%;

  }

  .about-article .pic {

    width: 41.5%;

    margin-top: 0;

  }

}

@media (min-width: 1520px) { 

  .about-article .words {

    width: 32.8%;

  }

  .about-article .pic {

    width: 61.5%;

  }

}







/*  about-target

-------------------------- */

.about-target,

.about-target a {

  color: #fff;

}

.about-target {

  margin-top: 82px;

  padding-top: 106px;

  padding-bottom: 106px;

  text-align: center;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

/* .about-target ul {

  margin-top: -106px;

} */

.about-target li {

  margin-top: 106px;

}

.about-target h2 {

  font-family: 'PingFang SC-Medium';

  font-size: 18px;

  font-weight: normal;

  margin-top: 37px;

  margin-bottom: 0;

}



.about-target p {

  margin-top: 14px;

  margin-bottom: 0;

}



@media (min-width: 640px) { 

  .about-target {

    background-size: auto 100%;

    background-position: left center;

  }

  .about-target ul {

    display: flex;

    justify-content: center;

  }

  .about-target li {

    margin-left: 4.75%;

    margin-right: 4.75%;

  }

}




@media (min-width: 992px) { 
  .about-target {
    margin-top: 165px;
  }
}




/*  about-video

-------------------------- */

.about-video {

  margin-top: 63px;

}

@media (min-width: 992px) { 
  .about-video {

    margin-top: 126px;
  
  }
}






/*  about-map

-------------------------- */

.about-map {

  text-align: center;

  margin-top: 63px;
}



.about-map img {

  width: 100%;

}



@media (min-width: 992px) { 
  .about-map {

    margin-top: 126px;
  
  }
}
@media (max-width: 640px){
    .pro-list li{
        width: 33.333%;
    }
}
@media (max-width: 480px){
    .pro-list{
        display: flex;
        flex-wrap: wrap;
    }
    .pro-list li{
        width: 33.333%;
    }
    .web-more2{
        width: 70px;
    }
    .case-list{
        display: flex;
        flex-wrap: wrap;
    }
}
@media (max-width: 992px){
    .case-list li {
        width: 33.33%;
        padding: 0 1vw;
        box-sizing: border-box;
    }
    .case-list img{
        height: 20vw;
    }
}
@media (max-width: 1024px){
    .header-ul {
        flex: 1;
        padding-left: 3%;
        padding-right: 3%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .header-offcanvas {
        display: flex;
        flex: 1;
        width: auto;
        padding: 0;
        position: static;
        background: none;
        transform: none;
        align-items: center;
    }
    .home-header,.home-header a{
        color: #fff;
    }
    .home-header .header-language div{
        border-color: #fff;
    }
    .header-ul>li{
        font-size: 2vw;
    }
    .header-logo{
        width: 20vw;
    }
    .header-language a{
        font-size: 1.5vw!important;
    }
    .header-language div{
        width: auto;
        height: auto;
        padding:0.2vw 0.5vw;
    }
}