.con1 {background-image: url(../img/sub_title_bg1.webp); background-size: cover; background-position: 50% 50%; height: auto !important; max-height: none !important; min-height: 0 !important; display: block;}
.con1 .box {width: 1100px; margin: 0 auto; text-align: center; padding: 90px 0; color: #fff;}
.con1 .box div img {width: 128px;}
.con1 .box h1 {font-weight: 300; font-size: 2.1rem; margin-bottom: 30px;}
.con1 .box h1 b {color: #ff6a00;}
.con1 .box a {color: #fff}
.product-img {text-align: center;}
.con2 {background: #fff;}
.con2 .box {width: 1100px; margin: 0 auto; padding: 100px 0 0;}
.con2 .box p {font-size: 1.156rem; font-weight: 300; line-height: 32px; text-align: justify; margin-top: 30px;}
.con3 {background: #fff;}
.con3 .box {width: 1100px; margin: 0 auto;}
.list-box span {color: #0066ff; font-weight: 400;}
.con3 .box .list-box ul {display: flex; flex-wrap: wrap; margin: 30px 0;}
.con3 .box .list-box ul li {width: 25%; text-align: center; padding: 30px 0;}
.con3 .box .list-box ul li .icon {width: 97px; height: 97px; display: flex; margin: 0 auto;}
.con3 .box .list-box ul li:nth-child(1) .icon {background: url(../img/kuipernet_cloud/img1.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(2) .icon {background: url(../img/kuipernet_cloud/img3.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(3) .icon {background: url(../img/kuipernet_cloud/img4.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(4) .icon {background: url(../img/kuipernet_cloud/img5.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(5) .icon {background: url(../img/kuipernet_cloud/img6.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(6) .icon {background: url(../img/kuipernet_cloud/img7.webp) no-repeat;}
.con3 .box .list-box ul li:nth-child(7) .icon {background: url(../img/kuipernet_cloud/img2.webp) no-repeat;}
.con3 .box .list-box ul li p {font-size: 1.156rem; font-weight: 300;}
.con4 {background: #f7f7ff;}
.con4 .box {width: 1100px; margin: 0 auto; padding: 70px 0;}
.function-list {display: flex; margin-top: 30px;}
.function-list ul {flex: 1;}
.function-list ul li p {font-size: 1.156rem; letter-spacing: -1px;}
.function-list ul li p i {font-weight: 600; color: #ff6a00; margin-right: 6px;}
.function-list ul li p span {font-weight: 300; line-height: 32px;}
.con5 {background: #fff;}
.con5 > .box {width: 1100px; margin: 0 auto; padding: 70px 0;}
.diagram .box {display: flex; flex-direction: column; margin-top: 30px;}
.diagram .box > div {display: flex; align-items: center; margin: 0 0 60px; padding: 0 0 60px; border-bottom: 1px solid #e5e5e5;}
.diagram .box > div:last-child {margin: 0; border: 0;}
.diagram .box > div:nth-child(2n) .img {order: 2; margin-left: 80px;}
.diagram .box > div:nth-child(2n) .text {margin-left: 0;}
.diagram .box .text {margin-left: 80px; flex: 1;}
.diagram .box .text h3 {font-weight: 500;}
.diagram .box .text p {text-align: justify; font-weight: 300; font-size: 1.156rem; line-height: 32px; margin-top: 10px;}
.cloud-img {background: url(../img/kuipernet_cloud/cloud_img.webp) no-repeat; width: 378px; height: 207px;}
.idc-img {background: url(../img/kuipernet_cloud/idc_img.webp) no-repeat; width: 378px; height: 207px;}
.saas-img {background: url(../img/kuipernet_cloud/saas_img.webp) no-repeat; width: 378px; height: 207px;}
@media screen and (max-width: 1100px) {
  .con1 {background-position: 70% 50%;}
  .location .box, .con1 .box, .con2 .box, .con4 .box, .con5 > .box {width: 90%;}
  .con2 .box p {margin: 0; font-size: 1rem; width: 100%;}
  .con2 .box > div {width: 100%; flex-direction: column;}
  .con3 .box {width: 100%;}
  .diagram .box {flex-direction: column;}
  .table {overflow-x: auto;}
  .table > ul {width: 1100px;}
  
}
@media screen and (max-width: 768px) {
  .diagram .box > div {flex-direction: column;}
  .diagram .box > div:nth-child(2n) .img {order: 0; margin: 0;}
  .cloud-img, .idc-img, .saas-img {width: 100%; height: 207px; background-position: center center;}
  .diagram .box .text {margin: 30px 0 0; text-align: center;}
  .diagram .box .text p {text-align: center;}
  .product-img img {width: 100%;}
}
@media screen and (max-width: 425px) {
  .con1 .box h3 {font-size: 1.2rem;}
  .function-list {overflow-x: scroll; width: 100%;}
  .function-list ul {width: 70%; flex: none;}
  .function-list ul li p span {font-size: 0.856rem;}
  .con3 .box .list-box ul li p, .diagram .box .text p {font-size: 0.956rem;}
  .cloud-img, .idc-img, .saas-img {width: 100%; height: 157px; background-size: cover;}
}