img {
    border: none;
}

@media screen and (min-width: 750px) {
    .cleaning-pc{
        display: block;
    }
    .cleaning-m{
        display: none;
    }
    .clearning section {
        display: flex;
        position: relative;
        flex-direction: row;
        justify-content: center;
        background-color: white;
    }
    .clearning .effortless{
        background-color: #F6F8F9;
    }
    .clearning .bg-black {
        padding: 30px auto 70px;
    }

    .clearning .containerxxx {
        box-sizing: border-box;
        position: relative;
        min-width: 1300px;
        /* 两边留个最小边距 */
    }


    /* 每个secion 的 第一子容器 用于统一设置宽度*/
    .clearning .main-container {
        min-width: 1200px;
    }
    .banner-container{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding-left: 120px;
        margin-top: -80px;
    }

    .banner-container img {
        width: 360px;
        height: auto;
        margin-bottom: 20px;
    }

    .banner-container h1 {
        font-size: 60px;
        font-weight: 600;
        color: #000;
        line-height: 150%;
        margin-bottom: 52px;
    }
    .banner-container h1 span{
        font-size: 36px;
        font-weight: 100;
    }

    .banner-container .btn {
        background: #fff;
        color: #25B4C3;
        padding: 10px 24px;
        border-radius: 24px;
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;
        cursor: pointer;
        transition: background-color 0.3s;
    }
    /* 顶部 */
    .banner {
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        height: 800px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* */

    .clearning .top2-container {
        /* height: 931px; */
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding-top: 150px;
        min-width: 1200px;
    }

    .clearning .top2-container .robot-box {
        min-width: 480px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        /* margin-right: -60px; */
        position: relative;
    }

    .clearning .top2-container .robot {
        height: 600px;
        object-fit: cover;
        position: absolute;
    }


    .clearning .top2-container .text-container {
        max-width: 696px;
        font-size: 18px;
        font-weight: 400;
        line-height: 200%;
    }
    .clearning .top2-container .text-container .title{
        width: 100%;
        font-size: 18px;
    }
    .clearning .top2-container .text-container .title span{
        font-size: 36px;
        font-weight: 600;
    }

    .clearning .top2-container .text-container .bottom-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 32px;
        margin-top: 60px;
    }

    .clearning .top2-container .text-container .bottom-container .list-item {
        list-style: none;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .clearning .top2-container .text-container .bottom-container .list-item img {
        width: 80px;
        height: 80px;
    }

    .clearning .top2-container .text-container .bottom-container .list-item .text {
        font-size: 16px;
        color: #333;
    }

    /* top5-container */
    .clearning .top5-container {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: 100%;
    }

    .clearning section .clearning-body {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        height:100%;
    }

    .clearning .top5-container>.title {
        font-size: 54px;
        font-weight: 600;
        text-align: center;
        color: #ffffff;
        line-height: 75px;
        margin-top: 180px;
    }

    .clearning .top5-container .list-container {
        margin-top: 72px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-left: 220px;
        margin-bottom:180px;
    }

    .ar .clearning .top5-container .list-container {
        margin-left: 0;
        margin-right: 220px;
    }


    .clearning .top5-container .row-container {
        opacity: 0.8;
        font-size: 24px;
        font-weight: 400;
        text-align: left;
        color: #ffffff;
        line-height: 60px;
        display: flex;
        flex-direction: row;
    }

    .ar .clearning .top5-container .row-container {
        text-align: right;
    }

    .clearning .top5-container .row-container .title {
        width: 345px;
    }

    .clearning .top5-container .row-container .content {
        margin-left: 86px;
        width: 629px;
    }

    .ar .clearning .top5-container .row-container .content {
        margin-right: 86px;
        margin-left: 0;
        text-align: right;
    }

    /* 表单模块 */
    .clearning .form-container {
        margin:80px auto;
    }

    #box {
        width: 480px;
        height: 360px;
    }

    #spritespin {
        width: 480px;
        height: 320px !important;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: cover;
        background-size: cover;
    }

    #sprites_btns {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-radius: 27px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        width: 190px;
        padding: 6px 8px;
        margin: 0 auto;
        margin-top: -20px;
        position: relative;
        z-index: 999;
    }

    .ar #sprites_btns {
        flex-direction: row-reverse;
    }

    #rotate-middle,
    #rotate-loading {
        margin: 0px 24px;
        opacity: 1;
    }

    #rotate-middle {
        display: none;
    }

    #rotate-left {
        background: url('https://www.orionstar.com/res/orics/down/ow001_20240428_8656f3d1ed116f115491f5f431d076cc.png') center no-repeat;
        background-size: contain;
    }

    #rotate-middle {
        background: url('https://www.orionstar.com/res/orics/down/ow001_20240430_dc5353e13eac841e55401c266797a886.png') center no-repeat;
        background-size: contain;
    }

    #rotate-loading {
        background: url('https://r.cmcm.com/r/9570092031f911ef9b66553e354eb148.gif') center no-repeat;
        background-size: contain;
    }

    #rotate-right {
        background: url('https://www.orionstar.com/res/orics/down/ow001_20240428_967434711902b8385b6da937ee38d17d.png') center no-repeat;
        background-size: contain;
    }

    #rotate-left,
    #rotate-right,
    #rotate-middle,
    #rotate-loading {
        width: 32px;
        height: 32px;
        cursor: pointer;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        opacity: 0.3;
        -webkit-user-select: none;
        /* Chrome all / Safari all */
        -moz-user-select: none;
        /* Firefox all */
        -ms-user-select: none;
        /* IE 10+ */
        user-select: none;
    }

    /* Product Highlights Section */
    .product-highlights {
        padding: 160px 0;
        background: #fff;
    }

    .product-highlights .main-container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .product-highlights h2 {
        font-size: 54px;
        font-weight: 600;
        text-align: center;
        color: #000;
        line-height: 1.2;
        color:#29648A;
        margin-bottom: 80px;
    }

    .product-highlights .highlights-container {
        m-width: 1200px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
    }

    .product-highlights .highlight-item {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
        border: solid 1px #DEDEDE;
        border-radius: 24px;
        padding: 32px 24px;
        cursor: pointer;
    }

    .product-highlights .highlight-item h3 {
        font-size: 18px;
        font-weight: 600;
        color: #000;
        margin: 16px 0;
        align-self: center;
        text-align: center;
    }

    .product-highlights .highlight-item ul {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .product-highlights .highlight-item li {
        font-size: 14px;
        color: #666;
        line-height: 1.6;
        margin-bottom: 10px;
        padding-left: 20px;
        position: relative;
    }

    .product-highlights .highlight-item li::before {
        content: "•";
        position: absolute;
        left: 8px;
        color: #666;
    }

    .product-highlights .highlight-item img {
        width: 90px;
        height: 90px;
        align-self: center;
    }

    .product-highlights .more-excellence {
        font-size: 18px;
        color: #000;
        margin-top: 60px;
        font-weight: 500;
        padding: 12px 24px;
        border: solid 1px #DEDEDE;
        border-radius: 24px;
       cursor: pointer;
    }
    .banner2{
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        height: 840px;
    }
    .banner2-container{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .banner2-title{
        font-size: 54px;
        font-weight: 600;
    }
    .banner2-desc{
        max-width: 540px;
        font-size: 18px;
        margin-top: 24px;
        line-height: 2.0;
    }

    .superior, .effortless {
        padding-top: 120px;
        background: #fff;
    }
    
    .superior .main-container,
    .effortless .main-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }

    .superior h3,
    .effortless h3 {
        font-size: 54px;
        font-weight: 600;
        text-align: center;
        margin-bottom: 30px;
    }

    .superior > div > div,
    .effortless > div > div {
        font-size: 18px;
        line-height: 1.6;
        color: #666;
        text-align: center;
        max-width: 1200px;
        margin: 0 auto 60px;
    }

    .superior table {
        width: 100%;
        border-collapse: collapse;
        margin: 90px 0;
    }
    .superior table tr{
        border-bottom: solid 1px #E5E5E5;
    }
    .superior table th,
    .superior table td {
        padding: 20px 15px;
        text-align: center;
        vertical-align: middle;
    }

    .superior table th {
        font-weight: 600;
        color: #000;
        font-size: 16px;
        white-space: nowrap;
    }

    .superior table td:first-child {
        font-weight: 600;
        color: #000;
        text-align: center;
    }

    .superior table td:last-child {
        text-align: center;
        max-width: 300px;
    }

    .superior table td img {
        width: 20px;
        height: 20px;
        vertical-align: middle;
        display: inline-block;
    }

    .superior table td {
        height: 80px;
        display: table-cell;
        color: #666;
        font-size: 14px;
    }

    .cleaning-swiper-container {
        width: 100%;
        padding: 0 24px 72px 24px;
        position: relative;
        overflow: hidden;
        box-sizing: border-box;
        cursor: pointer;
    }

    .cleaning-swiper-container .swiper-wrapper {
        display: flex;
        width: 100%;
    }

    .cleaning-swiper-container .swiper-slide {
        width: calc((100% - 24px) / 3);
        margin-right: 12px;
        flex-shrink: 0;
        box-sizing: border-box;
    }

    .cleaning-swiper-container .swiper-slide:nth-child(3n) {
        margin-right: 0;
    }

    .cleaning-swiper-container .slide-content {
        width: 100%;
        position: relative;
    }
    .cleaning-swiper-container img {
        width: 100%;
        height: auto;
        display: block;
    }
    .cleaning-swiper-container .play-icon{
        width: 50px;
        height: 50px;
        position: absolute;
        top: 43%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 10;
        cursor: pointer;
        transition: opacity 0.3s ease;
      }
      
    .cleaning-swiper-container .play-icon:hover {
        opacity: 0.8;
    }
    .cleaning-swiper-container .slide-title {
        text-align: center;
        margin-top: 20px;
        font-size: 16px;
        color: #333;
    }



    .effortless-content {
        display: flex;
        gap: 40px;
        margin-top: 60px;
        align-items: flex-start;
    }

    .video-container {
        flex: 1;
        position: relative;
        background: #f5f5f5;
        border-radius: 12px;
        overflow: hidden;
    }

    .video-container video {
        width: 100%;
        height: auto;
        display: block;
    }

    .tabs-container {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .tab-item {
        border: 2px solid #e5e5e5;
        border-radius: 12px;
        overflow: hidden;
        cursor: pointer;
        transition: all 0.3s ease;
        padding: 32px 24px;
    }

    .tab-item:hover {
        border-color: #25B4C3;
    }

    .tab-item.active{
        border-color: #25B4C3;
    }
    .tab-item.active .tab-header{
        margin-bottom: 16px;
    }


    .tab-header h4 {
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        color: #333;
        text-align: left;
    }

    .tab-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease, padding 0.3s ease;
        text-align: left;
    }

    .tab-item.active .tab-content {
        max-height: 200px;
    }

    .tab-content p {
        margin: 0;
        font-size: 14px;
        line-height: 1.6;
        color: #666;
    }

    /* 视频样式 */
    .cleaning-swiper-container video {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 8px;
        cursor: pointer;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }


    /* 分页指示器样式 */
    .cleaning-swiper-container .swiper-pagination {
        position: relative;
        width: 100%;
        height: auto;
        margin: 40px 0;
        display: flex;
        justify-content: center;
        gap: 20px;
        z-index: 10;
        visibility: visible;
        opacity: 1;
        bottom: auto;
        left: auto;
        transform: none;
    }

    .cleaning-swiper-container .swiper-pagination-bullet {
        width: 80px;
        height: 4px;
        border-radius: 0;
        background-color: rgba(0, 0, 0, 0.3);
        transition: all 0.3s ease;
    }

    .cleaning-swiper-container .swiper-pagination-bullet:hover {
        background-color: #25B4C3;
        transform: scaleY(1.5);
    }

    .cleaning-swiper-container .swiper-pagination-bullet-active {
        background-color: #25B4C3;
        width: 200px;
    }

    .banner3{
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        height: 840px;
        color: #fff;
    }
    .banner3-container{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .banner3-title{
        font-size: 54px;
        font-weight: 600;
    }
    .banner3-desc{
        max-width: 540px;
        font-size: 18px;
        margin-top: 24px;
        line-height: 1.5;
    }
    .banner3-desc li{
        padding-left: 20px;
        position: relative;
        line-height: 2.0;
    }
    .banner3-desc li::before {
        content: "•";
        position: absolute;
        left: 8px;
        color: #fff;
    }
    .excellence-container{
        text-align: center;
    }
    .excellence-container h2{
        font-size: 54px;
        font-weight: 600;
        padding: 120px 0 80px 0;
    }
    .excellence-container h3{
        font-size: 32px;
        font-weight: 600;
    }
    .excellence-container .desc{
        font-size: 18px;
        margin-top: 24px;
    }
    .excellence-item{
        padding: 120px 0;
    }
   .excellence-item .img-container{
        position: relative;
    }
    .img-container img{
        max-width: 1200px;
        display: inline-block;
    }
    .img-desc{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none; /* 允许点击穿透到图片 */
    }
    .img-desc>div{
        text-align: left;
        position: absolute;
    }
    /* stereo Camera - 左上角 */
    .img-desc>div:nth-child(1){
        top: 21.5%;
        left: 54%;
    }
    /* Ultrasonic Sensors - 右上角 */
    .img-desc>div:nth-child(2){
        top: 37.5%;
        left: 54%;
    }
    /* LiDar Sensor - 左下角 */
    .img-desc>div:nth-child(3){
        top: 50.5%;
        left: 54%;
    }
    /* Line Lasers - 右下角 */
    .img-desc>div:nth-child(4){
        top: 67.5%;
        left: 54%;
    }
    .img-desc-title{
       color: #25B4C3;
       font-size: 18px; 
       font-weight: 600;
    }
    .img-desc ul li{
        font-size: 14px;
    }
    .banner4-container{
        min-width: 1200px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .banner4-title h2{
        font-size: 32px;
        font-weight: 600;
        margin-bottom: 24px;
    }
    .banner4-title h3{
        font-size: 18px;
        max-width: 555px;
        line-height: 1.5;
        color: #646464;
    }
    .banner4-img{
        width: 555px;
        height: 600px;
    }
    .banner5-container{
        max-width: 1200px;
        padding: 120px 0;
    }
    .banner5-container h2{
        font-size: 54px;
        font-weight: 600;
        text-align: center;
        margin-bottom: 90px;
    }
    .banner5-item-container{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 60px 24px;
        text-align: center;
    }
    .banner5-item-desc{
        margin-top: 24px;
        font-size: 18px;
    }
    /* speci-container */
    .speci-container{
        margin: 0 auto;
        max-width: 960px;
    }
.speci {
    /* padding-top: 120px;
    padding-bottom: 120px; */
    display: flex;
    /* background: url('https://www.orionstar.com/res/orics/down/ow001_20250312_44dffc28492e31208e66b2755abae6a5.webp') no-repeat;
    background-size: 120% 100%; */
    background-color: #16223A;
    color: #fff;
    position: relative;
  }
  .speci-bg-img{
    position: absolute;
    top: 0;
    left: -3%;
    width: 1100px;
    height: 100%;
    object-fit: contain;
  }
  .speci-title {
    font-size: 40px;
    font-weight: var(--semiBold);
    text-align: center;
    line-height: 75px;
    padding-top: 120px;
  }
  .speci-list {
    margin-top: 30px;
    /* margin-left: 320px; */
  }
  
  .speci-item {
    padding-top: 42px;
    padding-bottom: 42px;
    display: flex;
    flex-direction: row;
  }
  
  .speci-item-title {
    min-width: 300px;
    width: 300px;
    height: 60px;
    font-size: 18px;
    font-weight: var(--semiBold);
    text-align: left;
    line-height: 60px;
  }
  
  
  .speci-item-list {
    margin-left: 80px;
  }
  
  .speci-item-line {
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
  }
  
  .speci-item-list-item {
    display: flex;
    flex-direction: row;
  }
  
  .speci-item-list-item-key {
    width: 300px;
    opacity: 0.8;
    font-size: 18px;
    text-align: left;
    line-height: 60px;
  }
  
  
  .speci-item-list-item-value {
    flex: 1;
    max-width: 600px;
    opacity: 0.8;
    font-size: 18px;
    text-align: left;
    line-height: 60px;
    margin-left: 80px;
  }

  /* 分页器样式 */
  .pagination-container {
    background-color: #f8f9fa;
    padding: 60px 0;
    border-top: 1px solid #e9ecef;
  }

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

  .pagination-list {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 8px;
    align-items: center;
  }

  .pagination-item {
    margin: 0;
  }

  .pagination-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    min-width: 44px;
    height: 44px;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    color: #495057;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    background-color: #fff;
    gap: 8px;
  }

  .pagination-link:hover {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
    transform: translateY(-1px);
  }

  .pagination-link.pagination-active {
    background-color: #2097E3;
    border-color: #2097E3;
    color: #fff;
  }

  .pagination-link.pagination-active:hover {
    background-color: #1976d2;
    border-color: #1976d2;
    transform: translateY(-1px);
  }

  .pagination-prev,
  .pagination-next {
    font-weight: 500;
  }

  .pagination-prev svg,
  .pagination-next svg {
    flex-shrink: 0;
  }

  .pagination-ellipsis {
    padding: 12px 8px;
    color: #6c757d;
    font-weight: 500;
  }

  .pagination-dots {
    pointer-events: none;
  }

  /* 禁用状态 */
  .pagination-link.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
  }
  
}
