/* 整体滚动条容器 */

body{
      background:#f5f8ff;
}
.field-banner{
    width:100%;
    
    background:url(imgs/field_bannerbg.jpg) top center repeat-x;
    

}

.field-banner .field-banner-bg{
    width:100%;
    height:auto;
   
}


.field-banner .banner_bg{
    width: 100%;
    min-height:50rem;
    background:url(imgs/field_bannerbg.jpg) top center no-repeat;
    
}

.field-banner .field-banner_content{
    position:relative;
    height:500px
}


.field-banner .field-banner_content2{
    position:absolute;
    top:45%;
    left:50%;
    transform: translateX(-50%);
    width: 120rem;
}
.field-banner .field-banner_title{
   
    font-size:3.6rem;
    line-height: 3.6rem;
    font-weight: 500;
    color:#fff;
    margin-bottom:0;
    letter-spacing: 0.05em;
}

.field-banner .field-banner_subtitle{
    font-size:2.4rem;
    font-weight: 400;
    color:#fff;
    margin:2.3rem 0 0 0;
    line-height: 2.4rem;
    
    letter-spacing: 0.05em;
}

.field-banner .field-banner_line{
    background:url(imgs/line3.png) left top no-repeat;
    width:5rem;
    height:0.4rem;
    margin:3.9rem 0 0 0;
    
}

  .field{
        
        padding:0 0 0 0;
        background:#fff;
      
       
    }


    .field .position{
        font-size:1.4rem;
        color:#898989;
        line-height:2.4rem;
        letter-spacing: 0.05em;
    }

    .field .position>span{
        display: inline-block;
        margin:0 0.7rem;
    }

    .field .position a,.field .position a:link,.field .position a:visited{
        color:#898989;
    }

.field .menubg{
    width: 100%;
    background:#FBF9FA;
}
.field .menu{
   
    width: 100%;
    
    list-style: none;
    display: flex;
    background-color: #FBF9FA;
    border-bottom: 1px solid #E9E9E9;
    margin:0;
    padding:0;
}
.field .menu li{
    display: flex;
    align-items: center;
    justify-content: space-between;
    
    /*padding: 0 1.9277vw;*/
    min-width: 30rem;
    width:25%;
    
}
.field .menu li a::after {
    content: '';
    width: 0;
    position: absolute;
    height: 3px;
    background: #0F62FE;
    border-radius: 2px;
    bottom: 0;
    left: 0;
}
.field .menu li.on a::after {
    width: 100%;
}
.field .menu li.on{
    background-color: #fff;
}

.field .menu li a{
    font-size:1.4rem;
    color: #000000;
    line-height: 6rem;
    color: #000000;
    position: relative;
    
    text-align: center;
    display: block;
    width: 100%;
   
}
.field .menu li.on a{
    color: #fff;
    font-weight: 500;
    background: #0F62FE;
}
.field .menu li a:hover{
    color:#2b44e9;
}

.field .menu li.on a:hover{
    color: #f4b719;
   
}


.field .bg{
    background: url(imgs/field_bg.jpg) center center no-repeat;
    background-size:cover;
    min-height: 101.3rem;
    padding:3rem 0 10rem 0;
}

.field .content{
    margin:7.8rem 0 0 0;
    display: flex;
    flex-direction: column;
}


.field .content .content-top{
    display: flex;
}

.field .content .content-top .content-top_left{
    width:calc(50% - 0.5rem);
    flex: 0 0 calc(50% - 0.5rem);
}

.field .content .content-top .content-top_left h3{
    color:#383838;
    font-size:3.6rem;
    line-height:3.6rem;
    height:4rem;
    margin:0;

}

.field .content .content-top .content-top_left h3 img{
    margin:-1.5rem 1.2rem 0 0;
}
.field .content .content-top .content-top_left .subtitle{
    color:#383838;
    font-size:3.6rem;
    line-height: 3.6rem;
    margin:1.5rem 0 0 0;
    
}

