   /* 宽度为屏宽的一半，高度为屏高的一半，然后居中 */
   .box {
     width: 1435px;
     height: 1067px;
     margin: 0 auto;
   }

   .boxsize {
     margin-top: 30px;
   }

   /* 清除li样式 */
   ul,
   li {
     list-style: none;
   }

   /* 将ul相对定位，目的是让内容的div绝对定位时相对ul定位，否则会相对body定位 */
   /* ul弹性盒，目的是让li横着排，也可以将li浮动或者转行内块 */
   ul {
     position: relative;
     display: flex;
     width: 805px;
     height: 60px;
     justify-content: space-between;
     margin: 65px 0 0 322px;
   }

   /* 将三个li宽度平分，高度60px */
   li {
     flex: 1;
     height: 60px;
   }

   /* input隐藏 */
   input {
     display: none;
   }

   /* 设置input的下一个节点label的样式 */
   input+label {
     display: block;
     width: 211px;
     height: 60px;
     background: #fff;
     font-size: 18px;
     text-align: center;
     line-height: 60px;
     color: #333;
     border: 1px solid #fff;
   }

   /* 设置div内容的基础样式 隐藏内容div*/
   input+label+div {
     display: none;
     position: absolute;
     left: 0;
     top: 60px;
   }

   /* input选中状态时候对应的label的样式 */
   input:checked+label {
     background: rgba(61, 138, 220, 1);
     color: #fff;
     width: 211px;
     height: 60px;
   }

   /* input选中时候显示对应的div */
   input:checked+label+div {
     display: block;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: inherit;
     line-height: 30px;
     margin: 55px 0 0 0px;
     background: #FFFFFF;
     width: 803px;
     height: 774px;
     padding: 60px 120px 1px 120px;
   }

   .img {
     background: url(./img/disanfang.png) 100% no-repeat;
     background-size: 100% 100%;
     margin-top: 100px;
   }

   /* -------------------------------------------------------------------- */
   .wrap {

     margin: 20px auto;

     width: 403px;

     height: 600px;

     border: 1px solid brown;

     position: relative;

   }

   label {

     width: 100px;

     height: 30px;

     float: left;

     text-align: center;

     line-height: 30px;

     border-right: 1px solid brown;

     border-bottom: 1px solid brown;

   }

   label:nth-of-type(4) {

     border-right: none;

   }

   label span {

     cursor: pointer;

   }

   label div {

     width: 403px;

     height: 568px;

     position: absolute;

     left: 0;

     top: 31px;

     background: #eeeeee;

     display: none;

   }

   label input {

     width: 0;

   }

   input:checked+div {

     display: block;

   }

   .dropdown {

     position: relative;

     display: inline-block;
     color: rgba(0, 0, 0, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     margin: 31px 0 0 0px;
   }

   .dropdown-content {

     display: none;

     position: absolute;

     background-color: #f9f9f9;

     min-width: 160px;

     box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);

     padding: 12px 16px;

     z-index: 1;

   }

   .dropdown:hover .dropdown-content {

     display: block;

   }


   .page {
     background-color: rgba(250, 250, 250, 1);
     position: relative;
     width: 1435px;
     height: 1421px;
     overflow: hidden;
   }

   .dropdown:hover .dropdown-content {

     display: block;

   }

   .box_1 {
     position: relative;
     width: 1483px;
     height: 123px;
     background: url(./img/MasterDDSSlicePNG44333d93e09a80bc83b39279b31c0117.png) 100% no-repeat;
     background-size: 100% 100%;
     justify-content: flex-center;
     margin: -28px 0 0 -21px;
   }

   .block_1 {
     height: 60px;
     background: url(./img/MasterDDSSlicePNG2da668eb2248d39c40ee233d866a0607.png) 100% no-repeat;
     background-size: 100% 100%;
     width: 48px;
     margin: 39px 0 0 243px;
   }

   .box_2 {
     width: 48px;
     height: 60px;
     background: url(./img/MasterDDSSlicePNGadfabd74ed9cb244335b245ff68e3cfc.png) 100% no-repeat;
     background-size: 100% 100%;
   }

   .block_2 {
     width: 77px;
     height: 36px;
     margin: 52px 0 0 12px;
   }

   .group_1 {
     width: 77px;
     height: 22px;
   }

   .box_3 {
     width: 23px;
     height: 22px;
   }

   .box_4 {
     width: 23px;
     height: 21px;
     background: url(./img/MasterDDSSlicePNG77f344e8cf076b4906d89b3e32dc87c5.png) 100% no-repeat;
     background-size: 100% 100%;
     margin-left: 3px;
   }

   .box_5 {
     width: 23px;
     height: 22px;
     background: url(./img/MasterDDSSlicePNG397d63e3301e711509c258fc01d6220c.png) 100% no-repeat;
     background-size: 100% 100%;
     margin-left: 5px;
   }

   .text_1 {
     width: 63px;
     height: 13px;
     overflow-wrap: break-word;
     color: rgba(249, 172, 59, 1);
     font-size: 12px;
     letter-spacing: 9.899999618530273px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin: 1px 0 0 1px;
   }

   .text_2 {
     width: 36px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 60px 0 0 499px;
   }

   .text_3 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(61, 138, 220, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 60px 0 0 37px;
   }

   .text_4 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 60px 0 0 36px;
   }

   .text_5 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 60px 0px 0 37px;
   }

   .qwe {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 60px 242px 0 37px;
   }

   .block_3 {
     position: absolute;
     left: 243px;
     top: 39px;
     width: 138px;
     height: 60px;
   }

   .box_6 {
     height: 60px;
     background: url(./img/MasterDDSSlicePNGf8c4f4044d231d79c6b8f0e9936cfe1f.png) 100% no-repeat;
     background-size: 100% 100%;
     width: 48px;
   }

   .group_2 {
     width: 48px;
     height: 60px;
     background: url(./img/MasterDDSSlicePNG36810dba04109deff4b42d7557571455.png) 100% no-repeat;
     background-size: 100% 100%;
   }

   .box_7 {
     width: 77px;
     height: 36px;
     margin: 13px 1px 0 12px;
   }

   .block_4 {
     width: 77px;
     height: 22px;
   }

   .box_8 {
     width: 23px;
     height: 22px;
     background: url(./img/che.png) 100% no-repeat;
   }

   .box_9 {
     width: 23px;
     height: 21px;
     background: url(./img/MasterDDSSlicePNGe14b935c73e8dcab3431fe392255ea88.png) 100% no-repeat;
     background-size: 100% 100%;
     margin-left: 3px;
   }

   .box_10 {
     width: 23px;
     height: 22px;
     background: url(./img/MasterDDSSlicePNGa3ffeb6d59dcebb4bd6d96790f581d08.png) 100% no-repeat;
     background-size: 100% 100%;
     margin-left: 5px;
   }

   .text_6 {
     width: 63px;
     height: 13px;
     overflow-wrap: break-word;
     color: rgba(249, 172, 59, 1);
     font-size: 12px;
     letter-spacing: 9.899999618530273px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin: 1px 0 0 1px;
   }

   .box_11 {
     width: 1435px;
     height: 1067px;
   }

   .text_7 {
     width: 128px;
     height: 32px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 32px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 32px;
     margin: 67px 0 0 656px;
   }

   .box_12 {
     background-color: rgba(61, 138, 220, 1);
     width: 80px;
     height: 3px;
     margin: 20px 0 0 680px;
   }

   .list_1 {
     width: 805px;
     height: 60px;
     justify-content: space-between;
     margin: 65px 0 0 322px;
   }

   .text-wrapper_1-0 {
     height: 60px;
     background-size: 100% 100%;
     margin-right: 86px;
     width: 211px;
     background: url(./img/MasterDDSSlicePNGe3239f67e5fe3597e7bf66e176216242.png) 100% no-repeat;
   }

   .text_8-0 {
     width: 47px;
     height: 18px;
     overflow-wrap: break-word;
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 22px 0 0 61px;
     color: rgba(255, 255, 255, 1);
   }

   .text-wrapper_1-1 {
     height: 60px;
     background-size: 100% 100%;
     margin-right: 86px;
     width: 211px;
     background: url(./img/MasterDDSSlicePNG457b11da4cd4f9d106d12af4d6be4d79.png) 100% no-repeat;
   }

   .text_8-1 {
     width: 47px;
     height: 18px;
     overflow-wrap: break-word;
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 22px 0 0 27px;
     color: rgba(0, 0, 0, 1);
   }

   .text-wrapper_1-2 {
     height: 60px;
     background-size: 100% 100%;
     margin-right: 86px;
     width: 211px;
     background: url(./img/MasterDDSSlicePNG457b11da4cd4f9d106d12af4d6be4d79.png) 100% no-repeat;
   }

   .text_8-2 {
     width: 47px;
     height: 18px;
     overflow-wrap: break-word;
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin: 22px 0 0 66px;
     color: rgba(0, 0, 0, 1);
   }

   .box_13 {
     background-color: rgba(255, 255, 255, 1);
     width: 803px;
     height: 767px;
     margin: 52px 0 1px 323px;
   }

   .text_9 {
     width: 560px;
     height: 300px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: inherit;
     line-height: 30px;
     margin: 86px 0 0 122px;
   }

   .text_10 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_11 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_12 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 29px 0 0 122px;
   }

   .text_13 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_14 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_15 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 29px 0 0 122px;
   }

   .text_16 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_17 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_18 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 29px 0 0 122px;
   }

   .text_19 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .text_20 {
     width: 560px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(0, 0, 0, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
     margin: 13px 0 0 122px;
   }

   .section_1 {
     width: 555px;
     height: 220px;
     background: url(./img/disanfang.png) 100% no-repeat;
     background-size: 100% 100%;
     margin: 71px 0 31px 124px;
   }

   .box_14 {
     background-color: rgba(50, 59, 68, 1);
     height: 260px;
     width: 1440px;
     margin: -1px 0 0 -5px;
   }

   .text-wrapper_2 {
     width: 913px;
     height: 18px;
     margin: 52px 0 0 221px;
   }

   .text_21 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(230, 230, 230, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
   }

   .text_22 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(230, 230, 230, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin-left: 201px;
   }

   .text_23 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(230, 230, 230, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin-left: 207px;
   }

   .text_24 {
     width: 72px;
     height: 18px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 18px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 18px;
     margin-left: 217px;
   }

   .block_5 {
     width: 944px;
     height: 100px;
     margin: 12px 0 0 221px;
   }

   .text-wrapper_3 {
     width: 180px;
     height: 75px;
     margin-top: 1px;
   }

   .text_25 {
     width: 180px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
   }

   .text_26 {
     width: 180px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .text_27 {
     width: 180px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .text_28 {
     width: 180px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .text-wrapper_4 {
     width: 147px;
     height: 75px;
     margin-left: 94px;
   }

   .text_29 {
     width: 147px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
   }

   .text_30 {
     width: 147px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .text_31 {
     width: 147px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .text_32 {
     width: 147px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 9px;
   }

   .section_2 {
     width: 133px;
     height: 35px;
     margin-left: 131px;
   }

   .image-text_1 {
     width: 98px;
     height: 12px;
   }

   .thumbnail_1 {
     width: 10px;
     height: 10px;
   }

   .text-group_1 {
     width: 83px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
   }

   .image-text_2 {
     width: 133px;
     height: 13px;
     margin-top: 10px;
   }

   .thumbnail_2 {
     width: 13px;
     height: 11px;
   }

   .text-group_2 {
     width: 115px;
     height: 12px;
     overflow-wrap: break-word;
     color: rgba(201, 201, 201, 1);
     font-size: 12px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 12px;
     margin-top: 1px;
   }

   .image_1 {
     width: 100px;
     height: 100px;
     margin-left: 159px;
   }

   .text-wrapper_5 {
     width: 509px;
     height: 14px;
     margin: 38px 0 26px 447px;
   }

   .text_33 {
     width: 509px;
     height: 14px;
     overflow-wrap: break-word;
     color: rgba(153, 153, 153, 1);
     font-size: 14px;
     font-family: Source Han Sans CN-Regular;
     text-align: left;
     white-space: nowrap;
     line-height: 14px;
   }