/* sys_sub_head */
.prlayout{  width: 92.5%;max-width: 1400px;margin: 0 auto;}
.sys_sub_head{padding: 10.5625em 0 0.8125em;font-size: 16px;}
.sys_sub_head:after{height: 3.5em;}
.index_layer_bg{position: absolute;top: 0;left: 0;width: 100%;z-index: -1;}
.index_layer_bg .circle{right: auto;left: 13.5%;bottom: -3.5625em;}
.index_layer_bg .circle i::before{box-shadow: 1.125em 1.875em 2.0625em rgba(8, 64, 208,.67);}
.circle.sm{width: 7.125em;height: 7.125em;}
.index_layer_hd {font-size: 1em;line-height: 1.5;text-align:center;}
.index_layer_hd .layer_title_wrap{position: relative;display: inline-block;font-size: 3.5em;font-weight: bold;line-height: 1;}
.index_layer_hd .layer_title{color: #2bd576;font-size: inherit;font-weight: inherit;line-height: inherit;display: inline-block;letter-spacing: 0px;}
.index_layer_hd .layer_title_bg{background-repeat: no-repeat;background-size: auto;background-position: -.4464em;position: absolute;top: 0;left: 0;-webkit-background-clip: text;
    background-clip: text;-webkit-text-fill-color: transparent;letter-spacing: 0px;font-size: inherit;font-family: inherit;font-weight: inherit;line-height: inherit;pointer-events: none;}
.index_layer_hd strong{font-size: 2.25em;font-weight: bold;margin: .333em 0 .611em;font-weight: bold;
    letter-spacing: .1em;
    display: block;}
.index_layer_hd p{font-size: 1.125em;}
.index_layer_hd .btn_group{padding: 0.625em 0;margin: 1.0625em 0 .5em;}
.index_layer_hd .btn_group .btn{font-size: 1em;color: #fff;line-height: 1;padding: 1.0625em 3.625em;border-radius: 1.875em;background: linear-gradient(90deg, rgba(242, 242, 242, .2) 0%,rgba(242, 242, 242, .2) 50%,#2ad871 50%,#2ad871 70%,#3b70f9 100%);background-size: 200% 100%;background-position: 0 0; background-repeat: no-repeat;letter-spacing: 0.125em;display: inline-block;margin: 0.3125em 1.875em;transition: all .35s ease;font-weight:bold;}
.index_layer_hd .btn_group .btn:hover{background-position: 100% 0;}
.index_layer_hd .layer_img img{max-width: 55%;}

.index_layer_hd.white  {color:#FFFFFF} 

/* main */
.web_main.page_main{font-size: 16px;}

/* our_advantage */
.our_advantage{position: relative;padding: 3.5625em 0 0em;font-size: 1em;}
.our_advantage .circle{right: 13.5%;bottom: -3.5625em;}
.our_advantage .circle i::before{box-shadow: 1.125em 1.875em 3.125em rgba(46, 101, 243,.35);}
.our_advantage .number-items{padding: 4.875em 0 4.4375em;display: flex;flex-wrap: wrap;justify-content: space-between;background-color: #f6f9ff;border-radius: 0.9375em;}
.our_advantage .number-item{width: 25%;padding: 0.375em 0% 0.625em;position: relative;text-align: center;}
.our_advantage .number-item::after{content: '';width: 1px;height: calc(100% - 0.75em);background-color: #d3d3d3;position: absolute;bottom: 0;left: 0;opacity: 0;}
.our_advantage .number-item+.number-item::after{opacity: 1;}
.our_advantage .number-item .item-icon{height: 2.375em;display: flex;align-items: center;justify-content: center}
.our_advantage .number-item .item-icon img{max-height: 100%;}
.our_advantage .number-item:hover .item-icon img{animation: shake 0.6s ease-in-out forwards;}
.our_advantage .number-item .item-number{margin: 1.9375em 0 0.6875em;}
.our_advantage .number-item .item-number .item-num{color: #3b70f9;font-size: 3.125em;font-weight: bold;line-height: .8;}
.our_advantage .number-item .item-number .item-text{font-size: 1.625em;color: #343036;display: inline-block;margin-left: .23em;transform: translateY(-.1538em);}
.our_advantage .number-item .item-title{color: #242424;font-size: 1.25em;font-weight: bold;} 
.our_advantage .advantage_info{text-align: center;padding: 5.75em 5% 0;}
.our_advantage .advantage_info .advantage_title{color: #343036;font-size: 2.25em;font-weight: bold;}
.our_advantage .advantage_info .advantage_desc{color: #242424;font-size: 1em;line-height: 2.25;margin-top: 0.875em;}
@keyframes shake {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(20deg); }
    50% { transform: rotate(-20deg); }
    75% { transform: rotate(10deg); }
    100% { transform: rotate(0deg); }
  }

/* our_services */
.our_services{position: relative;padding: 6.1875em 0 6.4375em;background-color: #f6f9ff;font-size: 1em;}
.our_services .title_bar{display: flex;justify-content: space-between;align-items: flex-start;flex-wrap: wrap;}
.our_services .title_bar .title{color: #343036;font-weight: bold;font-size: 2.25em;line-height: 1;padding-bottom: .611em;position: relative;margin-top: .25em;}
.our_services .title_bar .title::after{content: '';width: 2.833em;height: 1px;background-color: #21e571;position: absolute;bottom: 0;left: 0;transition: all .35s ease;}
.our_services .title_bar .title:hover::after{width: 100%;}
.our_services .title_bar p{width: 50%;color: #343036;font-size: 1em;line-height: 2.25;}
.our_services .services_wrap{padding: 5em 0 0;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;}
.our_services .services_wrap .tab_nav{width: 36.785%;}
.our_services .tab_nav .nav_item{cursor: pointer;color: #343036;padding: 0.5625em 1.5625em 0.5em;border-radius: 0.9375em;background:linear-gradient(90deg, #ffffff 0%,#ffffff 50%,#2ad871 50%,#2ad871 70%,#3b70f9 100%);background-size: 200% 100%;background-position: 0 0; background-repeat: no-repeat;transition: all .35s ease;}
.our_services .tab_nav .nav_item+.nav_item{margin-top: 0.8125em;}
.our_services .tab_nav .nav_item .item_title{font-size: 1.25em;font-weight: bold;display: flex;flex-wrap: wrap;align-items: center;}
.our_services .tab_nav .nav_item .item_title span{transition: all .35s ease;flex: 1;margin-left: 0.9em;}
.our_services .tab_nav .nav_item .item_icon{position: relative;overflow: hidden;font-size: 0.8em;}
.our_services .tab_nav .nav_item .item_icon img{position: absolute;top: -100%;left: 50%;transform: translateX(-50%);transition: all .35s ease;}
.our_services .tab_nav .nav_item .item_icon img.before{top: 50%;transform: translate(-50%,-50%);}
.our_services .tab_nav .nav_item .item_icon_bg{display: block;width: 3.875em;height: 3.875em;transition: all .35s ease;}
.our_services .tab_nav .nav_item .item_desc{height: 0;color: inherit;font-size: 1em;line-height: 1.625;padding-left: 0.75em;transition: all .35s ease;overflow: hidden;}
.our_services .tab_nav .nav_item.active{color: #ffffff;background-position: 100% 0;padding: 0.875em 1.25em 1.8125em;}
.our_services .tab_nav .nav_item.active .item_title span{margin-left: .4em;}
.our_services .tab_nav .nav_item.active .item_desc{height: auto;}
.our_services .tab_nav .nav_item.active .item_icon_bg{opacity: .25;}
.our_services .tab_nav .nav_item.active .item_icon img.before{top: 100%;transform: translateX(-50%);}
.our_services .tab_nav .nav_item.active .item_icon img.after{top: 50%;transform: translate(-50%,-50%);}
.our_services .services_wrap .tab_pannel{position: relative;width: 50%;}
.our_services .services_wrap .pannel_item {position: absolute;left: 0;top: 0;z-index: 0;opacity: 0;visibility: hidden;width: 100%;-webkit-transition: all ease-in-out .5s;transition: all ease-in-out .5s;height: 0;overflow: hidden;border-radius: 0.9375em;}
.our_services .services_wrap .pannel_item.active {position: relative;top: unset;left: unset;width: 100%;z-index: 1;opacity: 1;visibility: visible;height: auto;}
.our_services .services_wrap .pannel_item img{width: 100%;}

/* middle_banner */
.middle_banner{padding: 7.5625em 0;text-align: center;font-size: 1em;}
.middle_banner .banner_info{color: #ffffff;}
.middle_banner .banner_info h2{font-size: 2.25em;font-weight: bold;}
.middle_banner .banner_info p{font-size: 1.625em;margin-top: .923em;}

/* media_interview */
.media_interview{padding: 8.375em 0 8.9375em;background-color: #f7f9ff;font-size: 1em;}
.media_interview .title{color: #343036;font-weight: bold;font-size: 2.25em;line-height: 1;padding-bottom: .611em;position: relative;text-align: center;}
.media_interview .title::after{content: '';width: 2.83em;height: 1px;background-color: #21e571;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);transition: all .35s ease;}
.media_interview .media_wrap{margin: 3.125em 0 0;display: flex;flex-wrap: wrap;column-gap: 1em;row-gap: 0.875em;}
.media_interview .media_item{width: calc(23% - 0.75em);padding: 0.75em .875em;background:linear-gradient(90deg, #ffffff 0%,#ffffff 50%,#2ad871 50%,rgba(42, 216, 113,.8) 70%,rgba(59, 112, 249,.6) 100%);background-size: 200% 100%;background-position: 0 0; background-repeat: no-repeat;transition: all .35s ease;border-radius: .3125em;height: 5.4375em;display: flex;align-items: center;}
.media_interview .media_item:hover{background-position: 100% 0;}
.media_interview .media_item .item_inner{display: flex;align-items: center;justify-content: space-between;width: 100%;}
.media_interview .media_item .item_title{color: #343036;font-size: 1em;line-height: 1.375;flex: 1;margin-right: 0.625em;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;transition: all .35s ease;}
.media_interview .media_item:hover .item_title{color: #ffffff;}
.media_interview .media_item .item_img{max-width: 7.3125em;}
.media_interview .media_item .item_img img{max-height: 3.5em;}
.circle i::before {
    content: '';
    animation: ease-in-out infinite, linear infinite;
    background: url(img/circle.png) no-repeat center center ;
    background-size: cover;
    box-shadow: 16px 16px 65px rgba(49, 106, 252, .6);
    animation-name: radius-1,scale-1;
}
@media screen and (max-width:1900px) {
  .sys_sub_head,.web_main.page_main{font-size: .842vw;}
}

@media screen and (max-width:1080px) {
  .sys_sub_head,.web_main.page_main{font-size: 10px;}
  .index_layer_bg{height: 80%;}
  .index_layer_bg img{height: 100%;object-fit: cover;}
  .index_layer_bg .circle{left: 5%;}

  .our_services .title_bar .title{font-size: 1.8em;}
  .our_services .services_wrap .tab_nav{width: 45%;}
  
  .our_advantage{padding-bottom: 3.5em;}
  .our_advantage .circle{right: 5%;}
  .our_advantage .advantage_info{padding-top: 3.5em;}
  .our_advantage .advantage_info .advantage_title{font-size: 1.8em;}

  .media_interview{padding: 5em 0;}
  .media_interview .title{font-size: 1.8em;}
  .media_interview .media_item{width: calc(33.3% - .67em);}

  .middle_banner{font-size: .8em;}
}

@media screen and (max-width:768px) {
  .our_advantage .number-item{width: 50%;margin: 1em 0;}
  .our_advantage .number-items{padding: 2em 0;}
  .our_advantage .number-item+.number-item::after{opacity: 0;}
  .our_advantage .number-item:nth-child(2n)::after{opacity: 1;}

  .media_interview .media_item{width: calc(50% - .5em);}
}
@media screen and (max-width:640px) {
  .our_services{padding: 4em 1em;}
  .our_services .title_bar p{width: 100%;margin: 1em 0;}
  .our_services .services_wrap{padding: 1em 0 0;}
  .our_services .services_wrap .tab_nav{width: 100%;}
  .our_services .services_wrap .tab_pannel{width: 100%;margin: 2em 0 0;}
  
  .middle_banner{padding: 5em 0;}
}

@media screen and (max-width:480px) {
  .index_layer_hd .btn_group .btn{margin: 0.3125em .6em;padding: .8em 2.5em;}
  .index_layer_hd .layer_img img{max-width: 80%;}
  .index_layer_hd .layer_title_wrap{font-size: 2.5em;}
  .index_layer_hd strong{font-size: 1.6em;}

  .our_advantage .number-item .item-number .item-num{font-size: 2.8em;}

}

@media screen and (max-width:420px) {
  .media_interview .media_item{width: 100%;}
}

@media screen and (max-width:360px) {
  .our_advantage .number-item{width: 100%;}
  .our_advantage .number-item:nth-child(2n)::after{opacity: 0;}
}