body {
     margin: 0;
     padding: 0;
     font-size: 14px;
     color: #333;
 }

 .header {

     background: linear-gradient(to right bottom, rgb(247, 247, 247), rgb(244, 248, 255));

 }

 .header .line {
     width: 100%;
     height: 6px;
     background: linear-gradient(to right bottom, rgb(48, 120, 255), rgb(14, 155, 113));
 }

 .header .box {
     margin: 0 auto;
     width: 1000px;
     display: flex;
     justify-content: space-between;
 }

 .header .box .logo-box {
     display: flex;
     align-items: center;
     color: #999;
 }

 .header .box .logo {
     background: url('./images/logo.png') no-repeat;
     background-size: contain;
     width: 200px;
     height: 88px;
 }

 .header .box .menu {
     display: flex;
 }

 .header .box .menu .item {
     width: 60px;
     padding: 20px;

     display: flex;
     align-items: center;
     justify-content: center;
     color: rgb(90, 106, 112);

 }

 .header .box .menu .item.active {
     background: rgb(226, 234, 240);
     color: rgb(0, 178, 248);
     font-weight: 16px;
     font-weight: bold;

 }

 .banner {
     height: 250px;
     background: url('./images/probanner.jpg') no-repeat;
     background-size: cover;
 }

 .content {
     margin: 0 auto;
     width: 1000px;
 }

 .content .title {
     padding: 20px 0;
     font-size: 24px;
     border-bottom: 1px solid #e6ecf7;
     color: rgb(0, 140, 255);

 }

 .content .title2 {
     padding: 20px 0;
     font-size: 18px;
     color: rgb(56, 65, 71);

 }

 .content .title3 {
     padding: 20px 0;
     font-size: 14px;
     color: rgb(56, 65, 71);
     font-weight: bold;

 }

 .content .box {
     font-size: 14px;
     color: rgb(114, 114, 114);
     line-height: 1.8;
 }

 .content .img {
     display: flex;
     justify-content: center;
 }

 .footer {
     margin-top: 100px;

     background: linear-gradient(to right bottom, rgb(48, 120, 255), rgb(14, 155, 113));
 }

 .footer .box {
     height: 150px;
     display: flex;
     justify-content: center;
     align-items: center;
     color: #fff;
 }