.field .content .content-top .content-top_right{
    width:calc(50% + 0.5rem);
    flex: 0 0 calc(50% + 0.5rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.field .content .content-top .content-top_right p{
   font-size: 1.4rem;
   line-height: 2.1rem;
   color: #383838;
   margin:0.2rem 0 0 0;
   letter-spacing: 0.02em;
}
.field .content .content1{
    margin-top:8.6rem;
}
.field .content h4{
    font-size:2.4rem;
    line-height: 2.4rem;
    height:2.4rem;
    color:#383838;
    font-weight: 400;
    letter-spacing: 0.05em;
    margin:0 0 0 0.1rem;
    border-left:4px solid #2b44e9;
    padding:0 0 0 1rem;
}

.field .content .desc{
    font-size:1.4rem;
    line-height: 2.1rem;
    color:#383838;
    font-weight: 400;
    letter-spacing: 0.05em;
    margin:1.4rem 0 0 0;
   
}

.field .content .imagelist{
    display: flex;
    margin:3rem 0 0 0;
}

.field .content .imagelist .img{
    margin-right:1.65rem;
    width:calc((100% - 3.3rem) / 3);
    flex:0 0 calc((100% - 3.3rem) / 3);
    border-radius: 1.6rem;
    overflow: hidden;
}
.field .content .imagelist .img:nth-child(3){
    margin-right:0;
}


.field .content .content2{
    margin-top:8.6rem;
}

.field .content .content3{
    margin-top:8.6rem;
}


.field .content .more{
    
    padding-left:0.2rem; 
    margin:8.2rem 0 0 0;   
}
.field .content .more a{
    height:3.2rem;
    line-height:3.2rem;
    color:#383838;
    font-size:2rem;
    transition: all 0.5s;
    display: inline-block;
    cursor: pointer;
}

.field .content .more a:hover{
	background: #ffe403;
	color: #000;
	padding-left:24px;
	
	border-radius: 50px;
	
}

.field .content .more a span {
    width: 3.2rem;
    height: 3.2rem;
    background: url(imgs/field_more_icon.png) center center no-repeat;
    background-size: cover;
    display: inline-block;
    margin-left: 0.9rem;
    position: relative;
   
    vertical-align: top;
}

.technical{
    background:#f7f7ff;
    min-height: 80rem;
    padding:10.2rem 0 10rem 0;
   
}

.technical h3{
    font-size:3.6rem;
    line-height: 3.6rem;
    margin:0;
    color:#3c3c3c;
    text-align: center;
    letter-spacing: 0.05em;
} 
.technical .info>.desc{
    font-size: 2.4rem;
}
.technical .desc{
    font-size:1.4rem;
    line-height: 2.4rem;
    margin:1.2rem 0 0 0;
    color:#3c3c3c;
    text-align: center;
    letter-spacing: 0.05em;
} 
.technical .content{
    margin:2.5rem 0 0 0;
    position:relative;
}
.technical .content .bg{
    position: relative;
    width: 100%;
    height: auto;
}

.technical .content .category{
    display: flex;
    justify-content:center;
    width:12.5rem;
    position:absolute;
    flex-wrap: wrap;
}


.technical .content .category .title{
    flex:0 0 100%;
    font-size:2rem;
    line-height: 2rem;
    color:#383838;
    margin:2.2rem 0 0 0;
    text-align: center;
    font-weight: 500;
}

.technical .content .category1,.technical .content .category3{
    left:11.9%;
   
}
.technical .content .category2,.technical .content .category4{
    right:11.9%;
}

.technical .content .category1,.technical .content .category2{
    top:13.1%;
}
.technical .content .category3,.technical .content .category4{
    top:57.9%;
}

.technical .content .feature{
    
   width: 100%;
    position:absolute;
  
}

.technical .content .feature .title{
    font-size:2rem;
    margin:0;
    line-height: 2rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-align: center;
    
}

.technical .content .feature .desc{
    margin:0.8rem 0 0 0;
}

.technical .content .feature1{
    top:16.5%
}

.technical .content .feature2{
    top:39.6%
}

.technical .content .feature3{
    top:63.3%
}

.keyprogress{
    background:#fff;
   
    padding:7.8rem 0 10rem 0;
   
   
}

.keyprogress .info h3{
    font-size:3.6rem;
    line-height: 3.6rem;
    margin:0;
    color:#383838;
    text-align: center;
    letter-spacing: 0.05em;
} 

.keyprogress .progress_list{
    list-style: none;
    padding:7.7rem 0 0 0;
    max-width: 100rem;
    margin:0 auto;
}
.keyprogress .progress_list li{
    display: flex;
    min-height: 17rem;
    
    align-items: stretch; 
    position:relative;
}

.keyprogress .progress_list li .content{
    display: flex;
    width:calc(100% - 2px);
}

.keyprogress .progress_list li .line{
    width:2px;
    
    background:#f8f8f8;
    flex-shrink: 0;
    margin:0 3.2rem 0 0;
}

.keyprogress .progress_list li:first-child .line{
    width:2px;
    
    background:#f8f8f8;
    flex-shrink: 0;
    margin:1rem 3.2rem 0 0;
}

.keyprogress .progress_list li .dot{
    width:10px;
    height:10px;
    position:absolute;
    background:#2b44e9;
    border-radius: 5px;
    top:6px;
    left:-4px;
}

.keyprogress .progress_list li:last-child .line{
    width:2px;
   
    background: linear-gradient(to bottom, #f8f8f8 10px, transparent);
    flex-shrink: 0;
}

.keyprogress .progress_list li .time{
    font-size:1.4rem;
    line-height: 2.4rem;
    color:#383838;
    margin:0 5rem 0 0;
}

.keyprogress .progress_list li .title{
    font-size:2.4rem;
    line-height: 2.4rem;
    color:#383838;
    margin:0;
    max-width: 53rem;
}

.keyprogress .progress_list li img{
    width:29.5rem;
    height:12rem;
    margin-left:auto;
    margin-top:-4rem;
}

@media (max-width: 1439.98px) {
  
}


@media (max-width: 1199.98px) {
    .container{
        padding:0 15px;
    }
    
    html { 
        font-size: 50%; 
    }
   
    .position.row{
        flex-direction: row;
    }

   

   

    
}  


@media (max-width: 991.98px) { 
    html { 
        font-size: 62.5%; 
    }

    .container{
        padding:0 2.5rem;
    }

    .field-banner{
       
    }


     .field-banner .banner-img{
        width:100%;
        height:auto;
     }

    .field-banner .field-banner-bg{
        display: none;
    }
    .field-banner .field-banner_content{
        height:auto;
    }


    .field-banner .field-banner_content2{
        width: 90%;
        top:12.5rem;
        left:10%;
        transform: translateX(0);
    }

     .field .menubg .container{
        padding: 0;
    }

    .field .menu{
        flex-wrap: nowrap;
        overflow-x: scroll;
    }

   

    .field .menu li{
       
        min-width: auto;
        width:50%;
        height:4.8rem;
        flex:0 0 50%;
        
    }
     .field .menu li a{
        font-size:2rem;
        line-height: 4.8rem;
     } 

    .field .content .content-top{
        flex-direction:column;
    }


    .field .content .content-top .content-top_left{
        width:100%;
        flex: 0 0 100%;
    }

    .field .content .content-top .content-top_right{
        width:100%;
        flex: 0 0 100%;
        margin:1rem 0 0 0;
    }

    .field .content .imagelist{
        flex-direction: column;
    }
   

    .field .content .imagelist .img{
        margin: 1rem 0 0 0;
        width:100%;
        flex:0 0 100%;
    }
   

    .technical .content{
        display: flex;
        flex-wrap: wrap;
    }

    .technical .content .bg{
        display: none;
    }
    .technical .content .category{

        position:static;
        height:10rem;
        width: 50%;
        flex: 0 0 50%;
        margin:2rem 0 0 0;
        display: flex;
        flex-direction: row;
        justify-content: center;  /* 垂直居中（主轴） */
  align-items: center;      /* 水平居中（交叉轴） */
        
    }


    .technical .content .feature{
        position: static;
        margin:2rem 0 0 0;
        
    }
    .technical .content .feature1{
        margin:5rem 0 0 0;
    }

    
    .keyprogress .progress_list li .content{
       flex-direction: column;
       margin:0 0 3rem 0;
    }

    .keyprogress .progress_list li .content .title{
        margin:1rem 0 0 0;
    }
     .keyprogress .progress_list li .content img{
        margin:3rem 0 0 0;
     }
  
  

 }


@media (max-width: 767.98px) { 
    
 }

@media (max-width: 575.98px) { 
   

    
   
 }







