/* 首页 */ /* 推荐产品 */ #index_pro{padding: 70px 0 100px;} #index_pro .list{width: 100%; margin-top: 20px;} #index_pro .list .item{border: 0; display: block; margin-top: 31px; padding: 0; overflow: hidden; position: relative; overflow: hidden; } #index_pro .list .item .back img{width: 100%; height: 100%; transition: all 0.5s ease-in-out;} #index_pro .list .item .back::before, #index_pro .list .item .back::after{content: ""; display: block; width: 100%; height: 100%; background: no-repeat center center/cover; position: absolute; bottom: 0; left: 0; z-index: 1; transition: opacity 0.5s ease-in-out;} #index_pro .list .item .back::before{background-image: url(/uploads/image/tmshimages/cover1.png); opacity: 1;} #index_pro .list .item .back::after{background-image: url(/uploads/image/tmshimages/cover2.png); opacity: 0;} #index_pro .list .item .top{padding: 0; z-index: 3; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: flex-end; justify-content: flex-end;} #index_pro .list .item .top .in{padding: 0 50px; transform: translatey(-10px); transition: all 0.5s ease-in-out;} #index_pro .list .item .top .name{margin: 0; font-size: 22px; line-height: 30px; color: #fff; font-weight: bold; transition: all 0.4s ease-in-out;} #index_pro .list .item .top .brief{margin-top: 5px; font-size: 18px; line-height: 25px; color: #fff; opacity: 0.7; transition: all 0.5s ease-in-out;} #index_pro .list .item .top .more2{opacity: 0; width: 160px; margin-top: 15px; font-size: 17.5px; color: #fff; display: flex; align-items: center; transition: all 0.3s ease-in-out;} #index_pro .list .item .top .more2 .jt{margin-left: 15px; width: 8px; transition: all 0.4s ease-in-out;} #index_pro .list .item .top .more2 .jt .svg{width: 8px; font-size: 8px; color: var(--main); fill: var(--main); stroke: var(--main);} #index_pro .list .item:hover .back::before{opacity: 0;} #index_pro .list .item:hover .back::after{opacity: 1;} #index_pro .list .item:hover .back img{transform: scale(1.05);} #index_pro .list .item:hover .top .in{transform: translatey(-30px);} #index_pro .list .item:hover .top .more2{opacity: 1 !important;} /* #index_pro .list .item .top .more2.active{margin-top: 20px; margin-bottom: 20px; height: 50px; padding: 0 26px; width: max-content; min-width: 160px; overflow: hidden; background-color: var(--main);} #index_pro .list .item .top .more2.active .jt{transform: translatex(100%);} #index_pro .list .item .top .more2.active .jt .svg{stroke: #fff;} */ #index_pro .list .item .top .more2:hover .jt{transform: translatex(10px);} #index_pro .list .item:nth-child(1){width: 69.27%;} #index_pro .list .item:nth-child(2){width: 28.8%;} #index_pro .list .item:nth-child(3), #index_pro .list .item:nth-child(4){width: 49.02%;} #index_pro .list .item:nth-child(5), #index_pro .list .item:nth-child(6), #index_pro .list .item:nth-child(7){width: 32.03%;} #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 450px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 420px;} /* 产品视频 */ #index_swi{} #index_swi .swi_mb{ display: block;} /* #index_swi .box{max-width: 1440px; width: 92%; margin: auto;} */ #index_swi .swiper{max-width: 100%; overflow: visible !important; opacity: 0; transition: opacity 0.3s;} #index_swi .swiper .slide{width: 100%;} #index_swi .swiper .slide .pic{width: 100%; height: 720px;} #index_swi .swiper .slide .pic.video::before{content: ""; display: block; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); position: absolute; top: 0; left: 0; z-index: 1;} #index_swi .swiper .slide .pic picture{min-width: 100%; width: 100%; height: 100%;} #index_swi .swiper .slide .pic video, #index_swi .swiper .slide .pic img{width: 100%; height: 100%; object-fit: cover;} #index_swi .swiper .slide .pic.video .vmb{display: none;} #index_swi .swiper .txt_box{top: 8.56%; z-index: 3; padding: 0 5%; height: max-content;} #index_swi .swiper .txt_box .name{color: #fff;} #index_swi .swiper .txt_box .brief{margin-top: 13px; font-size: 22px; line-height: 31px; color: #fff; font-weight: 500; } #index_swi .swiper .txt_box .more{display: flex; align-items: center; justify-content: space-between; margin: 35px auto 0; height: 50px; padding: 0 26px; width: max-content; min-width: 160px; border-radius: 50px; font-size: 16px; color: #fff; overflow: hidden; position: relative; transition: all 0.3s ease; border: 1px solid #fff; pointer-events: auto; touch-action: manipulation; -webkit-tap-highlight-color: transparent;} #index_swi .swiper .txt_box .more .jt{margin-left: 15px; width: 8px; transform: translatey(1px); display: flex; justify-content: space-between; align-items: center;} #index_swi .swiper .txt_box .more .jt .svg{width: 8px; font-size: 8px; color: #fff; fill: #fff; stroke: #fff;} #index_swi .swiper .txt_box .in_txt{opacity:0; transform:translatey(100%); transition: all .6s ease-in-out .3s;} #index_swi .swiper .txt_box.txt_w .name, #index_swi .swiper .txt_box.txt_w .brief, #index_swi .swiper .txt_box.txt_w .more{color: #333; text-shadow: initial;} #index_swi .swiper .txt_box.txt_w .more{border-color: #333;} #index_swi .swiper .txt_box.txt_w .more .jt .svg{ color: #333; fill: #333; stroke: #333;} #index_swi .swiper .slide.swiper-slide-prev .in_txt{transform:translatey(-100%)} #index_swi .swiper .slide.swiper-slide-next .in_txt{transform:translatey(100%)} #index_swi .swiper .slide.swiper-slide-active .in_txt{opacity:1; transform:translatey(0)} #index_swi .swiper .swiper-pagination{bottom: 5%; display: flex; justify-content: center; width: 100%;} #index_swi .swiper .swiper-pagination .swiper-pagination-bullet{margin: 0 5px; width: 25px; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .2); opacity: 1;} #index_swi .swiper .swiper-pagination .swiper-pagination-bullet-active{background-color: var(--main); border-radius: 2px} #index_swi .swiper .txt_box .more:hover{color: #fff; border-color: var(--main); background-color: var(--main);} #index_swi .swiper .txt_box .more:hover .jt .svg{color: #fff; fill: #fff; stroke: #fff;} #index_swi .op_pg{opacity: 1;} #index_swi .point_list {position: absolute; left: 0; bottom: 5%; width: 100%; bottom: 4.167%; z-index: 1; display: flex; align-items: flex-end; justify-content: center;} #index_swi .point_list .point{position: relative; margin: 0 4px; height: 4px; width: 40px; border-radius: 2px; background: rgba(255, 255, 255, .5); transition: all 0.2s linear; cursor: pointer;} #index_swi .point_list .point.first, #index_swi .point_list .point.active {background-color: var(--main);} /* 公司简介 */ #index_about{margin-top: 108px;} #index_about .box{padding: 0 3.1%; background: no-repeat bottom center/100% auto;} #index_about .left{width: 44.76%;} #index_about .left .bot{margin-top: 50px;} #index_about .left .more{margin-right: 40px;} #index_about .left .more{padding: 0 26px; width: max-content; min-width: 160px; height: 45px; font-size: 16px; color: #fff; overflow: hidden; position: relative; transition: all 0.5s ease;} #index_about .left .more::before{content: ""; display: block; width: 100%; height: 100%; background-color: rgba(var(--main2), 1); position: absolute; top: 0; left: 0; z-index: 1; transition: all 0.5s ease;} #index_about .left .more>*{position: relative; z-index: 2;} #index_about .left .more .jt{margin-left: 15px; width: 8px; transform: translatey(1px); display: flex; justify-content: space-between; align-items: center;} #index_about .left .more .jt .svg{width: 8px; font-size: 8px; color: #fff; fill: #fff; stroke: #fff;} #index_about .left .more:hover::before{background-color: rgba(var(--main2), 0.8); backdrop-filter: blur(30px);} #index_about .left .play{width: 45px; height: 45px; background-color: var(--main); border-radius: 50%;} #index_about .left .play .svg{transform: translate(2px, 0) scale(0.9); transition: all 0.5s ease-in-out;} #index_about .left .play:hover .svg{transform: translate(2px, 0) scale(1.1);} #index_about .right{width: 49.969%; /*padding-top: 48%;*/ height: 633px;} #index_about .right img{top: inherit; transform: translate(-50%, 0) scale(1); bottom: 0;} #index_about_video{z-index: 51; left: 50%; top: 50%; transform: translate(-50%, -50%); visibility: hidden; opacity: 0; pointer-events: none; transition: all 0.5s ease-in-out;} #index_about_video .in_box{margin: 0 auto; width: 66vw; height: auto; max-width: 100%; /*max-height: 80vw;*/ position: relative; background-color: transparent; display: flex; justify-content: center; align-items: center;} #index_about_video .in_box .close_btn{position: absolute; top: 0; right: -35px; z-index: 1; width: 25px; fill: #fff;} #index_about_video .in_box .close_btn .svg{font-size: 25px; color: #fff; width: 100%; height: 100%; fill: #fff;} #index_about_video .in_box video{width: 100%; height: 100%;} #index_about_video .in_box .vmb{display: none;} /* 公司新闻 */ #index_blog{padding: 100px 0;} #index_blog .box{margin-top: 50px;} #index_blog .list_box{width: 50%; padding: 0; margin: 0;} #index_blog .left{} #index_blog .left .in_box{width: 95.7%; height: 100%; background-color: #f8f8f8;} #index_blog .left .in_box .swiper-pagination{display: none;} #index_blog .left .blog_swiper{width: 100%; min-height: auto;} #index_blog .left .blog_swiper .slide{width: 100%;} #index_blog .left .blog_swiper .slide .pic{width: 100%; height: 404px; /*padding-top: 56.25%;*/} #index_blog .left .blog_swiper .slide .info{padding: 35px 5.43% 45px; display: flex; flex-direction: column;} #index_blog .left .blog_swiper .slide .info .name{ min-height: calc(32px * 2); font-size: 22px; line-height: 32px; color: #222; font-weight: 600; transition: all 0.3s ease;} #index_blog .left .blog_swiper .slide .info .time{margin-top: 10px; margin-bottom: 5px; font-size: 16px; line-height: 22px; color: #888; transition: all 0.5s ease;} #index_blog .left .blog_swiper .slide .info .brief{margin-top: 7px; font-size: 16px; line-height: 27px; color: #888; transition: all 0.5s ease;} #index_blog .left .blog_swiper .slide .info .more{margin-top: 40px; display: inline-flex; width: max-content; font-size: 16px; line-height: 25px; color: #888; transition: all 0.5s ease;} #index_blog .left .blog_swiper .slide .info .more .jt{margin-left: 10px; margin-top: 3px; transition: all 0.5s ease; display: flex; justify-content: space-between; align-items: center;} #index_blog .left .blog_swiper .slide .info .more .jt .svg{width: 8px; font-size: 8px; color: #888; fill: #888; stroke: #888;} #index_blog .left .blog_swiper .slide:hover .info .name{color: var(--main);} #index_blog .left .blog_swiper .slide:hover .info .brief, #index_blog .left .blog_swiper .slide:hover .info .time{color: #222;} #index_blog .left .blog_swiper .slide .info .more:hover{color: var(--main);} #index_blog .left .blog_swiper .slide .info .more:hover .jt .svg{color: var(--main); fill: var(--main); stroke: var(--main);} #index_blog .box .op_pg{bottom: inherit; top: 32.09% !important;} #index_blog .right{display: flex; justify-content: flex-end;} #index_blog .right .in_box{padding: 30px 0; padding-right: 20px; width: 95.7%; background-color: #f8f8f8; position: relative;} #index_blog .right .in_box:before { content: ""; width: 100%; height: 150px; position: absolute; bottom: 0; left: 0; background: linear-gradient(rgba(248, 248, 248, 0) 0%, rgba(248, 248, 248, 1) 80%); transition: all 0.5s ease-in-out;} #index_blog .right .in_box.ended:before{display: none;} #index_blog .right .in{padding: 0 6.79%; width: 100%; height: 650px; overflow-y: auto;} #index_blog .right .in .item{border: 0; background-color: transparent; padding: 30px 0 29px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); transition: all 0.5s ease;} #index_blog .right .in .item:first-child{padding-top: 15px;} #index_blog .right .in .item:last-child{border: 0; padding-bottom: 15px;} #index_blog .right .in .item .name{font-size: 20px; line-height: 30px; color: #333; font-weight: 600; transition: all 0.3s ease; user-select: none; -webkit-user-select: none;} #index_blog .right .in .item .time{margin-top: 10px; font-size: 16px; line-height: 20px; color: #888; transition: all 0.3s ease; user-select: none; -webkit-user-select: none;} #index_blog .right .in .item:hover{border-color: rgba(var(--main2), 1);} #index_blog .right .in .item:hover .name{color: #333;} #index_blog .right .in .item:hover .name{color: var(--main);} #index_blog .scrollbar::-webkit-scrollbar, #index_blog .scrollbar *::-webkit-scrollbar{height:3px;width:5px;background:rgba(173,173,173,0.2); border-radius: 2px;} #index_blog .scrollbar::-webkit-scrollbar:hover, #index_blog .scrollbar *::-webkit-scrollbar:hover{background:rgba(173,173,173,0.2); border-radius: 2px;} #index_blog .scrollbar::-webkit-scrollbar-thumb, #index_blog .scrollbar *::-webkit-scrollbar-thumb{background:rgba(173,173,173,1); border-radius: 2px;} #index_blog .scrollbar::-webkit-scrollbar-thumb:hover, #index_blog .scrollbar *::-webkit-scrollbar-thumb:hover{background-color:rgba(173,173,173,1); border-radius: 2px;} #index_blog .view_more{margin: 45px auto 0; width: 160px; height: 50px; font-size: 16px; color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 50px; background-color: #333; transition: all 0.5s ease;} #index_blog .view_more .jt{transform: translatey(1px); margin-left: 15px; width: 8px; display: flex; justify-content: space-between; align-items: center;} #index_blog .view_more .jt .svg{width: 8px; font-size: 8px; color: #fff; fill: #fff; stroke: #fff;} #index_blog .view_more:hover{background-color: var(--main);} @keyframes expandwidth { from {width: 0;} to {width: 100%;} } @media (max-width: 1920px) { #index_about .box{padding: 0 5.1%;} } @media (max-width: 1680px) { #index_swi .swiper .slide .pic{height: 710px;} #index_about .right{height: 603px;} } @media (max-width: 1536px) { #index_pro .list .item{margin-top: 25px;} #index_pro .list .item .top .in{padding: 0 36px; transform: translatey(5px);} #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 410px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 355px;} #index_swi .swiper .slide .pic{height: 665px;} #index_about .right{height: 550px;} /* #index_about_video .in_box{width: 1300px;} */ #index_blog .left .blog_swiper .slide .pic{height: 365px;} #index_blog .right .in{height: 615px;} #index_blog .right .in .item{padding: 30px 0;} } @media (max-width: 1440px) { #index_pro .list .item{margin-top: 34px;} #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 390px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 325px;} #index_pro .list .item .top .name{font-size: 20px;} #index_pro .list .item .top .brief{font-size: 16px;} #index_swi .swiper .slide .pic{height: 605px;} #index_about .left{width: 48%;} #index_about .right{height: 34vw;} #index_about_video .in_box{/*max-width: 85.667%; width: 1420px; height: 600px;*/} #index_blog .box .op_pg{top: 30.09% !important;} #index_blog .right .in{height: 615px;} } @media (max-width: 1400px){ #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 370px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 315px;} } @media (max-width: 1366px) { #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 380px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 305px;} #index_pro .list .item .top .more2{font-size: 16px;} #index_swi .swiper .slide .pic{height: 585px;} #index_swi .swiper .txt_box .more{margin-top: 25px;} /* #index_about_video .in_box{width: 1360px; height: 580px;} */ #index_blog .left .blog_swiper .slide .pic{height: 310px;} #index_blog .left .blog_swiper .slide .info .name{font-size: 20px; line-height: 30px; min-height: calc(30px * 2);} #index_blog .right .in{height: 545px;} #index_blog .right .in .item .name{font-size: 18px;} } @media (max-width: 1280px) { #index_pro{padding: 60px 0 90px;} #index_pro .list .item{margin-top: 23px;} #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 355px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 280px;} #index_pro .list .item .top .name{font-size: 21px;} #index_pro .list .item .top .more2{font-size: 16px;} #index_swi .swiper .slide .pic{height: 545px;} #index_swi .swiper .txt_box .brief{margin-top: 7px; font-size: 20px; line-height: 24px;} #index_swi .swiper .txt_box .more{margin: 25px auto 0;} #index_about{margin-top: 90px;} #index_about .ind_tit{font-size: 36px;} #index_about .left .bot{margin-top: 35px;} #index_about_video .in_box{/*width: 1260px; height: 560px; max-height: 70vh*/} #index_blog{padding: 90px 0;} #index_blog .box{margin-top: 40px;} #index_blog .left .blog_swiper .slide .pic{height: 285px;} #index_blog .right .in{height: 515px;} #index_blog .right .in .item{padding: 24px 0;} #index_blog .right .in .item .name{font-size: 18px;} } @media (max-width: 1200px) { #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 330px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 255px;} #index_pro .list .item .top .name{font-size: 16px; line-height: 20px;} #index_pro .list .item .top .brief{font-size: 14px; line-height: 20px;} #index_pro .list .item .top .more2{font-size: 14px;} /* #index_pro .list .item .top .more2{height: 40px;} */ /* #index_pro .list .item .top .more2:hover{ padding: 0 20px; margin-top: 10px; margin-bottom: 10px; min-width: 145px; height: 40px;} */ #index_swi .swiper .slide .pic{height: 535px;} #index_swi .swiper .txt_box{top: 7.56%;} #index_about{margin-top: 90px;} #index_about .ind_tit{font-size: 32px;} #index_about_video .in_box{ /*max-width: 80%;width: 1180px; height: 500px;*/} #index_blog .box .op_pg{ top: 26.09% !important;} #index_blog .left .blog_swiper .slide .info{padding: 35px 5.43% 40px;} #index_blog .left .blog_swiper .slide .info .name{font-size: 20px; line-height: 1.4; min-height: calc(26px * 2);} #index_blog .right .in{height: 510px;} #index_blog .right .in .item{padding: 23px 0 21px;} #index_blog .right .in .item .name{font-size: 18px; line-height: 1.4;} } /* @media (max-width: 1050px) { #index_about_video .in_box{max-width: 75%;} } */ @media (max-width: 1024px) { #index_pro{padding: 60px 0 70px;} #index_pro .list .item .top .name{font-size: 18px;} #index_pro .list .item .top .in{padding: 0 26px; transform: translatey(15px);} #index_pro .list .item:hover .top .in{transform: translatey(-25px);} #index_pro .list .item:nth-child(1) .back, #index_pro .list .item:nth-child(2) .back, #index_pro .list .item:nth-child(3) .back, #index_pro .list .item:nth-child(4) .back{height: 290px;} #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 235px;} /* #index_pro .list .item .top .more2:hover{min-width: 125px;} */ #index_swi .swiper .slide .pic{height: 480px;} #index_about { margin-top: 70px; } #index_about .ind_tit{font-size: 28px;} #index_about .left .bot{margin-top: 20px;} /* #index_about_video .in_box{max-width: 67.667%; height: 440px;} */ #index_blog{padding: 70px 0;} #index_blog .left .blog_swiper .slide .pic{height: 245px;} #index_blog .left .blog_swiper .slide .info{padding: 35px 5.43%;} #index_blog .left .blog_swiper .slide .info .name{font-size: 18px; min-height: calc(25px * 2);} #index_blog .left .blog_swiper .slide .info .brief{font-size: 14px; line-height: 22px;} #index_blog .left .blog_swiper .slide .info .time{margin-top: 10px; font-size: 14px;} #index_blog .left .blog_swiper .slide .info .more{margin-top: 30px; font-size: 14px;} #index_blog .right .in{height: 450px;} #index_blog .right .in_box{padding: 25px 0; padding-right: 15px;} #index_blog .right .in .item .name{font-size: 16px;} } @media (max-width: 992px) { #index_pro{padding: 30px 0;} #index_pro .mb_cont{display: block; width: 100%; margin-top: 2.8vw; width: 100%;} #index_pro .mb_cont .pro_swiper{width: 100%; max-width: 100%; min-height: auto;} #index_pro .mb_cont .pro_swiper .slide{width: 100%;} #index_pro .mb_cont .pro_swiper .slide .back{height: 44vw;} #index_pro .mb_cont .pro_swiper .slide .back img{width: 100%; height: 100%;} #index_pro .mb_cont .pro_swiper .slide .back::before{content: ""; display: block; width: 100%; height: 100%; background: url(/uploads/image/tmshimages/cover1.png) no-repeat center center/cover; position: absolute; bottom: 0; left: 0; z-index: 1; transition: all 0.3s;} #index_pro .mb_cont .pro_swiper .slide .top{z-index: 3; display: flex; flex-direction: column; justify-content: flex-end;} #index_pro .mb_cont .pro_swiper .slide .top .in{padding: 0 5.56% 45px;} #index_pro .mb_cont .pro_swiper .slide .top .name{margin-bottom: 0; font-size: 0.2rem; line-height: 1.5; color: #fff;} #index_pro .mb_cont .pro_swiper .slide .top .brief{margin-top: 5px; font-size: 0.14rem; line-height: 1.5; color: #fff; opacity: 0.7;} #index_pro .mb_cont .pro_swiper .swiper-pagination{bottom: 5%; display: flex !important; justify-content: center; width: 100%;} #index_pro .mb_cont .pro_swiper .swiper-pagination .swiper-pagination-bullet{margin: 0 5px; width: 6px; height: 6px; background: rgba(255, 255, 255, .2); border-radius: 50%; opacity: 1;} #index_pro .mb_cont .pro_swiper .swiper-pagination .swiper-pagination-bullet-active{background-color: var(--main);} #index_pro .custom-hide-below-lg{display: none !important;} #index_pro .list{margin-top: 0;} #index_pro .list .item{margin-top: 2.8vw; width: 48.5% !important;} #index_pro .list .item .top .in, #index_pro .list .item:hover .top .in{transform: translatey(-30px);} #index_pro .list .item .top .more2{display: none !important;} #index_pro .list .item:hover .back img{transform: scale(1);} #index_pro .list .item:hover .back::before{background-image: url(/uploads/image/tmshimages/cover1.png);} #index_pro .list .item:nth-child(4) .back, #index_pro .list .item:nth-child(5) .back, #index_pro .list .item:nth-child(6) .back, #index_pro .list .item:nth-child(7) .back{height: 33.1vw;} #index_pro .list .item .top .in{padding: 0 10.47% !important; } #index_pro .list .item .top .name{font-size: 0.15rem; line-height: 1.5;} #index_pro .list .item .top .brief{font-size: 0.13rem; line-height: 1.5;} #index_pro .list .item:hover .top .in .name, #index_pro .list .item:hover .top .in .brief{transform: translatey(0);} #index_pro .list .item:hover .back::before{opacity: 1;} #index_pro .list .item:hover .back::after{opacity: 0;} #index_swi .op_pg{display: none;} #index_swi .swiper{padding-bottom: 36px;} #index_swi .swiper .slide .pic{padding-top: inherit; } #index_swi .swiper .slide .pic img{width: 100%; height: 100%; object-fit: cover;} #index_swi .swiper .txt_box .brief{margin-top: 5px; font-size: 0.158rem; line-height: 1.5;} #index_swi .swiper .txt_box .more{margin-top: 25px; height: 50px; min-width: 170px; padding: 0 30px; font-size: 0.14rem; background-color: transparent; color: #fff; border: 1px solid #fff;} #index_swi .swiper .txt_box .more .jt .svg{transform: scale(1.4);} #index_swi .swiper .txt_box .more:hover{background-color: transparent; color: #fff; border: 1px solid #fff;} #index_swi .swiper .txt_box.txt_w .more:hover{background-color: transparent; color: #333; border-color: #333;} #index_swi .swiper .txt_box.txt_w .more:hover .jt .svg{color: #333; fill: #333;;} /* #index_swi .swiper .swiper-pagination{bottom: 0;} #index_swi .swiper .swiper-pagination .swiper-pagination-bullet{width: 0.315rem; height: 0.0311rem; overflow: hidden; background-color: #cccccc; border-radius: 5px; position: relative; transition: width 0.5s ease-in-out; } #index_swi .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 0.935rem;} */ #index_swi .point_list {bottom: 0;} #index_swi .point_list .point{width: 0.315rem; height: 0.0311rem; overflow: hidden; background-color: #cccccc; border-radius: 5px; position: relative; transition: width 0.5s ease-in-out; } #index_swi .point_list .point.first, #index_swi .point_list .point.active {width: 0.935rem; background-color: #ccc;} #index_swi .point_list .point.first .point_progress{width: 0%;} #index_swi .point_list .point_progress{width: 0%; position: absolute; left: 0; top: 0; height: 100%; border-radius: 2px; background-color: var(--main);} #index_swi .point_list .point.active .point_progress{background-color: var(--main); display: block; border-radius: 5px; } #index_swi .point_list .point.stop .point_progress {width: 0 !important;} #index_about { margin-top: 8vw; } #index_about .box{background-image: ; background-size: 100% 100%; /*border-bottom-left-radius: 25px; border-bottom-right-radius: 25px;*/ border-radius: 0.25rem; flex-direction: column;} #index_about .left{width: 100%; padding: 5vw 0 3vw;} #index_about .ind_tit{font-size: 0.291rem; line-height: 1.5;} #index_about .left .more{height: 60px; min-width: 250px; padding: 0 35px; font-size: 0.14rem; } #index_about .left .more .jt .svg{transform: scale(1.8);} #index_about .left .play{width: 60px; height: 60px;} /*#index_about .left .play svg{transform: scale(1.2);}*/ #index_about .right{width: 100%; height: 63vw; /*padding-top: 78%;*/} /* #index_about_video{max-width: 89.666%; max-height: 50vw;} */ /* #index_about_video .in_box{max-width: 87.9vw; height: 49vw;} */ #index_about_video .in_box{width: 87.9vw;} #index_about_video .in_box .close_btn{width: 20px; height: 20px; top: -35px; right: 0;} #index_blog{padding: 8vw 0;} #index_blog .box{flex-direction: column; margin-top: 5vw;} #index_blog .list_box {width: 100%; max-width: 100%;} #index_blog .left .in_box{width: 100%;} #index_blog .left .blog_swiper{margin: 0; max-width: 100%;} #index_blog .left .blog_swiper .slide .pic{height: 50.2vw; } #index_blog .left .blog_swiper .slide .info{padding: 35px 5.43%;} #index_blog .left .blog_swiper .slide .info .name{font-size: 0.1837rem; line-height: 1.5; min-height: calc(32px * 2);} #index_blog .left .blog_swiper .slide .info .time{margin-top: 13px; font-size: 0.123rem; line-height: 1.5;} #index_blog .left .blog_swiper .slide .info .brief{margin-top: 13px; font-size: 0.123rem; line-height: 1.5;} #index_blog .left .blog_swiper .slide .info .more{margin-top: 4vw; font-size: 0.123rem;} #index_blog .left .blog_swiper .slide .info .more .jt .svg{transform: translatey(-1px) scale(1.2);} #index_blog .left .blog_swiper .slide .info .more:hover{color: #888;} #index_blog .left .blog_swiper .slide .info .more:hover .jt .svg{color: #333; stroke: #888;} #index_blog .box .op_pg{top: 32.09% !important; width: 55px; height: 55px; border-radius: 50%; background-color: rgba(247, 250, 251, 0.1);} #index_blog .right{margin-top: 30px;} #index_blog .right .in_box{padding: 2vw 0 4vw; width: 100%; padding-right: 0; } #index_blog .right .in_box:before{display: none;} #index_blog .right .in{padding: 0 5.79%; max-height: max-content; height: max-content; overflow: visible;} #index_blog .right .in .item{padding: 23px 0 22px;} #index_blog .right .in .item .name{font-size: 0.16rem; line-height: 1.5;} #index_blog .right .in .item .time{font-size: 0.123rem; line-height: 1.5;} #index_blog .left .blog_swiper .slide:hover .info .name{color: #222;} #index_blog .left .blog_swiper .slide:hover .info .brief, #index_blog .left .blog_swiper .slide:hover .info .time{color: #888;} #index_blog .right .in .item:hover{border-color: rgba(0, 0, 0, 0.1);} #index_blog .right .in .item:hover .name{color: #333;} #index_blog .view_more{height: 60px; min-width: 1.72rem; padding: 0 35px; font-size: 0.14rem; background-color: #333; color: #fff; justify-content: space-between;} #index_blog .view_more:hover{opacity: 1; background-color: #333;} #index_blog .view_more .icon{display: flex; justify-content: center; align-items: center;} #index_blog .view_more .svg{transform: scale(1.4);} } @media (max-width: 768px) { .layui-layer-iframe{height: 500px !important;} #index_pro .list .item{background-color: #fff; box-shadow: 0px 0px 20px 0px rgba(57, 143, 254, 0.1);} #index_pro .list .item .top{position: inherit; padding: 20px 0 30px;} #index_pro .mb_cont .pro_swiper .slide .back{height: 63.5vw;} #index_pro .list .item .back::before{display: none;} #index_pro .list .item .top .in, #index_pro .list .item:hover .top .in{transform: translatey(0);} #index_pro .list .item .top .name{color: #333;} #index_pro .list .item .top .brief{color: #333;} #index_pro .mb_cont .pro_swiper .slide .top .in{padding: 0 5.56% 6vw;} #index_pro .mb_cont .pro_swiper .slide .top .name{font-size: 0.26rem; line-height: 1.5; font-weight: 600;} #index_pro .list .item .top .name{font-size: 0.24rem; line-height: 1.5; font-weight: 600;} #index_pro .mb_cont .pro_swiper .slide .top .brief, #index_pro .list .item .top .brief{font-size: 0.20rem; line-height: 1.5;} #index_pro .mb_cont .pro_swiper .swiper-pagination{bottom: 5%;} #index_pro .mb_cont .pro_swiper .swiper-pagination .swiper-pagination-bullet{width: 8px; height: 8px;} #index_swi .swiper .slide .pic{height: 110vw;} #index_swi .swiper .slide .pic.video .vpc{display: none; pointer-events: none;} #index_swi .swiper .slide .pic.video .vmb{display: block; pointer-events: none;} #index_swi .swiper .txt_box .brief{font-size: 0.22rem;} #index_swi .swiper .txt_box .more{min-width: 24vw; height: 6vh; font-size: 0.18rem;} #index_swi .swiper .txt_box .more .jt{margin: 0;} #index_swi .point_list .point{width: 0.315rem; height: 0.05rem;} #index_swi .point_list .point.first, #index_swi .point_list .point.active{width: 0.513rem;} #index_about .ind_tit{font-size: 0.32rem;} #index_about .left .bot{margin-top: 5vw;} #index_about .left .more{padding: 0 4.5vw; min-width: auto; width: 2rem; max-width: 60%; height: 0.55rem; font-size: 0.18rem; justify-content: space-between;} #index_about .left .play{width: 0.55rem; height: 0.55rem; } #index_about_video .in_box{max-width: 84.9vw;} /* #index_about_video .in_box .vpc{display: none; pointer-events: none;} */ /* #index_about_video .in_box .vmb{display: block; pointer-events: none;} */ #index_blog .left .blog_swiper .slide .info .name, #index_blog .right .in .item .name{font-size: 0.24rem;} #index_blog .left .blog_swiper .slide .info .time, #index_blog .left .blog_swiper .slide .info .brief, #index_blog .right .in .item .time, #index_blog .left .blog_swiper .slide .info .more{font-size: 0.18rem;} #index_blog .left .blog_swiper .slide .info .more .jt{margin-top: 0; height: 17px;} #index_blog .left .blog_swiper .slide .info .more .jt .svg{transform: translatey(4px) scale(1.6);} #index_blog .view_more{margin: 5vw auto 0; padding: 0 4.5vw; min-width: 2rem; height: 0.6rem; font-size: 0.18rem; justify-content: space-between;} #index_blog .view_more .jt .svg{transform: scale(1.2);} } @media (max-width: 576px) { #index_pro{padding: 10vw 0;} #index_pro .mb_cont{margin-top: 0.4rem;} #index_pro .mb_cont .pro_swiper .slide .top .name, #index_pro .list .item .top .name{font-size: 0.32rem;} #index_pro .mb_cont .pro_swiper .slide .top .brief, #index_pro .list .item .top .brief {font-size: 0.26rem;} #index_pro .mb_cont .pro_swiper .slide .top .in{padding: 0 5.56% 0.6rem;} #index_pro .mb_cont .pro_swiper .swiper-pagination{bottom: 6%;} #index_pro .mb_cont .pro_swiper .swiper-pagination .swiper-pagination-bullet{width: 8px; height: 8px;} #index_pro .list .item .top .in{padding: 0 11.5% !important;} #index_swi .swiper .txt_box .name{font-size: 0.45rem; font-weight: bold;} #index_swi .swiper .txt_box .brief{font-size: 0.31rem; line-height: 1.5;} /* #index_swi .swiper .txt_box .more{padding: 0 0.5rem; height: 0.79rem; width: 33.6vw; font-size: 0.26rem;} */ #index_swi .swiper .txt_box .more{padding: 0 0.35rem; height: 0.65rem; width: 30.6vw; font-size: 0.26rem;} #index_swi .swiper .txt_box .more .jt {transform: translatey(1px);} #index_swi .swiper .txt_box .more .jt .svg{font-size: 0.18rem; transform: scale(0.8); width: initial;} /* #index_swi .swiper .swiper-pagination .swiper-pagination-bullet{width: 0.415rem;height: 5px;} */ #index_swi .point_list .point{width: 0.415rem; height: 0.05rem;} #index_swi .point_list .point.first, #index_swi .point_list .point.active{width: 0.613rem;} #index_about{margin-top: 10vw;} #index_about .ind_tit{font-size: 0.42rem; font-weight: bold;} #index_about .left{padding: 6vw 0 4vw;} #index_about .left .more{margin-right: 4vw; padding: 0 0.35rem; height: 0.65rem; width: 30.6vw;font-size: 0.26rem;} /* #index_about .left .more .jt .svg{transform: scale(1.5);} */ #index_about .left .more .jt {transform: translatey(1px);} #index_about .left .more .jt .svg{font-size: 0.18rem; transform: scale(0.8); width: initial;} #index_about .left .play{width: 0.65rem; height: 0.65rem;} /* #index_about .left .play svg{transform: translate(2px, 0) scale(0.75) !important;} */ #index_about .left .play .svg{transform: translate(1px, 1px) scale(0.6);} #index_about_video .in_box{max-width: 89.9vw; height: 53vw;} #index_blog{padding: 10vw 0;} #index_blog .right{margin-top: 5vw; } #index_blog .right .in .item{padding: 20px 0 19px;} #index_blog .left .blog_swiper .slide .info .time, #index_blog .right .in .item .time, #index_blog .left .blog_swiper .slide .info .more, #index_blog .left .blog_swiper .slide .info .brief{font-size: 0.26rem; line-height: 1.5;} #index_blog .left .blog_swiper .slide .info .name{font-size: 0.32rem; line-height: 1.5; min-height: inherit;} #index_blog .left .blog_swiper .slide .info{padding: 30px 5.63%;} #index_blog .left .blog_swiper .slide .info .more{margin-top: 20px;} #index_blog .box .op_pg{top: 24.09% !important; width: 25px; height: 25px;} #index_blog .box .op_pg .svg{font-size: 12px;} #index_blog .right .in .item .name{font-size: 0.30rem; line-height: 1.5;} #index_blog .view_more{padding: 0 0.5rem; min-width: auto; width: 33.6vw; height: 0.79rem; font-size: 0.26rem;} /* #index_blog .view_more .jt .svg{transform: scale(1.5);} */ #index_blog .view_more .jt {transform: translatey(1px);} #index_blog .view_more .jt .svg{font-size: 0.18rem; transform: scale(0.8); width: initial;} #index_blog .left .blog_swiper .slide .info .more .jt{margin-top: 0; height: auto; transform: translatey(1px);} #index_blog .left .blog_swiper .slide .info .more .jt .svg{font-size: 0.18rem; transform: translatey(0) scale(0.8); width: initial;} } @media (max-width: 350px){ #index_about .left .play{width: 50px; height: 50px;} #index_blog .box .op_pg{width: 40px; height: 40px;} #index_blog .box .op_pg .svg{transform: scale(0.7);} #index_blog .left .blog_swiper .slide .info .more .jt .svg{transform: translatey(4px) scale(1.2);} }