* {
margin: 0;
padding: 0;
}
html,
body {
/* scroll-behavior: smooth; */
font: calc(100vw / 120) arial, verdana;
font-family: "Source Han Sans CN";
}
a,
ul,
li,
p,
h3 {
list-style: none;
text-decoration: none;
transition: all 0.6s;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
}
img,
table {
/* max-width: 100%; */
transition: all 0.6s;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
}
.ckxlsb .ffs-js .layui-tab-title .tab{
min-width:50rem!important;
}
.kcxlsb .ffs-js .layui-tab-title .tab{
width:80%;
}
.kcpx-pxkc canvas{
background-color:rgba(242, 242, 242, 1);
}
.ckxlsb canvas{
background-color:#ffffff!important;
}
.kcpx-pxkcxqy .pxyq .content .imgs{
margin-top:0rem;
height:29rem;
}
.kcpx-pxkcxqy .pxyq{
margin-top:29rem;
}
.kcpx-pxkcxqy .pxyq .content .imgs img{
height:100%;
}
.kcpx-pxkcxqy .pxyq .content .texts h5{
margin-bottom:2rem;
}
.kcpx-pxkcxqy .pxyq .content .texts{
padding-top: 0rem;
}
.pxkc-box .content .box{
display:flex;
}
.kcpx-pxkc .pxkc-box .content .box .text,.pxkc-box .content .box .imgs{
border-radius:1rem;
width:50%;
height:100%;
overflow:hidden;
}
.list-number{
width:2rem;
display:inline-block;
line-height:2rem;
text-align:center;
height:2rem;
border-radius:50%;
color:#ffffff;
background:rgba(224, 2, 6, 0.5);
}
.kcpx-pxkc .fxjy .swiperbox .box .imgs:hover img, .pxkc-box .content .box .imgs:hover img{
transform: scale(1.1);
transition: all .6s;
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.pxkc-box .content .box .imgs img, .kcpx-pxkc .fxjy .swiperbox .box .imgs img{
width:100%;
height:100%;
object-fit:cover;
}
.kcpx-pxkc .kcpxsBox{
height:100%!important;
}
.kcpx-pxkc .ckgx{
font-size: 1.13rem;
color: #848484;
padding-right: 2.9rem;
}
.kcpx-pxkc .ckgx:hover::after{
background-image: url(../images/more-a.png);
cursor:pointer;
}
.kcpx-pxkc .ckgx::after {
content: "";
width: 2.31rem;
height: 2.31rem;
position: absolute;
background-image: url(../images/more.png);
background-size: 100% 100%;
right: 0;
top: -15%;
}
.kcpx-pxkc .kcpxsBox .top{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:3.94rem;
}
.kcpx-pxkc .kcpxsBox .top .ckgd{
font-size: 1.13rem;
color: #848484;
}
.kcpx-pxkc .pxkc-box .content .box .text{
position:relative;
}
.kcpx-pxkc .test-page{
position:relative;
position:fixed;
}
.test-page .content{
background:#ffffff;
}
.kcpx-pxkc .pxkc-box .content .box .text .ckgd{
position:absolute;
left:2rem;
bottom:3rem;
}
.kcpx-pxkc .pxkc-box .content .box .text .ckgd:hover{
color: #D7000F;
}
.kcpx-pxkc .pxkc-box .content .box .text,.kcpx-pxkc .fxjy .swiperbox .box .text{
padding-right:2rem;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.38rem;
color: #808080;
line-height: 2.69rem;
}
.kcpx-pxkc .fxjy .swiperbox .box .text,.kcpx-pxkc .fxjy .swiperbox .box .imgs{
width:50%;
height:100%;
overflow:hidden;
}
.kcpx-pxkc .fxjy .swiperbox .box{
display:flex;
padding: 4.5rem 14rem 10.19rem 14rem;
}
.kcpx-pxkc .fxjy .swiperbox .kcpxBox{
height:35rem;
padding: 0rem 14rem 3.19rem 14rem!important;
}
.kcpx-pxkc .fxjy .swiperbox .kcpxBox .imgs {
border-radius:1rem;
}
.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.6);
display: none;
align-items: center;
justify-content: center;
z-index: 1000;
padding: 20px;
}
.test-page .content h3{
margin-bottom:2rem;
font-size:2rem;
}
/* 蒙层内容容器样式 */
.test-page {
background-color: white;
width: 100%;
max-width: 63rem;
border-radius: 10px;
box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2);
padding: 25px;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.3s ease, transform 0.3s ease;
}
.test-page ul li {
width:50%;
float:left;
}
.test-page .content ul {
list-style-position: inside;
margin-top: 10px;
}
.test-page .content li {
margin-bottom: 12px;
font-size: 16px;
line-height: 1.5;
}
.test-page .content a {
text-decoration: none;
transition: color 0.2s;
}
.test-page .content a:hover {
color: #0056b3;
text-decoration: underline;
}
.test-page .ckgx:hover {
color: #D7000F;
}
.test-pagec .content a:hover {
color: #D7000F;
}
.close-modal {
position:absolute;
top:2rem;
right:2rem;
height:2rem;
width:2rem;
line-height: 2rem;
border-radius:50%;
display: block;
font-size:2rem;
background-color:#ffffff;
color:#787070;
border: none;
cursor: pointer;
transition: background-color 0.2s;
}
.kcpx-pxkc .close-modal:after{
}
.kcpx-pxkc .ckgx{
right:2rem;
bottom:3rem;
}
.close-modal:hover {
}
/* 蒙层显示状态 */
.modal-overlay.show {
display: flex;
}
.test-page.show {
opacity: 1;
transform: translateY(0);
}
.home .about::-webkit-scrollbar {
display: none;
}
body::-webkit-scrollbar {
display: none;
}
.home {
overflow:hidden;
}
*::hover{
cursor:pointer;
}
.xwxqy .title-list{
margin-top:6.25rem;
}
.zhpx-s .info{
padding:0rem;
margin: 1px 13.88rem 9.88rem 14.13rem;
}
.home .about canvas{
background-color: #ffffff!important;
}
.swiper-wrapper--center {
justify-content: center;
width: 100%;
height: 100%;
display:flex;
}
.paddingRight{
padding-right:8.25rem;
}
.lanmu .active span {
opacity: 1;
color: #D7000F!important;
}
[data-aos] {
opacity: 0;
transform: translateY(30px);
transition-property: opacity, transform;
}
[data-aos].aos-animate {
opacity: 1;
transform: translateY(0);
}
.gywm canvas{
background-color:transparent;
}
.home .banner {
height: 54.38rem;
margin-top: 6.25rem;
position: relative;
background-size: 100%;
overflow: hidden; /* 确保超出部分被裁剪 */
}
.home .banner .swiperbox {
width: 100%;
height: 100%; /* 修改为100%以适应banner高度 */
}
/* 简化选择器，提高优先级 */
.home .banner .swiper-slide {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
}
.home .banner .swiper-slide img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 8s ease-in-out; /* 延长动画时间，使效果更明显 */
transform: scale(1.05); /* 初始缩放 */
}
/* 提高当前活动幻灯片样式的优先级 */
.home .banner .swiper-slide.swiper-slide-active img {
transform: scale(1.15); /* 活动状态缩放 */
}
/* 分页器样式保持不变 */
.home .banner .swiperbox .swiper-pagination {
padding-left: 8.19rem;
bottom: 4rem;
left: 0;
right: 0;
width: 100%;
text-align: left;
z-index: 10;
}
.home .banner .swiperbox .swiper-pagination .swiper-pagination-bullet {
width: 0.55rem;
height: 0.56rem;
background: #ffffff;
opacity: 0.5;
transition: all 0.3s ease;
}
.home .banner .swiperbox .swiper-pagination-bullet-active-b{
transform: scale(1);
position: relative;
background-color: transparent!important;
width: 0.55rem;
height: 0.56rem;
}
.home .banner .swiperbox .swiper-pagination-bullet-active-b::after {
content: '';
position: absolute;
top: -0.1rem;
left: 0;
width: 0.38rem;
height: 0.75rem;
background-image: url(../images/fanhui.png)!important;
background-repeat: no-repeat;
background-size: contain;
object-fit: cover;
background-position: center;
}
.home .banner .swiperbox a {
height: 100%;
}
.home .banner .swiperbox .swiper-slide img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 5s ease; /* 缩放过渡动画 */
transform: scale(1.05); /* 初始稍放大 */
}
.home .banner .scrEl {
width: 1.3rem;
height: 3.3rem;
bottom: 5rem;
position: absolute;
right: 8.13rem;
z-index: 99;
}
.home .banner .title {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 4.38rem;
color: #FFFFFF;
line-height: 6.25rem;
left: 8.19rem;
bottom: 12.5rem;
position: absolute;
z-index: 99;
}
.home .banner .scrEl .ripple {
position: absolute;
height: 2rem;
opacity: 0;
bottom: 0;
left: 0;
-webkit-animation: scrollFn 4s var(--ease) infinite;
animation: scrollFn 4s var(--ease) infinite;
}
.home .banner .scrEl .ripple:nth-of-type(2) {
bottom: 0.05rem;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.home .banner .scrEl .ripple:nth-of-type(3) {
bottom: 1rem;
-webkit-animation-delay: 2s;
animation-delay: 2s;
}
@keyframes scrollFn {
0% {
-webkit-transform: scale(0.3) translate3d(0, -0.4rem, 0);
transform: scale(0.3) translate3d(0, -0.4rem, 0);
opacity: 0;
}
80% {
-webkit-transform: scale(1) translate3d(0, 0, 0);
transform: scale(1) translateZ(0);
opacity: 1;
}
to {
-webkit-transform: scale(1) translate3d(0, 0, 0);
transform: scale(1) translateZ(0);
opacity: 0;
}
}
@-webkit-keyframes scrollFn {
0% {
-webkit-transform: scale(0.3) translate3d(0, -0.4rem, 0);
transform: scale(0.3) translate3d(0, -0.4rem, 0);
opacity: 0;
}
80% {
-webkit-transform: scale(1) translate3d(0, 0, 0);
transform: scale(1) translateZ(0);
opacity: 1;
}
to {
-webkit-transform: scale(1) translate3d(0, 0, 0);
transform: scale(1) translateZ(0);
opacity: 0;
}
}
/* home 新闻动态 */
.home .news {
background-color: #FFFFFF;
height: 66.63rem;
padding: 0 8.19rem 6.62rem 8.19rem;
box-sizing: border-box;
margin-top: 6.37rem;
}
.home .news .news-container {
display: flex;
justify-content: space-between;
}
.home .news .news-container .right-column,
.home .news .news-container .left-column {
width: 23.25rem;
display: flex;
flex-direction: column;
justify-content: space-between;
border-box:box-sizing;
}
.home .news .news-container .right-column span {
display: inline-block;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #222122;
padding-bottom: 2rem;
}
.home .news .news-container .right-column h5 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.4rem;
color: #222122;
line-height: 1.83rem;
margin-bottom: 2.94rem;
}
.home .news .news-container .right-column P {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #646464;
line-height: 1.83rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
padding-bottom:2.125rem;
}
.home .news .news-container .left-column .news-item:hover p,
.home .news .news-container .left-column .news-item:h5{
color: #d7000f;
}
.home .news .news-container .news-item:hover span,
.home .news .news-container .news-item:hover p,
.home .news .news-container .news-item:hover h5,
.home .news .news-container .middle-news:hover P {
color: #d7000f;
transition:all 0.3s;
}
.home .news .news-container .left-column .imgs {
width: 100%;
height: 14.69rem;
overflow: hidden;
}
.home .news .news-container .left-column .news-item p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #222122;
padding-top: 2rem;
padding-bottom: 1.69rem;
}
.home .news .news-container .left-column .news-item:hover h5,.home .news .news-container .left-column .news-item:hover p{
color:#D7000F!important;
}
.home .news .news-container .left-column .news-item h5 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.4rem;
color: #222122;
line-height: 1.83rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.home .news .news-container .left-column .imgs img {
width: 100%;
height: 100%;
background-size: 100% 100%;
object-fit: cover;
}
.home .news .news-container .left-column .news-item:hover .imgs img{
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.home .news .news-container .middle-column {
width:50rem;
height:100%;
box-sizing:border-box;
}
.home .news .news-container .news-item {
display: flex;
flex-direction: column;
}
.home .news .news-container .right-column .news-item{
border-bottom:1px solid #F2F2F2;
}
.home .news .news-container .middle-news span {
display: inline-block;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #222122;
margin-top: 2rem;
margin-bottom: 2.35rem;
width:100%;
position:relative;
}
.home .news .news-container .middle-news span::before{
content:'';
background-image: url(../images/JIAN.png);
width: 1.11rem;
height: 0.6rem;
object-fit:cover;
background-size:100% 100%;
position:absolute;
right:0.1rem;
}
.home .news .news-container .middle-news:hover span::before{
background-image: url(../images/more2.png);
}
.home .news .news-container .middle-news h5 {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #222122;
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.4rem;
margin-bottom: 3.25rem;
}
.home .news .news-container .middle-news P {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
line-height: 1.83rem!important;
color: #222122;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.home .news .news-container .news-item p {
margin: 0;
line-height: 1.5;
}
.home .news .news-container .middle-news .imgs {
width: 100%;
height: 34rem;
overflow: hidden;
}
.home .news .news-container .middle-news:hover img {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.home .news .news-container .middle-news:hover h5{
color: #D7000F;
}
.home .news .news-container .middle-news:hover span{
color: #D7000F;
}
.home .news .news-container .middle-news img {
width: 100%;
height: auto;
margin-bottom: 10px;
background-size:100% 100%;
}
.home .news .news-container .middle-news p {
margin: 0;
line-height: 1.5;
}
.home .news .new-title {
display: flex;
justify-content: space-between;
margin-bottom: 3.38rem;
}
.home .news .new-title h5 {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.5rem;
color: #222122;
}
.home .news .new-title a {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #848484;
display: flex;
justify-content: space-between;
line-height:4rem;
align-items: center;
position:relative;
padding-right:3.31rem;
}
.home .news .new-title a::after{
content: "";
width: 2.31rem;
height: 2.31rem;
position: absolute;
background-image: url(../images/more.png);
background-size: 100% 100%;
right: 0;
}
.home .news .new-title a:hover::after{
background-image: url(../images/more-a.png);
}
.home .news .new-title a:hover{
color: #D7000F;
}
.home .news .new-title a img {
margin-left: 0.56rem;
width: 2.31rem;
height: 2.31rem;
}
/* .home 培训课程 */
.home .course {
background-image: url(../images/home-pxck.png);
background-repeat: no-repeat;
width: 100%;
background-size: 100% 100%;
height: 51.63rem;
box-sizing: border-box;
padding-bottom: 13rem;
padding-top: 5.94rem;
padding-left: 8.25rem;
background-attachment: fixed;
background-position: center;
background-size: cover;
}
.layui-tab-bar{
display: none;
}
.home .course .course-title{
padding-right: 7.69rem;
}
.home .course .course-title h5 {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.5rem;
color: #222122;
}
.home .course .course-title .btn {
width: 7.26rem;
height: 2.88rem;
display:flex;
justify-content: space-between;
}
.home .course .course-title .btn div{
display:flex;
width:100%;
justify-content:space-between;
}
.home .course .course-title .btn span{
width: 2.88rem;
height: 2.88rem;
background: #FFFFFF;
display: block;
border-radius: 50%;
position: relative;
}
.home .course .course-title .btn span:nth-child(2)::after{
content: '';
position: absolute;
top: 35%;
left: 20%;
width: 1.5rem;
background-size: 100% 100%;
height: 0.68rem;
object-fit: cover;
background-image: url(../images/more2.png);
}
.home .course .course-title .btn span:nth-child(1)::after{
content: '';
position: absolute;
top: 35%;
left: 20%;
width: 1.5rem;
background-size: 100% 100%;
height: 0.68rem;
object-fit: cover;
background-image: url(../images/more-l.png);
}
.home .course .course-title .btn span:hover{
background-color: #D7000F;
}
.home .course .course-title .btn span:nth-child(1):hover::after{
background-image: url(../images/more-b-l.png);
}
.home .course .course-title .btn span:nth-child(2):hover::after{
background-image: url(../images/more-b-r.png);
}
.home .layui-tab .layui-tab-title li {
border: none !important;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.63rem;
color: #222122;
margin-bottom: 2rem;
}
.home .layui-tab .layui-tab-title li{
line-height:1.63rem;
}
.home .course .layui-tab .layui-tab-title .layui-this::before{
content: '';
position: absolute;
bottom: -1.94rem;
left: 50%;
transform: translateX(-50%);
transition: transform 0.3s ease;width: 3.13rem;
height: 0.19rem;
background: #D7000F;
}
.home .course .layui-tab-title .layui-this{
position: relative;
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.63rem;
color: #D7000F!important;
}
.home .course .layui-tab-content {
padding: 0;
box-sizing: border-box;
}
.home .course .layui-tab-content .layui-tab-item {
height: 23.75rem;
position: relative;
}
.home .course .course-content .layui-tab-title {
margin-top: 5rem;
margin-bottom: 5.31rem;
padding-left: 24.38rem;
padding-right: 31.88rem;
height: 3.76rem;
}
.layui-tab-title li .layui-tab-close {
display: none !important;
}
.layui-tab .layui-tab-title .layui-this {
border: none !important;
}
/* 首页.home 培训课程轮播图*/
.home .course .swiper-wrapper {}
.home .swiper-five {
width: 100%;
height: 100%;
}
.home .swiper-five .swiper-five-box {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
}
.home .swiper-five .swiper-five-box .swiper-wrapper {
width: 100%;
height: 100%;
}
.home .swiper-five .swiper-five-box .swiper-slide:hover .title {
font-weight: bold;
font-size: 1.5rem;
color: #ffffff;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.home .swiper-five .swiper-five-box .swiper-slide {
margin-right: 1.69rem !important;
position: relative;
width: 23.25rem!important;
height: 16rem;
border-radius: 0.63rem;
background-color: #f0f4f8;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
.home .swiper-five .swiper-five-box .swiper-slide .active {
color: #ffff !important;
}
.home .swiper-five .swiper-five-box .swiper-slide .title {
position: absolute;
bottom: 2.31rem;
width: 96%;
left: 1rem;
font-weight: bold;
font-size: 1.5rem;
color: #ffffff;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-shadow: 1px 1px 0px #ccc, 2px 2px 0px #000, 4px 4px 6px rgba(0, 0, 0, 0.2);
z-index: 10;
}
.home .swiper-five .swiper-five-box .swiper-slide img {
border-radius: 0.63rem;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.home .swiper-five .swiper-five-box .swiper-slide:hover {
transform: translateY(-5px);
}
.swiper-five .swiper-five-box .swiper-button-prev,
.swiper-five .swiper-five-box .swiper-button-next {
color: #118fe3;
width: 40px;
height: 40px;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 50%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.swiper-five .swiper-five-box .swiper-button-prev:after,
.swiper-five .swiper-five-box .swiper-button-next:after {
font-size: 18px;
font-weight: bold;
}
.home .swiper-five .swiper-pagination-course {
position: absolute;
bottom: 1.25rem;
left: 0;
right: 0;
width: 100%;
text-align: center;
z-index: 880;
padding: 0 0.625rem;
}
.home .swiper-five .swiper-pagination-course .swiper-pagination-bullet {
width: 0.6rem;
height: 0.6rem;
background: #cccccc;
opacity: 1;
z-index: 6666;
}
.home .swiper-five .swiper-pagination-course .swiper-pagination-bullet-active-course {
width: 1.44rem;
height: 1.44rem;
background-image: url(../images/swiper-yuan.png);
background-color: transparent;
/* 只单独设置背景色为透明 */
/* 可以添加其他背景相关属性，如： */
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.fxjy .swiper-pagination-fxjy {
position: absolute;
bottom: 1.25rem;
left: 0;
right: 0;
width: 100%;
text-align: center;
z-index: 880;
padding: 0 0.625rem;
}
.fxjy .swiper-pagination-fxjy .swiper-pagination-bullet {
width: 1.44rem;
height: 1.44rem;
background-image: url(../images/swiper.png);
opacity: 1;
z-index: 6666;
}
.fxjy .swiperbox {
position: relative;
}
.fxjy .swiper-pagination-fxjy .swiper-pagination-bullet-fxjy {
width: 1.2rem;
height: 1.2rem;
background-image: url(../images/swiper-yuan.png);
background-color: transparent;
/* 只单独设置背景色为透明 */
/* 可以添加其他背景相关属性，如： */
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.new-container .swiperbox {
width:88.875rem;
position: relative;
/* 避免内容溢出被截断 */
overflow: hidden;
}
.new-container .swiper-pagination-dt {
position: absolute;
bottom: 0rem;
left: 0;
right: 0;
width: 100%;
text-align: center;
z-index: 6666666666666;
padding: 0 0.625rem;
/* 防止分页器超出容器范围 */
box-sizing: border-box;
}
.new-container .swiper-pagination-dt .swiper-pagination-bullet {
width: 1.2rem;
height: 1.2rem;
background-image: url(../images/swiper.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-color:#F7F7F7; /* 统一背景色处理 */
opacity: 1;
z-index: 6666;
/* 添加间距 */
margin: 0 0.3rem;
background-color: #0c4a6e;
/* 移除默认边框 */
border: none;
outline: none;
/* 鼠标悬停效果 */
cursor: pointer;
transition: transform 0.2s ease;
}
/* 激活状态样式 */
.new-container .swiper-pagination-dt .swiper-pagination-bullet-dt {
background-image: url(../images/swiper-yuan.png);
/* 激活状态缩放效果 */
transform: scale(1.1);
background-color:#F7F7F7; /* 统一背景色处理 */
}
/* 禁用状态（如果需要） */
.new-container .swiper-pagination-dt .swiper-pagination-bullet:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.swiper-five .swiper-five-box .swiper-slide .mask {
top: 0;
bottom: 0;
left: 0;
right: 0;
background-size: 100% 100%;
background-image: url(../images/red-bk.png);
object-fit: cover;
position: relative;
position: absolute;
padding: 2.5rem 0rem 0 1.5rem;
display: flex;
align-items: center;
flex-direction: column;
justify-content: space-between;
z-index: 99;
opacity: 0;
}
.swiper-five .swiper-five-box .swiper-slide:hover .mask {
opacity: 1;
}
.swiper-five .swiper-five-box .swiper-slide .mask h1{
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.5rem;
color: #FFFFFF;
width: 100%;
position: relative;
}
.swiper-five .swiper-five-box .swiper-slide .mask h1::before{
position: absolute;
content: "";
width: 2.13rem;
height: 0.25rem;
background: #ffffff;
bottom: -2.06rem;
left: 0;
}
.swiper-five .swiper-five-box .swiper-slide .mask .mask-b {
width: 100%;
height: 4.06rem;
display: flex;
align-items: center;
justify-content: space-between;
}
.swiper-five .swiper-five-box .swiper-slide .mask .arrows {
width: 4.06rem;
height: 4.06rem;
display: flex;
align-items: center;
justify-content: center;
}
.swiper-five .swiper-five-box .swiper-slide .mask .arrows img {
width: 3rem;
height: 3rem;
}
.swiper-five .swiper-five-box .swiper-slide .mask :nth-child(1) {
position: relative;
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.5rem;
color: #ffffff;
}
.swiper-five .swiper-five-box .swiper-slide .mask .mask-b p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #ffffff;
}
/* .home 联系我们 */
.home .about {
position: relative;
height: 38.44rem;
background-size: 100% 100%;
object-fit: cover;
}
.home .about .bjt{
width:100%;
height:38.31rem;
background-size:100% 100%;
object-fit:cover;
}
.footer .logo .more{
width: 4.5rem;
height: 4.5rem;
background: #D7000F;
border-radius: 50%;
opacity: 0.5;
display:flex;
justify-content:center;
align-items:center;
}
.footer .logo .more img{
width: 0.81rem;
height: 2.06rem;
background-size:100% 100%;
object-fit:cover;
}
.footer .logo .more:hover{
cursor:pointer;
opacity: 1;
}
.home .about .tet {
width:37%;
position:absolute;
height: 4.94rem;
top:8rem;
left: 7.19rem;
color: #FFFFFF;
line-height: 1.83rem;
text-shadow: 0rem 0rem 1rem rgba(64, 86, 107, 0.5);
}
.home .about .tet h1{
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 3rem;
line-height:6rem;
text-align:center;
margin-bottom:1rem;
}
.home .about .tet p{
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 1.8rem;
line-height:3rem;
text-align:center;
}
.home .about .text {
position:absolute;
top: 24.4375rem;
left: 6.875rem;
width: 10.25rem;
height: 3.875rem;
background-color: #D7000F;
border-radius: 3rem;
}
.home .about .text a {
width: 100%;
height: 3.875rem;
padding-left: 1.7rem;
padding-right: 0.7rem;
display: flex;
align-items: center;
justify-content: space-between;
}
.home .about .text a p {
font-size: 1rem;
color: #FFFFFF;
}
.home .about .text a .imgs {
width: 2.625rem;
height: 2.625rem;
border-radius: 50%;
background-color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
.home .about .text a .imgs img {
width: 1.88rem;
height: 0.63rem;
display: flex;
align-items: center;
justify-content: space-between;
}
.home .about .footer{
left: 0;
right: 0;
bottom: -35rem;
position: absolute;
background-image: url(../images/footer-bk.png)!important;
}
.footers{
position:relative!important;
margin-top: -6rem;
background-image: url(../images/footer-bk.png)!important;
}
/* 关于我们 */
/* 信息公告*/
.information-bullein {
width: 100%;
padding: 6.68rem 13.94rem 5.5rem 13.94rem;
}
.information-bullein .content {
padding: 1.94rem 4.23rem 1.57rem 3.81rem;
flex-grow: 1;
position: relative;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.information-bullein .content .card {
height: 13.75rem;
background: #FFFFFF;
margin-bottom: 2.38rem;
}
.title-tab {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
bottom: -3.6rem;
left: 0%;
right: 0;
}
.title-tab ul {
display: flex;
}
.title-tab ul li a {
display: inline-block;
width: 18.75rem;
height: 7.19rem;
background: #FFFFFF;
}
.title-tab ul li a p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #333333;
line-height: 7.19rem;
text-align: center;
}
.title-tab ul li .active {
background-color: #D7000F;
}
.title-tab ul li .active p {
color: #F7F7F7;
}
.title-tab ul li:hover a {
background-color: #D7000F;
}
.title-tab ul li:hover p {
color: #F7F7F7;
}
.title-list {
height: 6.25rem;
line-height: 6.25rem;
padding-left: 14rem;
padding-right: 14rem;
display: flex;
justify-content: space-between;
align-items: center;
background: #F7F7F7;
}
.title-list .search {
width: 21.68rem;
height: 3.56rem;
background: #F7F7F7;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.title-list .search input {
width: 100%;
height: 100%;
font-size: 1rem;
line-height: 2.75rem;
font-family: SourceHanSansCN;
font-weight: 400;
border-radius: 0.5rem;
font-size: 1rem;
border: 0.5px solid #CCCCCC;
color: #C1C1C1;
background: #F7F7F7;
padding-left: 3.25rem;
}
.title-list .search a {
display: block;
width: 1.31rem;
height: 100%;
background: url(../images/icon2.jpg) right center no-repeat;
background-size: contain;
font-size: 1rem;
line-height: 2.5rem;
color: #fff;
text-align: center;
position: absolute;
left: 0.875rem;
}
.title-list a img {
width: 0.44rem;
height: 0.63rem;
}
.title-list a i {
padding-left: 1rem;
padding-right: 1rem;
}
.page-loaded .title-list::before {
width: 100%;
/* 结束宽度为100% */
}
.page {
display: flex;
align-items: center;
justify-content: center;
padding-bottom: 2.5625rem;
}
.page ul {
width: max-content;
display: flex !important;
justify-content: center !important;
flex-wrap: wrap !important;
box-sizing: border-box;
margin: 0;
}
.page ul a.curr,
.page ul a:hover {
background-color: #D7000F;
color: #fff;
}
.information-bullein {
display: flex;
flex-direction: column;
background-color: #f7f7f7;
}
.information-bullein .card a {
display: flex;
background-color: white;
height: 100%;
box-sizing: border-box;
position: relative;
}
.information-bullein .card a .more {
width: 7.5rem;
height: 1.88rem;
margin-top: 1.5rem;
position: relative;
}
.information-bullein .card a:hover h3 {
color: #D7000F;
}
.information-bullein .card a:hover .more {
width: 7.5rem;
color: #D7000F;
position: relative;
}
.information-bullein .card a .more::after {
position: absolute;
content: '';
width: 1.88rem;
height: 1.88rem;
right: 0.25rem;
background-image: url(../images/ckxq-y.png);
background-size: 100% 100%;
}
.information-bullein .card a:hover .more::after {
background-image: url(../images/jiantypng.png);
}
nformation-bullein .date-box {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.information-bullein .date-box .time {
width: 10.63rem;
border-right: 0.06rem solid #E0E0E0;
padding-left: 3.7rem;
height: 8.75rem;
padding-right: 2.75rem;
margin-top: 2.5rem;
padding-top: 1rem;
display: flex;
align-items: center;
flex-direction: column;
}
.information-bullein .card:hover .date-box {
transition: ease 0.5s;
}
.information-bullein .card:hover:hover .time{
border-right: 0.06rem solid #D7000F;
}
.information-bullein .card:hover .date-day,
.information-bullein .card:hover .date-month {
color: #D7000F;
}
.information-bullein .date-day {
color: #333333;
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 3rem;
color: #333333;
}
.information-bullein .date-month.date-month {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1rem;
color: #999999;
flex-wrap: nowrap;
}
.information-bullein .content {
flex-grow: 1;
position: relative;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.information-bullein .content h3 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.38rem;
color: #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 1.6rem;
}
.information-bullein .content p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #646464;
line-height: 1.75rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
color: #333333;
}
.information-bullein .content .more {
font-family: SourceHanSansCN;
font-weight: bold;
text-decoration-line: underline;
font-size: 1.13rem;
color: #191919;
}
.information-bullein .content .more img {
width: 1.88rem;
height: 1.88rem;
margin-left: 0.94rem;
}
/* 信息公开 */
.xxgk .content p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 16px;
color: #919191;
line-height: 29.28px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
color: #333333;
}
.page {
margin-bottom: 2.63rem;
}
.page ul {
display: flex;
align-items: center;
justify-content: center;
}
.page ul a {
display: inline-block;
margin-left: 1px;
font-weight: 400;
padding: 0 1.3rem;
background-color: #FFFFFF;
height: 3.88rem;
line-height: 3.88rem;
font-size: 1rem;
color: #666666;
}
.page ul a:hover {
background-color: #D7000F;
color: #fff;
}
.xxgk {
width: 100%;
padding: 6.68rem 13.94rem 5.5rem 13.94rem;
display: flex;
flex-direction: column;
background-color: #f7f7f7;
}
.xxgk .content {
margin-bottom: 5.5rem;
}
.xxgk .card {
margin-bottom: 2.5rem;
height: 11.25rem;
width: 100%;
padding: 1.88rem 4.69rem 3.19rem 3.87rem;
}
.xxgk .card a {
display: flex;
background-color: white;
align-items: center;
height: 11.25rem;
width: 100%;
padding: 1.88rem 4.69rem 3.19rem 3.87rem;
justify-content: space-between;
box-sizing: border-box;
position: relative;
}
.xxgk .card a .btn {
width: 100%;
margin-top: 1.88rem;
}
.xxgk .card a .more {
width: 7.5rem;
height: 1.88rem;
position: relative;
}
.xxgk .card a:hover h3 {
color: #D7000F;
}
.xxgk .card a:hover .more {
width: 7.5rem;
color: #D7000F;
position: relative;
}
.xxgk .card a .more::after {
position: absolute;
content: '';
width: 1.88rem;
height: 1.88rem;
right: 0.25rem;
background-image: url(../images/ckxq-y.png);
background-size: 100% 100%;
}
.xxgk .card a:hover .more::after {
background-image: url(../images/jiantypng.png);
}
.xxgk .date-box {
flex: 1;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
.xxgk .date-box .time {
border-right: 0.06rem solid #E0E0E0;
padding-left: 3.7rem;
height: 8.75rem;
padding-right: 2.75rem;
margin-top: 2.5rem;
}
.xxgk .card:hover .date-box {
transition: ease 0.5s;
}
.xxgk .card a .btn span {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #646464;
line-height: 2.88rem;
display: inline-block;
width: 7rem;
height: 2.88rem;
background: #F2F2F2;
border-radius: 0.25rem;
text-align: center;
margin-right: 1.8rem;
}
.xxgk .content h3 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.38rem;
color: #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.xxgk .content .more {
font-family: SourceHanSansCN;
font-weight: bold;
text-decoration-line: underline;
font-size: 1.13rem;
color: #191919;
}
.xxgk .content .more img {
width: 1.88rem;
height: 1.88rem;
margin-left: 0.94rem;
}
/* 教员列表 */
.jylist {
padding: 4.31rem 14.06rem;
padding:4.31rem 14.06rem 6.31rem 14.06rem; ;
background-color:RGBA(247, 247, 247, 1);
}
.boxs{
margin-top: 6.25rem;
}
.boxs {
background-color: #F7F7F7;
}
.jylist .container {
margin: 0 auto;
margin-bottom: 5.63rem;
}
.jylist .cards-container {
display: grid;
grid-template-columns: repeat(4, 1fr);
justify-content: space-between;
gap: 3.1rem 3.1rem;
}
.jylist .card {
background-color: white;
border-radius: 0.5rem;
overflow: hidden;
text-align: center;
transition: transform 0.3s;
box-sizing: border-box;
border-radius: 1.25rem;
border-bottom: 0.25rem solid #ffffff;
display:flex;
flex-direction:column;
width:100%;
height:100%
}
.jylist .card:hover {
transform: translateY(-5px);
}
.jylist .avatar .middle {
background-color: #ff7eb9;
}
.jylist .avatar {
height: 17.56rem;
object-fit: cover;
display: flex;
align-items: end;
justify-content: center;
}
.jylist .avatar img {
object-fit: cover;
width: 14.25rem !important;
height: 14.25rem !important;
background-size: 100% 100%;
border-radius: 50%;
}
.jylist .card:hover .middle .avatar {
background-color: #e57e84;
}
.jylist .card:hover.card {
transition: all ease 0.4;
border-bottom: 0.25rem solid #D7000F;
}
.jylist .card:hover:hover .avatar img {
border-radius: 0;
-webkit-transition: all 0.6s;
width: 100% !important;
height: 100% !important;
}
.jylist .name {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.63rem;
color: #3D3D3D;
margin-top: 2.06rem;
}
.jylist .school {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1rem;
color: #676767;
margin-top: 1rem;
}
.jylist .arrow {
width: 3.44rem;
height: 3.44rem;
margin: 0 auto;
margin-top: 2.19rem;
border: 1px solid #cacaca;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
color: #434343;
margin-bottom: 1.13rem;
position: relative;
}
.jylist .arrow::after {
content: '';
width: 1.11rem;
height: 0.53rem;
background-size: 100% 100%;
background-repeat: no-repeat;
background-image: url(../images/jt.png);
position: absolute;
bottom: 40%;
left: 30%;
}
.jylist .card:hover .arrow::after {
background-image: url(../images/jt2.png);
}
.jylist .card:hover .arrow {
background-color: #D7000F !important;
color: #ffffff !important;
}
/* 新闻咨询详情*/
.info-list {
padding: 0;
line-height: 6.25rem;
height: 6.25rem;
margin-bottom: 2.076rem;
padding-left: 3.75rem;
}
.info {
background-color: #ffffff;
padding: 0 2.63rem 0 4.19rem;
margin: 0 13.88rem 9.88rem 20.13rem;
display: flex;
justify-content: space-between;
position: relative;
}
.info .related-list {
display: flex;
flex-direction: column;
gap: 0;
}
.info .related-list .related-item:hover .related-text {
cursor: pointer;
color: #67c4c2;
transition: all 0.6s ease;
}
.info .related-list .related-item:hover .related-date .related-day,
.info .related-list .related-item:hover .related-date .related-month {
cursor: pointer;
color: #ffff;
}
.info .related-list .related-item {
display: flex;
flex-direction: column;
align-items: center;
border-bottom: #c7c7c7 solid 0.06rem;
padding-bottom: 2.19rem;
box-sizing: border-box;
margin-bottom: 2.88rem;
}
.info .related-list:hover .related-item {
border-bottom: #e56970 solid 0.06rem;
}
.info .related-list .related-item .imgs {
width: 33.06rem;
height: 16.88rem;
overflow: hidden;
}
.info .related-list .related-item .imgs img {
width: 100%;
height: 100%;
background-size: 100% 100%;
background-repeat: no-repeat;
object-fit: cover;
}
.info .related-list .related-item:hover img {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.info .related-list .related-item .related-day {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 0.88rem;
color: #505050;
width: 100%;
}
.info .related-list .related-item .related-text {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.5rem;
color: #171717;
line-height: 2.25rem;
word-break: break-all;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
margin-top: 2rem;
margin-bottom: 2.94rem;
}
.info .info-box {
padding: 4.56rem 4.13rem 8rem 4.13rem;
flex: 1;
padding-right: 3.88rem;
box-sizing: border-box;
}
.info .info-boxs {
padding-top: 3.19rem;
padding-right: 5.13rem;
padding-left: 4.13rem;
display: flex;
padding-bottom: 17.8rem;
}
.info .info-boxs .imgs {
margin-right: 3.86rem;
width: 16.75rem;
height: 22.25rem;
overflow: hidden;
}
.info .info-boxs .imgs img {
width: 100%;
height: 100%;
object-fit: cover;
}
.info .info-boxs .text h3 {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.63rem;
color: #3D3D3D;
margin-bottom: 0.5rem;
}
.info .info-boxs .text {
flex: 1;
display: flex;
flex-direction: column;
padding-top: 3.6rem;
}
.info .info-boxs .text span {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1rem;
color: #676767 !important;
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1rem;
color: #676767;
margin-bottom: 2rem;
}
.info .info-boxs .text p {
text-indent: 2em;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #989898;
line-height: 2rem;
}
.info .info-boxs:hover img {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.info .back {
display: flex;
flex-direction: column;
width: 6.25rem;
height: 18.38rem;
position: absolute;
left: -6.25rem;
top: 0;
background-color: #ffffff;
}
.info .back .back-text {
width: 6.25rem;
height: 6.25rem;
background: #D7000F;
display: inline-block;
color: #ffffff;
padding: 1.25rem 1.9rem;
box-sizing: border-box;
position: relative;
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.13rem;
color: #FFFFFF;
}
.info .back .back-text::after {
content: '';
width: 1.44rem;
height: 0.88rem;
left: 2.4rem;
position: absolute;
background-size: 100% 100%;
background-image: url(../images/left-jiantou\).png);
bottom: 0.56rem;
}
.info .back .back-img {
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding-top: 1.69rem;
padding-bottom: 1.3rem;
}
.info .back .back-img img {
width: 1.38rem;
}
.info .back .back-img span {
display: flex;
align-items: center;
flex-direction: column;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #5e5e5e;
}
.info .info-box .img {
text-align: center;
text-indent: 0 !important;
}
.info .info-box .img img {
max-width: 73%;
object-fit: contain;
}
.info .info-box .num {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 1.56rem;
border-bottom: 0.06rem solid #e7e7e7;
}
.info .info-box .num .left {
width: 17.81rem;
display: flex;
justify-content: space-between;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 0.88rem;
color: #959595;
}
.info .info-box .num .right {
width: 4rem;
display: flex;
justify-content: space-between;
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1rem;
color: #999999;
}
.info .info-box .num .right p {
cursor: pointer;
}
.info .info-box .content_mod {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #5e5e5e;
line-height: 2rem;
margin-bottom: 2.56rem;
}
.info .info-box .content_mod p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #5E5E5E;
line-height: 2rem;
margin-top: 1.13rem;
margin-bottom: 1.79rem;
}
.info .info-box h3 {
text-align: center;
font-family: SourceHanSansCN;
font-weight: 500;
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 2.25rem;
color: #171717;
line-height: 3rem;
display: -webkit-box;
/* 用于 WebKit 浏览器 */
-webkit-line-clamp: 2;
/* 限制为5行 */
-webkit-box-orient: vertical;
/* 设置为垂直方向 */
display: box;
/* 用于 Firefox */
box-orient: vertical;
overflow: hidden;
padding-bottom: 3.44rem;
}
.info .info-box .text {
padding-top: 30px;
/* border-bottom: 1px solid #EBEBEB;
*/
margin-bottom: 40px;
}
.info .info-box .text p {
position: static;
background-color: transparent;
text-indent: 2em;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 16px;
color: #6b6b6b;
line-height: 28px;
}
.info .info-box .text .img {
text-align: center;
margin-top: 54px;
margin-bottom: 14px;
}
/* */
.pxyq {
width: 92.06rem;
position: relative;
top: -15rem;
left: 14rem;
background-color: #FFFFFF;
}
.pxyq .title-list {
padding-left: 3.63rem;
background-color: #FFFFFF;
}
.pxyq .content {
display: flex;
padding: 0rem 4.44rem 6.88rem 3.63rem;
}
.pxyq .content .imgs {
width: 35.19rem;
height: 25.38rem;
overflow: hidden;
}
.pxyq .content img {
width: 35.19rem;
height: 25.38rem;
object-fit:cover;
}
.pxyq .content .imgs:hover img {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.pxyq .content .texts {
flex: 1;
padding-left: 2.81rem;
}
.pxyq .content .texts h5 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 2.5rem;
margin-bottom: 1.25rem;
color: #333333;
}
.pxyq .content .text p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #666666;
line-height: 2rem;
}
.pxkcxqy .pxyq .content .text p:nth-child(2){
font-size: 0.75rem;
color: #0f56a0;
font-weight: 600;
background: rgba(15, 86, 160, 0.08);
padding: 4px 8px;
border-radius: 8px;
margin-bottom:1rem;
}
.pxyq .content .texts .pxnr {
margin-top: 3.44rem;
}
.pxyq .content .text .pxnr h5 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.88rem;
color: #333333;
}
.pxyq .content .texts .pxnr h5 {
margin-bottom: 2.38rem;
font-size:1.88rem;
}
.pxyq .content .texts .pxnr P {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #333333;
padding-left: 1.12rem;
position: relative;
margin-bottom: 1.56rem;
}
.pxyq .content .texts .pxnr p::after {
content: '';
position: absolute;
width: 0.38rem;
height: 0.38rem;
background: #D7000F;
left: 0;
top: 50%;
}
.contact {
position: relative;
height:45rem;
margin-top:6.25rem;
}
.contact .location{
position: absolute;
top: 21.5rem;
right: 35%;
width: 2.13rem;
height: 2.13rem;
display: flex
;
align-items: center;
justify-content: center;
}
.contact .location span{
display: block;
width: 1.38rem;
height: 1.38rem;
border-radius: 50%;
position: relative;
margin: auto;
}
.contact .location span::after{
content: '';
display: block;
width: 2.13rem;
height: 2.13rem;
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
border-radius: 50%;
background: rgba(215, 0, 15, 0.5);
transform: translate(-50%, -50%);
animation: borderScale 1s infinite;
}
@keyframes borderScale {
0% {
transform: translate(-50%, -50%) scale(1);
opacity: 0;
}
20% {
opacity: 1;
}
75% {
transform: translate(-50%, -50%) scale(2);
opacity: 0;
}
100% {
opacity: 0;
}
}
.contact footer{
position: absolute;
background-color: transparent;
bottom: -36rem;
width: 100%;
}
.contact img {
width: 100%;
}
.contact .contact-us-item {
position: absolute;
width: 27.25rem;
height: 27.25rem;
top: 3rem;
left: 10.56rem;
display: flex;
justify-content: space-between;
display:flex;
flex-direction:column;
box-sizing: border-box;
background-color: #D7000F;
padding: 3rem 4.19rem 4.31rem 4.19rem;
box-sizing: border-box;
}
.contact .contact-us-item h2 {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 2.25rem;
color: #FFFFFF;
margin-bottom: 2.4rem;
}
.contact .contact-us-item ul {
display: flex;
flex-direction: column;
justify-content: space-between;
align-center:space-between;
height: 14.25rem;
min-height: 14.25rem;
margin: 0;
padding: 0;
}
.contact .contact-us-item ul li {
display: flex;
align-items: center;
height: 2.81rem;
margin-bottom:3rem;
}
.contact .contact-us-item ul li:nth-child(3){
margin-bottom:0rem;
}
.contact .contact-us-item ul li .contact-icon {
padding-right: 1.69rem;
}
.contact .contact-us-item ul li .contact-icon img {
object-fit:cover;
background-size:100% 100%;
}
.contact .contact-us-item ul li .contact-icon:hover{
animation: rot 0.5s;
-webkit-animation: rot 0.5s;
}
.contact .contact-us-item ul li .contact-info {
display: flex;
justify-content: space-between;
flex-direction: column;
}
.contact .contact-us-item ul li .contact-info .contact-label {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.25rem;
color: #FFFFFF;
}
.contact .contact-us-item ul li .contact-info .contact-value {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #FFFFFF;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.contact .maps {
width: 100%;
height: 37.31rem;
}
/* 企业文化 */
.fuwu {
width: 100%;
height: 64.38rem;
background-size: 100% 100%;
background-repeat: no-repeat;
object-fit:cover;
}
.fuwu ul {
height: 100%;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.qywh canvas{
background-color: transparent;
}
.fuwu ul li {
background-size: 100% 100%;
display: flex;
justify-content: center;
align-items: center;
}
.fuwu ul li:hover {
transition:all ease 0.6s;
background-color: #D7000F;
}
.fuwu ul li a h4 {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.63rem;
color: #FFFFFF;
margin-bottom: 2rem;
}
.fuwu ul li a {
width: 20rem;
box-sizing: border-box;
height: 100%;
padding-top: 20rem;
padding-bottom: 16rem;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.fuwu ul li a img {
margin-bottom: 2.63rem;
}
.fuwu ul li a h3 {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #FFFFFF;
padding-bottom:15rem;
}
.fuwu ul li a p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 0.88rem;
color: #FFFFFF;
line-height: 1.88rem;
text-align: center;
width: 20rem;
}
.fuwu ul li a p span{
width: 20rem; display:inline-block;
line-height: 1.88rem;
height:5rem;
text-wrap-mode:wrap!important;
}
/* 新闻咨询 */
.new-container {
display: flex;
margin: 7.38rem 14rem 1rem 14rem;
background: #F7F7F7;
padding-bottom: 3rem;
border-radius: 8px;
overflow: hidden;
position: relative;
}
.new-container .swiper-slide {
background:#FFFFFF;
display: flex;
border-radius:1.25rem;
}
.new-container .left-panel {
width: 46.81rem;
border-radius: 1.25rem 0rem 0rem 1.25rem ;
min-width: 0;
background: #222;
display: flex;
align-items: center;
justify-content: center;
}
.new-container .left-panel .active {
display: block !important;
}
.new-container .left-panel .main-img {
width: 100%;
height: 100%;
background-size: 100% 100%;
object-fit: cover;
border-radius: 0rem 1.25rem 1.25rem 0rem;
}
.new-card-grid {
padding: 0 14rem;
box-sizing: border-box;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 5.25rem 4.06rem;
width: 100%;
margin-bottom: 6.56rem;
}
.new-card-grid a{
text-decoration: none;
}
.new-card-grid .card {
border-radius: 8px;
overflow: hidden;
display: flex;
flex-direction: column;
min-width: 0;
transition: all 1s ease;
text-decoration: none;
}
.new-card-grid .card:hover {
color: #FFFFFF !important;
}
.new-card-grid .card:hover .card-date,
.new-card-grid .card:hover .card-title,
.new-card-grid .card:hover .card-title p,
.new-card-grid .card:hover .card-link {
color: #D7000F !important;
}
.new-container .right-panel{
width:44.25rem;
box-sizing:box-sizing;
padding: 2rem 3.25rem 3.81rem 2.81rem;
display: flex;
flex-direction: column;
}
.new-container .right-panel .card-date {
margin-bottom: 2.31rem;
}
.new-container .right-panel .card-date span {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 0.88rem;
color: #D7000F;
padding: 0.56rem;
background: #F2D2D4;
border-radius: 0.25rem;
}
.new-container .right-panel h5 {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.38rem;
color: #D7000F;
}
.new-container .right-panel .time {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #A4A4A4;
margin-top: 1.69rem;
margin-bottom: 3.19rem;
}
.new-container .right-panel p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.125rem;
color: #646464;
line-height: 2.13rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
}
.new-container .right-panel .card-link {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #D7000F;
margin-top: 4rem;
}
.new-container .right-panel .card-link {
position: relative;
}
.new-container .right-panel .card-link::after {
content: '';
width: 1.11rem;
height: 0.53rem;
background-size: 100% 100%;
top: 30%;
left: 5.15rem;
background-image: url(../images/more2.png);
position: absolute;
}
.new-card-grid .card:hover img {
transform: scale(1.1);
}
.new-card-grid .card .card-img {
position: relative;
overflow: hidden;
width: 100%;
height: 17.89rem;
background: #000000;
border-radius: 1.25rem;
}
.new-card-grid .card .card-img img {
width: 100%;
height: 20.38rem;
object-fit: cover;
display: block;
transition: all 1s ease;
}
.new-card-grid .card .card-date {
text-align: center;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
color: #222122;
font-size: 1rem;
z-index: 2;
transition: all 1s ease;
margin-top: 2.19rem;
}
.new-card-grid .card .card-date span:nth-child(1) {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 0.88rem;
color: #D7000F;
display: block;
padding: 0.69rem 0.56rem;
background: #F2D2D4;
border-radius: 0.25rem;
}
.new-card-grid .card .card-date span:nth-child(2) {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #222122;
}
.new-card-grid .card .card-link {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #222122;
text-decoration: none;
transition: all 1s ease;
position: relative;
}
.new-card-grid .card .card-link::after {
content: '';
width: 1.11rem;
height: 0.53rem;
background-size: 100% 100%;
top: 30%;
left: 5.15rem;
background-image: url(../images/more1.png);
position: absolute;
}
.new-card-grid .card:hover .card-link::after {
background-image: url(../images/more2.png);
}
.new-card-grid .card .card-title {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 1.38rem;
color: #222122;
line-height: 2.13rem;
transition: all 1s ease;
margin-top: 2.13rem;
margin-bottom: 3.15rem;
}
.new-card-grid .card .card-title p {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
transition: all 1s ease;
}
.card-blue {
background: #2196f3;
color: #fff;
}
.card-blue .card-title,
.card-blue .card-link {
color: #fff;
}
.card-blue .card-link:hover {
color: #e3f2fd;
}
.card-blue .card-date {
background: #1565c0;
}
.xlsbxq {
margin: 5.44rem 14rem 9.94rem 14rem;
display: flex;
flex-direction: column;
}
.card-blue img {
background: #fff;
object-fit: contain;
padding: 18px 0 0 0;
height: 120px;
}
/* 训练设备详情 */
.xlsbxq .text {
padding-left: 12rem;
padding-right: 12rem;
margin-bottom: 5.19rem;
}
.xlsbxq .text p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.25rem;
color: #565656;
line-height: 2.13rem;
}
.xlsbxq .text span {
width: 13.25rem;
height: 3.63rem;
background: #D70110;
border-radius: 1.81rem;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #FFFFFF;
display: inline-block;
text-align: center;
line-height: 3.63rem;
margin-top: 4.88rem;
}
.xlsbxq .text span a{
font-size: 1rem;
color: #FFFFFF;
line-height: 3.63rem;
}
.xlsbxq .text img {
width: 1.13rem;
height: 1.06rem;
background-size: 100% 100%;
object-fit: cover;
}
.xlsb .project{
padding: 10.94rem 38.38rem 8rem 35.06rem
}
.kcpx-pxkc .project{
padding: 10.94rem 38.38rem 8rem 35.06rem
}
.layui-btn+.layui-btn {
margin-left:0!important;
}
.xlsb .project h3{
margin-bottom:1rem;
}
.xlsbxq .layui-colla-title {
height: 4.25rem;
line-height: 4.25rem;
display: flex;
padding: 0;
padding-left: 3.19rem;
}
.xlsbxq .first-layui-colla-title {
padding: 0;
background-size: 100% 100%;
padding-left: 3.39rem;
padding-right: 8.39rem;
display: flex;
box-sizing: border-box;
align-items: center;
justify-content: space-between;
margin-bottom:1.3rem;
background: linear-gradient(90deg, #d80f15 0%, #FFFFFF 100%);
}
.xlsbxq .layui-show .first-layui-colla-title {
margin-bottom:0rem;
}
.xlsbxq .first-layui-colla-title h3 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.38rem;
color: #FFFFFF;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.xlsbxq .first-layui-colla-title .close {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #D6000F;
display: flex;
align-items: center;
}
.first-layui-colla-title .layui-colla-icon {
display: none;
}
.xlsbxq .layui-colla-content {
padding: 0;
}
/* .layui-colla-icon{
display: none;
} */
.layui-badge-rim, .layui-border, .layui-colla-content, .layui-colla-item, .layui-collapse, .layui-elem-field, .layui-form-pane .layui-form-item[pane], .layui-form-pane .layui-form-label, .layui-input, .layui-input-split, .layui-panel, .layui-quote-nm, .layui-select, .layui-tab-bar, .layui-tab-card, .layui-tab-title, .layui-tab-title .layui-this:after, .layui-textarea{
border:none!important;
}
.xlsbxq .layui-colla-title P:nth-child(1) {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 0.88rem;
color: #9E9E9E;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
width: 23.09rem;
margin-right: 3.4rem;
}
.xlsbxq .layui-colla-title P:nth-child(2) {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1rem;
color: #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
color: #333333;
flex: 1;
}
.xlsbxq .layui-colla-content .layui-icon-right:before {
display: none;
}
.xlsbxq .layui-colla-content .layui-colla-title:nth-child(2n+1) {
background-color: #ffffff;
}
.xlsbxq .layui-colla-content .layui-colla-title:nth-child(2n) {
background: #F7F7F7;
}
.layui-icon-right {
position: relative;
}
.layui-icon-right:before {
content: '' !important;
display: inline-block;
/* 确保宽高生效 */
width: 0.81rem;
height: 0.44rem;
background-repeat: no-repeat;
background-size: 100% 100%;
background-image: url(../images/syy.png) !important;
position: absolute;
left: 0;
top: 0.6rem;
}
.layui-icon {
margin-left: 0.75rem;
width: 2.25rem;
display: block;
height: 1.825rem;
position:relative;
}
.time-icons span {
background-size:100% 100%;
display:inline-block;
width: 5.62rem;
height:1rem;
position: absolute;
height: .2rem;
opacity: 0;
font-size: .6vw;
bottom: 0;
left: 0;
-webkit-animation: scrollFn 4s var(--ease) infinite;
animation: scrollFn 4s infinite;
}
.time-icons span:nth-child(1){
bottom:0.5rem;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.time-icons span:nth-child(2){
bottom:1rem;
-webkit-animation-delay: 2s;
animation-delay: 2s;
}
.time-icons span:nth-child(3){
bottom: 1.5rem;
-webkit-animation-delay: 3s;
animation-delay: 3s;
}
.time-icons{
position: absolute;
right: 8%;
width:5.62rem;
height:1.2rem;
bottom: 15%;
z-index: 88;
}
@-webkit-keyframes scrollFn {
0% {
-webkit-transform: scale(.3) translate3d(0,-.4rem,0);
transform: scale(.3) translate3d(0,-.4rem,0);
opacity: 0
}
80% {
-webkit-transform: scale(1) translate3d(0,0,0);
transform: scale(1) translateZ(0);
opacity: 1
}
to {
-webkit-transform: scale(1) translate3d(0,0,0);
transform: scale(1) translateZ(0);
opacity: 0
}
}
@keyframes scrollFn {
0% {
-webkit-transform: scale(.3) translate3d(0,-.4rem,0);
transform: scale(.3) translate3d(0,-.4rem,0);
opacity: 0
}
80% {
-webkit-transform: scale(1) translate3d(0,0,0);
transform: scale(1) translateZ(0);
opacity: 1
}
to {
-webkit-transform: scale(1) translate3d(0,0,0);
transform: scale(1) translateZ(0);
opacity: 0
}
}
.time-icons span:nth-child(1):after {
content: "";
background-image: url(../images/jiantou3.png);
width: 1.24rem;
height: 0.93rem; background-repeat: no-repeat;
z-index: 99;
position: absolute;
object-fit:cover;
position: absolute; /* 或 fixed */
left: 38%;
top: 50%;
transform: translate(-50%, -50%);
animation: upDown 2s infinite;
background-size: 100% 100%;
}
.time-icons span:nth-child(2):after {
content: "";
background-image: url(../images/jiantou2.png);
width: 1.24rem;
height: 0.93rem; background-repeat: no-repeat;
z-index: 99;
position: absolute;
object-fit:cover;
position: absolute; /* 或 fixed */
left: 38%;
top: 50%;
transform: translate(-50%, -50%);
animation: upDown 2s infinite;
background-size: 100% 100%;
}
.time-icons span:nth-child(3):after {
content: "";
background-image: url(../images/jiantou1.png);
width: 1.24rem;
height: 0.93rem; background-repeat: no-repeat;
z-index: 99;
position: absolute;
object-fit:cover;
position: absolute; /* 或 fixed */
left: 38%;
top: 50%;
transform: translate(-50%, -50%);
animation: upDown 2s infinite;
background-size: 100% 100%;
}
/* 页头banner 动画*/
.time-icon span {
background-image:url(../images/tuoy1.png);
background-size:100% 100%;
display:inline-block;
width: 5.62rem;
height:5.62rem;
position: relative;
}
.time-icon{
position: absolute;
left: 50%;
width:5.62rem;
height:5.62rem;
bottom: 4.12rem;
z-index: 88;
}
.time-icon span::after {
content: "";
background-image: url(../images/xiayiye.png);
width: 1.2rem;
background-repeat: no-repeat;
z-index: 99;
height: 0.7rem;
position: absolute;
object-fit:cover;
position: absolute; /* 或 fixed */
left: 38%;
top: 50%;
transform: translate(-50%, -50%);
animation: upDown 2s infinite;
background-size: 100% 100%;
}
@-webkit-keyframes upDown {
0% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
50% {
-webkit-transform: translateY(5px);
transform: translateY(5px);
}
100% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
}
@keyframes upDown {
0% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
50% {
-webkit-transform: translateY(5px);
transform: translateY(5px);
}
100% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
}
/* 展开状态 */
.layui-show .layui-icon-right:before {
background-image: url(../images/xyy.png) !important;
}
.about {
position: relative;
}
.gsjj canvas {
background-color:#FFFFFF;
}
.about .banners-2 {
padding-top:11.5rem;
padding-left: 8.13rem;
padding-right: 8.13rem;
padding-bottom:3rem;
box-sizing: border-box;
background-color: #fff;
height:100%;
position: relative;
}
.banners-2 {
position: relative;
}
.banners-2 img{
width:100%;
height:44.75rem;
object-fit:cover;
background-size:100% 100%;
}
.about footer{
position: absolute;
bottom: -35.4rem;
width: 100%;
z-index: 666;
}
.about .banners-2 .banner_left {
width:100%;
padding-bottom:4rem;
}
.about .banners-2 .banner_left h4 {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 3.2rem;
color: #D7000F;
text-align:center;
}
.about .banners-2 .banner_left p {
margin-top: 1.88rem;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.25rem;
color: #727171;
line-height: 2.19rem;
}
.about .banners-2 .banner_right {
position: absolute;
bottom: 0;
right: 0;
width: 71.25rem;
height: 48.81rem;
}
/* 图片容器基础样式 */
.about .banners-2 .banner_right .bg_bg1,
.about .banners-2 .banner_right .bg_bg2,
.about .banners-2 .banner_right .bg_bg3 {
position: absolute;
overflow: hidden;
/* 关键：容器底部对齐，确保图片从底部开始显示 */
bottom: 0;
}
.about .banners-2 .banner_right .bg_bg1 .imgs,
.about .banners-2 .banner_right .bg_bg2 .imgs,
.about .banners-2 .banner_right .bg_bg3 .imgs{
position: relative;
}
.about .banners-2 .banner_right .bg_bg2 img{
background-size:100% 100%;
}
.data-item {
transform: translateY(100%);
position: absolute;
top: 25%;
left: 40%;
opacity: 0;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 0.88rem;
color: #FFFFFF;
}
.about .banners-2 .banner_right .bg_bg3 .data-item{
left: 45%;
}
.data-item span {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 3.75rem;
text-align: center;
}
.data-item .data-unit{
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
margin-top: 1.4rem;
text-align: center;
}
.about .banners-2 .banner_right .bg_bg1 .imgs .data-item {
color: #D7000F;
left: 52%;
}
.about .banners-2 .banner_right .bg_bg1 .imgs{
width:100%;
height:100%;
}
/* 图片定位和尺寸 */
.about .banners-2 .banner_right .bg_bg1 {
height: 35.88rem;
width: 64.88rem;
right: 26%;
z-index: 5;
}
.about .banners-2 .banner_right .bg_bg1 img {
height: 100%;
width: 100%;
/* 初始状态：向上移动隐藏 */
transform: translateY(100%);
opacity: 0;
}
.about .banners-2 .banner_right .bg_bg2 {
width: 35.56rem;
height: 24.13rem;
right: 17%;
z-index: 12;
}
.about .banners-2 .banner_right .bg_bg2 img {
height: 30rem!important;
transform: translateY(100%);
opacity: 0;
background-size: 100% 100%;
object-fit: contain;
}
.about .banners-2 .banner_right .bg_bg3 {
width: 39.75rem;
height: 48.81rem;
right: 0;
z-index: 10;
}
.about .banners-2 .banner_right .bg_bg3 .imgs {
height: 100%;
width: 100%;
}
.about .banners-2 .banner_right .bg_bg3 img {
height: 100%;
width: 100%;
transform: translateY(100%);
opacity: 0;
}
/* 从下往上生长动画 */
@keyframes growFromBottom {
0% {
/* 开始：完全隐藏在容器下方 */
transform: translateY(100%);
opacity: 0;
}
100% {
/* 结束：完全显示，回到原位 */
transform: translateY(0);
opacity: 1;
}
}
/* 动画应用类 */
.animate-grow {
animation: growFromBottom 1.5s ease-out forwards !important;
}
.kcpx .project{
padding: 10.94rem 38.38rem 8rem 35.06rem;
background: #ffffff;
}
.kcpx .project P{
line-height: 2rem;
}
.kcpx .project h3{
margin-bottom: 1rem;
}
.project {
height:47rem;
box-sizing: border-box;
padding: 16.94rem 28.38rem 12rem 29.06rem;
position: relative;
z-index:33;
}
.project p strong{
text-align:center!important;
}
.project h3 {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 3rem;
color: #000000;
text-align: center;
margin-bottom: 1rem;
}
.project P {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.1rem;
color: #808080;
line-height: 2rem;
}
.banners-img{
height: 53rem;
position: relative;
margin-top: 6.25rem;
}
.banners-img .xlsbxq-b{
bottom: 10.63rem!important;
}
.banners-img .title{
position: absolute;
bottom: 16.81rem;
left: 0;
width: 92.06rem;
height: 13.13rem;
background-color: rgba(255, 255, 255, 0.75);
padding-top: 3.36rem;
box-sizing: border-box;
padding-bottom: 3.75rem;
padding-right:2rem;
padding-left: 19.5rem;
}
.banners-img .title h1{
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.88rem;
color: #D70110;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.fxpxs .banners-img .title p{
-webkit-line-clamp: 2!important;
font-size: 1.8rem;
}
.banners-img .title p{
font-family: SourceHanSansCN;
font-weight: 300;
font-size: 1.8rem;
color: #D70110;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.banners-img img{
background-size: 100% 100%;
object-fit: cover;
width: 100%;
height: 100%;
}
.navigation {
width: 100%;
height: 27.38rem;
background-image: url(../images/nav-bk.png);
background-size: 100% 100%;
object-fit: cover;
display: flex;
justify-content: center;
align-items: center;
background-attachment: fixed;
background-position: center;
background-size: cover;
z-index:99;
position: relative;
}
.navigation ul {
display: flex;
align-items: center;
justify-content: space-between;
width: 92.06rem;
height: 18.56rem;
padding-left: 7.56rem;
padding-right: 7.56rem;
background: #FFFFFF;
border-radius: 1.25rem;
background-color: #ffffff;
}
.navigation ul li {
width: 15rem;
}
.navigation ul li .arrow {
height: 5.0625rem;
display: flex;
justify-content: center;
}
.navigation ul li .content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.navigation ul li .imgs {
width: 6.25rem;
height: 6.25rem;
background: #D7000F;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 2rem;
}
.navigation ul li .arrow .jian-l {
position: relative;
}
.navigation ul li .arrow .jian-l::before {
position: absolute;
content: '';
width: 0.19rem;
height: 0.19rem;
top: 0.5rem;
left: 2.56rem;
background: #D7000F;
}
.navigation ul li .arrow .jian-l::after {
position: absolute;
content: '';
top: 0.5rem;
width: 0.19rem;
height: 0.19rem;
right: 2.56rem;
background: #D7000F;
}
.navigation ul li .arrow img {
width: 0.88rem;
height: 1.25rem;
}
.navigation ul li p {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.25rem;
color: #D7000F;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.navigation ul li .imgs img {
background-size:100% 100%;
object-fit:cover;
}
.navigation ul li .imgs img:nth-child(1){
width: 3.38rem;
height: 2.19rem;
}
.navigation ul li .imgs img:nth-child(1){
width: 2.19rem;
height: 2.44rem;
}
.navigation ul li .imgs img:nth-child(1){
width: 2.75rem;
height: 2.94rem;
}
.navigation ul li:hover .imgs img{
animation: rot 0.5s;
-webkit-animation: rot 0.5s
}
@keyframes rot{
0% { transform:rotate(0deg); -webkit-transform:rotate(0deg); }
25% { transform:rotate(5deg); -webkit-transform:rotate(5deg); }
50% { transform:rotate(-5deg); -webkit-transform:rotate(-5deg); }
75% { transform:rotate(5deg); -webkit-transform:rotate(5deg); }
100% { transform:rotate(0deg); -webkit-transform:rotate(0deg); }
}
.pxkc-box {
width: 100%;
height: 88.28rem;
padding: 5.94rem 13.88rem 7.19rem 14.13rem;
box-sizing: border-box;
display: flex;
flex-direction: column;
background-color: #FFFFFF;
}
.pxkc-box h3 {
font-family: SourceHanSansCN;
font-weight: 500;
font-size: 3rem;
color: #000000;
text-align:center;
margin-bottom:2rem;
}
.pxkc-box .content {
justify-content: space-between;
align-items: center;
display: flex;
}
.pxkc-box .content ul {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.pxkc-box .content ul:nth-child(2n+1) {
height: 40.75rem;
}
.pxkc-box .content ul:nth-child(2) {
height: 63rem;
}
.pxkc-box .content ul li {
width: 27rem;
height: 18.5rem;
position: relative;
border-radius: 0.63rem;
background-repeat:no-repeat;
background-size:100% 100%;
text-shadow: 20px 20px 10px 3px rgba(0, 0, 0, 1);
}
.pxkc-box .content ul li h4 {
position: absolute;
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.5rem;
color: #ffffff;;
line-height: 1.83rem;
left: 1.13rem;
bottom: 2.13rem;
text-shadow: 1px 1px 0px #ccc, 2px 2px 0px #000, 4px 4px 6px rgba(0, 0, 0, 0.2);
}
.fxpxs .project{
padding: 10.94rem 38.38rem 8rem 35.06rem;
}
.pxkc-box .content ul li .mask {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-size: 100% 100%;
width: 27rem;
height: 18.5rem;
background-image: url(../images/pxkc-li.png) ;
background-repeat: no-repeat;
padding: 3.13rem 0rem 0rem 1.13rem;
display: flex;
flex-direction: column;
justify-content: space-between;
border-radius: 0.63rem;
opacity: 0;
}
.pxkc-box .content ul li .mask h3 {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.5rem;
color: #FFFFFF;
position: relative;
text-align:left;
}
.pxkc-box .content ul li .mask h3::after {
position: absolute;
content: '';
width: 2.13rem;
height: 0.25rem;
background: #FFFFFF;
left: 0;
bottom: -1.83rem;
}
.pxkc-box .content ul li .mask span {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #FFFFFF;
}
.pxkc-box .content ul li .mask .more {
width:100%;
height: 4.06rem;
align-items: center;
display: flex;
position: relative;
}
.pxkc-box .content ul li:hover .mask {
opacity: 1;
transition: all ease 1s;
}
.pxkc-box .content ul li .mask .more .imgs {
position: absolute;
right: 0;
border-radius: 0.63rem 0 0 0;
display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
width: 4.0625rem;
height: 4.0625rem;
}
.pxkc-box .content ul li .mask .more .imgs img{
width: 3rem;
height: 3rem;
}
.fxjy {
background-color:rgba(242, 242, 242, 1);
padding-bottom: 6rem;
}
.fxjy .top {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
box-sizing: border-box;
padding: 4.5rem 14rem 4.19rem 14rem;
background-color:RGBA(247, 247, 247, 1);
}
.pxkc-box .top {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
box-sizing: border-box;
margin-bottom:2rem;
}
.pxkc-box .top h3 {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.5rem;
color: #222122;
}
.pxkc-box a {
display: flex
;
justify-content: space-between;
align-items: center;
}
.pxkc-box .top span {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #848484;
padding-right: 2.9rem;
height:3.625rem;
line-height:3.625rem;
}
.pxkc-box .top span::after {
content: "";
width: 2.31rem;
height: 2.31rem;
position: absolute;
display:inline-block;
background-image: url(../images/more.png);
background-size: 100% 100%;
right: 0;
top: -15%;
}
.pxkc-box .top span::after{
content:"";
width: 2.31rem;
height: 2.31rem;
position:absolute;
background-image:url('../images/more.png');
background-size:100% 100%;
right:0;
top:15%;
}
.kcpx-pxkc .fxjy .top{
background-color: rgba(242, 242, 242, 1);
}
.fxjy a{
display: flex;
justify-content: space-between;
align-items: center;
}
.fxjy .top h3 {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.5rem;
color: #222122;
}
.fxjy .jylist {
padding-top: 0;
}
.fxjy .top span {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #848484;
position:relative;
padding-right:2.9rem;
}
.fxjy .top span::after{
content:"";
width: 2.31rem;
height: 2.31rem;
position:absolute;
background-image:url('../images/more.png');
background-size:100% 100%;
right:0;
top:-15%;
}
.pxkc-box .top span:hover{
color:#D7000F ;
cursor:pointer;
}
.pxkc-box .top span:hover::after{
background-image:url('../images/more-a.png');
}
.fxjy .top a:hover span::after{
background-image:url('../images/more-a.png');
cursor:pointer;
}
.fxjy .top a:hover span{
color:#D7000F ;
}
.fxpxs .pxkc-box .top h3{
margin-bottom: 0rem!important;
}
.fxjy .top img {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.5rem;
color: #222122;
width: 2.31rem;
height: 2.31rem;
margin-left: 0.56rem;
}
.kcpxsBox {
height: 36.63rem!important;
padding: 5.94rem 13.88rem 5.44rem 14.13rem;}
.kcpxsBox .content ul {
flex-direction: row;
width: 100%;
height: 18.5rem!important;
}
.kcpxsBox h3{
text-align: center;
}
.kcpxsBox h3{
text-align: center;
}
.kcpxsBox .content ul{
width: 100%!important;
flex-direction: row!important;
}
.ffs-js .layui-tab-title .tab{
display: flex;
justify-content: space-between;
min-width:28rem;
}
.ffs-box{
padding-bottom: 6rem;
background-color: RGBA(247,247,247,1);
}
.ffs-box .container {
max-width: 92.05rem;
padding-top: 5.19rem;
padding-bottom: 5rem;
margin: 0 auto;
}
.ffs-item {
margin-bottom: 15px;
overflow: hidden;
}
.ffs-header {
background: url('../images/red-list.png');
color: white;
padding: 0.94rem 7.75rem 0.94rem 3.38rem;
display: flex;
height: 4.25rem;
justify-content: space-between;
align-items: center;
cursor: pointer;
background-size:100% 100%;
background-repeat:no-repeat;
}
.ffs-title {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.38rem;
color: #FFFFFF;
}
.ffs-box .view-details {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.13rem;
color: #D7000F;
display: flex;
align-items: center;
}
.ffs-box .view-details .imgsd{
width: 2.38rem;
height: 2.38rem;
background: #D7000F;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-left: 0.88rem;
}
.ffs-box .view-details .imgsd img{
width:57%;
height:auto;
}
.ffs-content {
padding: 2.65rem 10.5rem 2.75rem 3.5rem;
border-top: 1px solid #f0f0f0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
min-height: 8.13rem;
overflow: hidden;
transition: max-height 0.3s ease, padding 0.3s ease;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(1) .info-item:nth-child(1){
width:6rem;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(1) .info-item:nth-child(2){
width:18rem;
}
.info-item {
display: flex;
flex-direction: column;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(2) .info-item:nth-child(1){
width:11rem;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(2) .info-item:nth-child(2){
width:11rem;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(2) .info-item:nth-child(3){
width:19rem;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(2) .info-item:nth-child(4){
width:16rem;
}
.info-label {
font-weight: 400;
font-size: 0.88rem;
color: #9E9E9E;
margin-bottom: 0.81em;
}
.info-value {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.13rem;
color: #333333;
}
.ffs-js {
background-color: #ffffff;
box-sizing: border-box;
}
.ffs-js .layui-tab-title {
text-align: center;
}
.ffs-js .layui-tab-content .layui-tab-item .box{
padding:0 14rem 5.3rem 14rem ;
display: flex !important;
justify-content: space-between;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(4) .box{
padding:0 20% 0 20%;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(4) .imgs{
width: auto;
}
.ffs-js .layui-tab-content .layui-tab-item:nth-child(4) .imgs img{
width: auto;
}
.layui-tab-title .layui-this:after{
display: none;
}
.ffs-js .layui-tab-content .text {
height: 100%;
width: 40.81rem;
}
.ffs-js .layui-tab .layui-tab-title{
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.63rem;
color: #222122;
height: 3.69rem;
}
.ffs-js .layui-tab .layui-tab-title li{
height: 100%;
font-size: 1.63rem;
}
.ffs-js .layui-tab .layui-tab-title .layui-this li{
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.63rem;
color: #222122;
}
.ffs-js .layui-tab .layui-tab-title .layui-this {
font-family: SourceHanSansCN;
font-weight: bold;
font-size: 1.63rem;
color: #D7000F;
position: relative;
padding-bottom:2.125rem;
}
.ffs-js .layui-tab .layui-tab-title .layui-this::before{
content: '';
position: absolute;
bottom: 1rem;
left: 50%;
transform: translateX(-50%);
border: none;
width: 3.13rem;
height: 0.19rem;
background: #D7000F;
}
.ffs-js .layui-tab .layui-tab-title{
position:static;
display: flex;
justify-content: center;
align-items: center;
margin-top:5.63rem;
}
.ffs-js .layui-tab-content .text h3 {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 2.25rem;
color: #222122;
margin-bottom: 4.03rem;
}
.ffs-js .layui-tab-content{
padding: 0;
padding-top: 6.14rem;
}
.ffs-js .layui-tab-content .text P {
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1.38rem;
color: #808080;
line-height: 2.69rem;
}
.ffs-js .layui-tab-content .imgs {
height:29rem;
width: 42.88rem;
overflow: hidden;
border-radius:1rem;
}
.ffs-js .layui-tab-content .imgs img{
background-size:100% 100%;
object-fit:cover;
height: 29rem;
width:100%;
border-radius:1rem;
}
.ffs-js .layui-tab{
margin: 0;
}
.ffs-js .layui-tab-content .imgs:hover img{
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.course .swiper-pagination-px {
position: absolute;
bottom: 1.25rem;
left: 0;
right: 0;
width: 100%;
text-align: center;
z-index: 880;
padding: 0 0.625rem;
}
.course .swiper-pagination-px .swiper-pagination-bullet {
width: 1.44rem;
height: 1.44rem;
background-image: url(../images/red-sw.png);
opacity: 1;
z-index: 6666;
background-color: #E3EBF3;
background-size:100% 100%;
}
.course .swiperbox {
position: relative;
}
.course .swiper-pagination-px .swiper-pagination-px-active {
width: 1.44rem;
height: 1.44rem;
background-image: url(../images/swiper-yuan.png);
background-color: #E3EBF3;
}
.lanmu{
background-color: #ffffff;
padding: 4.13rem 8.56rem 0rem 8.19rem;
box-sizing: border-box;
}
.lanmu ul{
height: 36.56rem;
}
.lanmu li {
display: block;
}
.lanmu ul .item{
display: flex;
}
.lanmu li .imgs{
border-radius: 1.875rem;
width: 61.75rem;
height: 36.56rem;
overflow: hidden;
}
.lanmu li .imgs .box{
position: absolute;
background-color: #ffffff;
width:9.6875rem;
height: 8.437rem;
display: flex;
justify-content: center;
align-items: center;
background-size:100% 100%;
left: 0px;
bottom: 0px;
transform-origin: left bottom;
background: url(../images/hu.png) no-repeat;
transition: all 0.5s
cubic-bezier(0.64, 0.6, 0.32, 1.27);
transform: scale(0);
transition: all 0.5s
cubic-bezier(0.64, 0.6, 0.32, 1.27);
transform: scale(0)
}
.lanmu li .imgs .dot{
position:relative;
width:100%;
height:100%;
}
.lanmu li .imgs:hover .box{
transform: scale(1);
transition: all .6s;
}
.lanmu li .imgs:hover .img1{
transition: all .6s;
-webkit-transition: all .6s;
-moz-transition: all .6s;
-ms-transition: all .6s;
-o-transition: all .6s;
}
.lanmu li .box img {
position:absolute;
left:1.19rem;
bottom:1.25rem;
width: 4.38rem !important;
height: 4.38rem !important;
object-fit: cover;
transition: all .6s ease;
-webkit-transition: all .6s ease;
-moz-transition: all .6s ease;
-ms-transition: all .6s ease;
-o-transition: all .6s ease;
}
.lanmu li .imgs img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 1.875rem;}
.lanmu .imgs:hover img {
transform: scale(1.1);
}
.lanmu .nav {
display: flex;
justify-content: center;
gap: 40px;
z-index: 100;
}
.lanmu .top{
margin-bottom: 6.5rem;
height: 5.38rem;
}
.lanmu .nav-item {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
width:14rem;
opacity: 0.7;
transition: all 0.3s ease;
}
.lanmu .nav-item img {
width: 4.13rem;
height:4.13rem;
border-radius: 4px;
object-fit:cover;
}
.lanmu .nav-item span {
display:inline-block;
font-family: SourceHanSansCN;
font-size: 1.88rem;
color: #424242;
white-space: nowrap;
min-width:7rem;
}
.lanmu .nav-item.active {
opacity: 1;
font-weight: bold;
color: #D7000F; /* 激活态文字颜色（示例为红色） */
}
.lanmu ul li .text{
width: 41.5rem;
box-sizing: border-box;
display:flex;
align-items:center;
margin-left: 6.31rem;
}
.lanmu ul li .text h1{
font-family: SourceHanSansCN;
font-size: 1.875rem;
color: #222122;
margin-bottom: 2rem;
}
.lanmu ul li .text p{
font-family: SourceHanSansCN;
font-weight: 800;
color: #222122;
font-family: SourceHanSansCN;
font-weight: 400;
font-size: 1rem;
color: #727171;
line-height: 2.13rem;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.fjgj {
position: absolute;
bottom: -50rem;
z-index: 44;
padding: 20px;
width: 100%;
}
.fjgj .content {
width: 100%;
display:flex;
margin: 0 auto;
}
.fjgj .track-svg {
position: relative;
width:75rem;
height: 52.5rem;
margin: 27px auto;
overflow: visible;
}
.fjgj .dashed-curve:nth-child(1) {
stroke: rgba(215, 0, 15, 0.2);
stroke-width: 1;
stroke-dasharray: 3, 6;
stroke-linecap: round;
stroke-linejoin: round;
fill: none;
}
.fjgj .dashed-curve:nth-child(2) {
stroke: rgba(215, 0, 15, 1);
stroke-width: 1;
stroke-dasharray: 3, 6;
stroke-linecap: round;
stroke-linejoin: round;
fill: none;
transition: stroke-dashoffset 0.1s ease; /* 平滑过渡效果 */
}
/* 飞机样式 */
.plane {
position: absolute;
transition: fill 0.2s ease;
}
.plane img{
width:3rem;
}
.hover-underlines-g{
position: relative;
}
.hover-underlines-g::after {
content: "";
position: absolute;
width: 0%;
height: 0.19rem;
background: #D7000F;
bottom: 0;
left:0;
transition: width 0.3s ease;
}
.hover-underlines-g:hover:after {
width: 100%;
}
.ibcate.hasani.shutwindowup.ani {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
height: 32.75rem;
width: 32.75rem;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.ibcate .bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url("../images/huan.png");
background-size: cover;
background-position: center;
animation: rotateBg 20s linear infinite;
z-index: 1;
}
.ibcate .en {
font-family: Arial;
font-weight: 900;
font-size: 4.25rem;
color: #FFFFFF;
}
.ibcate .cn {
font-family: SourceHanSansCN;
font-weight: 800;
font-size: 2.25rem;
color: #FFFFFF;
}
@keyframes rotateBg {
from {
transform: rotate(0deg); /* 动画起始状态：不旋转 */
}
to {
transform: rotate(360deg); /* 动画结束状态：旋转360度 */
}
}
:root {
--ocean-50: #f0f9ff;
--ocean-100: #e0f2fe;
--ocean-400: #38bdf8;
--ocean-500: #0ea5e9;
--ocean-600: #0284c7;
--ocean-800: #075985;
--ocean-900: #0c4a6e;
--gray-50: #f9fafb;
--gray-600: #4b5563;
--gray-800: #1f2937;
--white: #ffffff;
}
/* 波浪动画关键帧 */
@keyframes wave {
0% {
transform: translateX(0);
}
50% {
transform: translateX(-25%);
}
100% {
transform: translateX(-50%);
}
}
/* 波浪容器 */
.wave-container {
width: 100%;
height: 49rem;
overflow: hidden;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
overflow: hidden;
line-height: 0;
z-index:-1;
}
/* 波浪样式 */
.waves {
position: relative;
display: block;
width: 200%;
height: 200px!important;
}
@media (min-width: 768px) {
.waves {
height: 120px;
}
}
.wave-animation {
animation: wave 8s linear infinite;
}
@media (min-width: 768px) {
.wave-animation-delay {
height: 80px;
}
}
/* .wave-container {
width: 90vw;
max-width: 800px;
height: 70vh;
border-radius: 15px;
overflow: hidden;
position: relative;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
} */
canvas {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color:RGBA(247,247,247,1);
}
.footer-wave-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
line-height: 0;
transform: rotate(180deg);
background-color: transparent;
}
.footer-content {
text-align: center;
position: relative;
z-index: 10;
}
.footer-text {
margin-bottom: 1rem;
}
.social-links {
display: flex;
justify-content: center;
gap: 1rem;
}
.social-links a {
color: var(--ocean-200);
transition: color 0.3s ease;
}
.social-links a:hover {
color: var(--white);
}
.layui-move {
position: fixed;
display: none;
left: 48%;
top: 50%;
padding: 1rem;
z-index: 999;
color: #ffffff;
background-color: rgba(0, 0, 0, 0.5);
}
.bannersd .bg .wave .mask .line:nth-child(1) {
-webkit-transition-delay: 3ms;
transition-delay: 3ms;
}
.bannersd .bg .wave .mask .line:nth-child(2) {
-webkit-transition-delay: 6ms;
transition-delay: 6ms;
}
.bannersd .bg .wave .mask .line:nth-child(3) {
-webkit-transition-delay: 9ms;
transition-delay: 9ms;
}
.bannersd .bg .wave .mask .line:nth-child(4) {
-webkit-transition-delay: 12ms;
transition-delay: 12ms;
}
.bannersd .bg .wave .mask .line:nth-child(5) {
-webkit-transition-delay: 15ms;
transition-delay: 15ms;
}
.bannersd .bg .wave .mask .line:nth-child(6) {
-webkit-transition-delay: 18ms;
transition-delay: 18ms;
}
.bannersd .bg .wave .mask .line:nth-child(7) {
-webkit-transition-delay: 21ms;
transition-delay: 21ms;
}
.bannersd .bg .wave .mask .line:nth-child(8) {
-webkit-transition-delay: 24ms;
transition-delay: 24ms;
}
.bannersd .bg .wave .mask .line:nth-child(9) {
-webkit-transition-delay: 27ms;
transition-delay: 27ms;
}
.bannersd .bg .wave .mask .line:nth-child(10) {
-webkit-transition-delay: 0.03s;
transition-delay: 0.03s;
}
.bannersd .bg .wave .mask .line:nth-child(11) {
-webkit-transition-delay: 33ms;
transition-delay: 33ms;
}
.bannersd .bg .wave .mask .line:nth-child(12) {
-webkit-transition-delay: 36ms;
transition-delay: 36ms;
}
.bannersd .bg .wave .mask .line:nth-child(13) {
-webkit-transition-delay: 39ms;
transition-delay: 39ms;
}
.bannersd .bg .wave .mask .line:nth-child(14) {
-webkit-transition-delay: 42ms;
transition-delay: 42ms;
}
.bannersd .bg .wave .mask .line:nth-child(15) {
-webkit-transition-delay: 45ms;
transition-delay: 45ms;
}
.bannersd .bg .wave .mask .line:nth-child(16) {
-webkit-transition-delay: 48ms;
transition-delay: 48ms;
}
.bannersd .bg .wave .mask .line:nth-child(17) {
-webkit-transition-delay: 51ms;
transition-delay: 51ms;
}
.bannersd .bg .wave .mask .line:nth-child(18) {
-webkit-transition-delay: 54ms;
transition-delay: 54ms;
}
.bannersd .bg .wave .mask .line:nth-child(19) {
-webkit-transition-delay: 57ms;
transition-delay: 57ms;
}
.bannersd .bg .wave .mask .line:nth-child(20) {
-webkit-transition-delay: 0.06s;
transition-delay: 0.06s;
}
.bannersd .bg .wave .mask .line:nth-child(21) {
-webkit-transition-delay: 63ms;
transition-delay: 63ms;
}
.bannersd .bg .wave .mask .line:nth-child(22) {
-webkit-transition-delay: 66ms;
transition-delay: 66ms;
}
.bannersd .bg .wave .mask .line:nth-child(23) {
-webkit-transition-delay: 69ms;
transition-delay: 69ms;
}
.bannersd .bg .wave .mask .line:nth-child(24) {
-webkit-transition-delay: 72ms;
transition-delay: 72ms;
}
.bannersd .bg .wave .mask .line:nth-child(25) {
-webkit-transition-delay: 75ms;
transition-delay: 75ms;
}
.bannersd .bg .wave .mask .line:nth-child(26) {
-webkit-transition-delay: 78ms;
transition-delay: 78ms;
}
.bannersd .bg .wave .mask .line:nth-child(27) {
-webkit-transition-delay: 81ms;
transition-delay: 81ms;
}
.bannersd .bg .wave .mask .line:nth-child(28) {
-webkit-transition-delay: 84ms;
transition-delay: 84ms;
}
.bannersd .bg .wave .mask .line:nth-child(29) {
-webkit-transition-delay: 87ms;
transition-delay: 87ms;
}
.bannersd .bg .wave .mask .line:nth-child(30) {
-webkit-transition-delay: 0.09s;
transition-delay: 0.09s;
}
.bannersd .bg .wave .mask .line:nth-child(31) {
-webkit-transition-delay: 93ms;
transition-delay: 93ms;
}
.bannersd .bg .wave .mask .line:nth-child(32) {
-webkit-transition-delay: 96ms;
transition-delay: 96ms;
}
.bannersd .bg .wave .mask .line:nth-child(33) {
-webkit-transition-delay: 99ms;
transition-delay: 99ms;
}
.bannersd .bg .wave .mask .line:nth-child(34) {
-webkit-transition-delay: 0.102s;
transition-delay: 0.102s;
}
.bannersd .bg .wave .mask .line:nth-child(35) {
-webkit-transition-delay: 0.105s;
transition-delay: 0.105s;
}
.bannersd .bg .wave .mask .line:nth-child(36) {
-webkit-transition-delay: 0.108s;
transition-delay: 0.108s;
}
.bannersd .bg .wave .mask .line:nth-child(37) {
-webkit-transition-delay: 0.111s;
transition-delay: 0.111s;
}
.bannersd .bg .wave .mask .line:nth-child(38) {
-webkit-transition-delay: 0.114s;
transition-delay: 0.114s;
}
.bannersd .bg .wave .mask .line:nth-child(39) {
-webkit-transition-delay: 0.117s;
transition-delay: 0.117s;
}
.bannersd .bg .wave .mask .line:nth-child(40) {
-webkit-transition-delay: 0.12s;
transition-delay: 0.12s;
}
.bannersd .bg .wave .mask .line:nth-child(41) {
-webkit-transition-delay: 0.123s;
transition-delay: 0.123s;
}
.bannersd .bg .wave .mask .line:nth-child(42) {
-webkit-transition-delay: 0.126s;
transition-delay: 0.126s;
}
.bannersd .bg .wave .mask .line:nth-child(43) {
-webkit-transition-delay: 0.129s;
transition-delay: 0.129s;
}
.bannersd .bg .wave .mask .line:nth-child(44) {
-webkit-transition-delay: 0.132s;
transition-delay: 0.132s;
}
.bannersd .bg .wave .mask .line:nth-child(45) {
-webkit-transition-delay: 0.135s;
transition-delay: 0.135s;
}
.bannersd .bg .wave .mask .line:nth-child(46) {
-webkit-transition-delay: 0.138s;
transition-delay: 0.138s;
}
.bannersd .bg .wave .mask .line:nth-child(47) {
-webkit-transition-delay: 0.141s;
transition-delay: 0.141s;
}
.bannersd .bg .wave .mask .line:nth-child(48) {
-webkit-transition-delay: 0.144s;
transition-delay: 0.144s;
}
.bannersd .bg .wave .mask .line:nth-child(49) {
-webkit-transition-delay: 0.147s;
transition-delay: 0.147s;
}
.bannersd .bg .wave .mask .line:nth-child(50) {
-webkit-transition-delay: 0.15s;
transition-delay: 0.15s;
}
.bannersd .bg .wave .mask .line:nth-child(51) {
-webkit-transition-delay: 0.153s;
transition-delay: 0.153s;
}
.bannersd .bg .wave .mask .line:nth-child(52) {
-webkit-transition-delay: 0.156s;
transition-delay: 0.156s;
}
.bannersd .bg .wave .mask .line:nth-child(53) {
-webkit-transition-delay: 0.159s;
transition-delay: 0.159s;
}
.bannersd .bg .wave .mask .line:nth-child(54) {
-webkit-transition-delay: 0.162s;
transition-delay: 0.162s;
}
.bannersd .bg .wave .mask .line:nth-child(55) {
-webkit-transition-delay: 0.165s;
transition-delay: 0.165s;
}
.bannersd .bg .wave .mask .line:nth-child(56) {
-webkit-transition-delay: 0.168s;
transition-delay: 0.168s;
}
.bannersd .bg .wave .mask .line:nth-child(57) {
-webkit-transition-delay: 0.171s;
transition-delay: 0.171s;
}
.bannersd .bg .wave .mask .line:nth-child(58) {
-webkit-transition-delay: 0.174s;
transition-delay: 0.174s;
}
.bannersd .bg .wave .mask .line:nth-child(59) {
-webkit-transition-delay: 0.177s;
transition-delay: 0.177s;
}
.bannersd .bg .wave .mask .line:nth-child(60) {
-webkit-transition-delay: 0.18s;
transition-delay: 0.18s;
}
.bannersd .bg .wave .mask .line:nth-child(61) {
-webkit-transition-delay: 0.183s;
transition-delay: 0.183s;
}
.bannersd .bg .wave .mask .line:nth-child(62) {
-webkit-transition-delay: 0.186s;
transition-delay: 0.186s;
}
.bannersd .bg .wave .mask .line:nth-child(63) {
-webkit-transition-delay: 0.189s;
transition-delay: 0.189s;
}
.bannersd .bg .wave .mask .line:nth-child(64) {
-webkit-transition-delay: 0.192s;
transition-delay: 0.192s;
}
.bannersd .bg .wave .mask .line:nth-child(65) {
-webkit-transition-delay: 0.195s;
transition-delay: 0.195s;
}
.bannersd .bg .wave .mask .line:nth-child(66) {
-webkit-transition-delay: 0.198s;
transition-delay: 0.198s;
}
.bannersd .bg .wave .mask .line:nth-child(67) {
-webkit-transition-delay: 0.201s;
transition-delay: 0.201s;
}
.bannersd .bg .wave .mask .line:nth-child(68) {
-webkit-transition-delay: 0.204s;
transition-delay: 0.204s;
}
.bannersd .bg .wave .mask .line:nth-child(69) {
-webkit-transition-delay: 0.207s;
transition-delay: 0.207s;
}
.bannersd .bg .wave .mask .line:nth-child(70) {
-webkit-transition-delay: 0.21s;
transition-delay: 0.21s;
}
.bannersd .bg .wave .mask .line:nth-child(71) {
-webkit-transition-delay: 0.213s;
transition-delay: 0.213s;
}
.bannersd .bg .wave .mask .line:nth-child(72) {
-webkit-transition-delay: 0.216s;
transition-delay: 0.216s;
}
.bannersd .bg .wave .mask .line:nth-child(73) {
-webkit-transition-delay: 0.219s;
transition-delay: 0.219s;
}
.bannersd .bg .wave .mask .line:nth-child(74) {
-webkit-transition-delay: 0.222s;
transition-delay: 0.222s;
}
.bannersd .bg .wave .mask .line:nth-child(75) {
-webkit-transition-delay: 0.225s;
transition-delay: 0.225s;
}
.bannersd .bg .wave .mask .line:nth-child(76) {
-webkit-transition-delay: 0.228s;
transition-delay: 0.228s;
}
.bannersd .bg .wave .mask .line:nth-child(77) {
-webkit-transition-delay: 0.231s;
transition-delay: 0.231s;
}
.bannersd .bg .wave .mask .line:nth-child(78) {
-webkit-transition-delay: 0.234s;
transition-delay: 0.234s;
}
.bannersd .bg .wave .mask .line:nth-child(79) {
-webkit-transition-delay: 0.237s;
transition-delay: 0.237s;
}
.bannersd .bg .wave .mask .line:nth-child(80) {
-webkit-transition-delay: 0.24s;
transition-delay: 0.24s;
}
.bannersd .bg .wave .mask .line:nth-child(81) {
-webkit-transition-delay: 0.243s;
transition-delay: 0.243s;
}
.bannersd .bg .wave .mask .line:nth-child(82) {
-webkit-transition-delay: 0.246s;
transition-delay: 0.246s;
}
.bannersd .bg .wave .mask .line:nth-child(83) {
-webkit-transition-delay: 0.249s;
transition-delay: 0.249s;
}
.bannersd .bg .wave .mask .line:nth-child(84) {
-webkit-transition-delay: 0.252s;
transition-delay: 0.252s;
}
.bannersd .bg .wave .mask .line:nth-child(85) {
-webkit-transition-delay: 0.255s;
transition-delay: 0.255s;
}
.bannersd .bg .wave .mask .line:nth-child(86) {
-webkit-transition-delay: 0.258s;
transition-delay: 0.258s;
}
.bannersd .bg .wave .mask .line:nth-child(87) {
-webkit-transition-delay: 0.261s;
transition-delay: 0.261s;
}
.bannersd .bg .wave .mask .line:nth-child(88) {
-webkit-transition-delay: 0.264s;
transition-delay: 0.264s;
}
.bannersd .bg .wave .mask .line:nth-child(89) {
-webkit-transition-delay: 0.267s;
transition-delay: 0.267s;
}
.bannersd .bg .wave .mask .line:nth-child(90) {
-webkit-transition-delay: 0.27s;
transition-delay: 0.27s;
}
.bannersd .bg .wave .mask .line:nth-child(91) {
-webkit-transition-delay: 0.273s;
transition-delay: 0.273s;
}
.bannersd .bg .wave .mask .line:nth-child(92) {
-webkit-transition-delay: 0.276s;
transition-delay: 0.276s;
}
.bannersd .bg .wave .mask .line:nth-child(93) {
-webkit-transition-delay: 0.279s;
transition-delay: 0.279s;
}
.bannersd .bg .wave .mask .line:nth-child(94) {
-webkit-transition-delay: 0.282s;
transition-delay: 0.282s;
}
.bannersd .bg .wave .mask .line:nth-child(95) {
-webkit-transition-delay: 0.285s;
transition-delay: 0.285s;
}
.bannersd .bg .wave .mask .line:nth-child(96) {
-webkit-transition-delay: 0.288s;
transition-delay: 0.288s;
}
.bannersd .bg .wave .mask .line:nth-child(97) {
-webkit-transition-delay: 0.291s;
transition-delay: 0.291s;
}
.bannersd .bg .wave .mask .line:nth-child(98) {
-webkit-transition-delay: 0.294s;
transition-delay: 0.294s;
}
.bannersd .bg .wave .mask .line:nth-child(99) {
-webkit-transition-delay: 0.297s;
transition-delay: 0.297s;
}
.bannersd .bg .wave .mask .line:nth-child(100) {
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.bannersd .bg .wave .mask .line:nth-child(101) {
-webkit-transition-delay: 0.303s;
transition-delay: 0.303s;
}
.bannersd .bg .wave .mask .line:nth-child(102) {
-webkit-transition-delay: 0.306s;
transition-delay: 0.306s;
}
.bannersd .bg .wave .mask .line:nth-child(103) {
-webkit-transition-delay: 0.309s;
transition-delay: 0.309s;
}
.bannersd .bg .wave .mask .line:nth-child(104) {
-webkit-transition-delay: 0.312s;
transition-delay: 0.312s;
}
.bannersd .bg .wave .mask .line:nth-child(105) {
-webkit-transition-delay: 0.315s;
transition-delay: 0.315s;
}
.bannersd .bg .wave .mask .line:nth-child(106) {
-webkit-transition-delay: 0.318s;
transition-delay: 0.318s;
}
.bannersd .bg .wave .mask .line:nth-child(107) {
-webkit-transition-delay: 0.321s;
transition-delay: 0.321s;
}
.bannersd .bg .wave .mask .line:nth-child(108) {
-webkit-transition-delay: 0.324s;
transition-delay: 0.324s;
}
.bannersd .bg .wave .mask .line:nth-child(109) {
-webkit-transition-delay: 0.327s;
transition-delay: 0.327s;
}
.bannersd .bg .wave .mask .line:nth-child(110) {
-webkit-transition-delay: 0.33s;
transition-delay: 0.33s;
}
.bannersd .bg .wave .mask .line:nth-child(111) {
-webkit-transition-delay: 0.333s;
transition-delay: 0.333s;
}
.bannersd .bg .wave .mask .line:nth-child(112) {
-webkit-transition-delay: 0.336s;
transition-delay: 0.336s;
}
.bannersd .bg .wave .mask .line:nth-child(113) {
-webkit-transition-delay: 0.339s;
transition-delay: 0.339s;
}
.bannersd .bg .wave .mask .line:nth-child(114) {
-webkit-transition-delay: 0.342s;
transition-delay: 0.342s;
}
.bannersd .bg .wave .mask .line:nth-child(115) {
-webkit-transition-delay: 0.345s;
transition-delay: 0.345s;
}
.bannersd .bg .wave .mask .line:nth-child(116) {
-webkit-transition-delay: 0.348s;
transition-delay: 0.348s;
}
.bannersd .bg .wave .mask .line:nth-child(117) {
-webkit-transition-delay: 0.351s;
transition-delay: 0.351s;
}
.bannersd .bg .wave .mask .line:nth-child(118) {
-webkit-transition-delay: 0.354s;
transition-delay: 0.354s;
}
.bannersd .bg .wave .mask .line:nth-child(119) {
-webkit-transition-delay: 0.357s;
transition-delay: 0.357s;
}
.bannersd .bg .wave .mask .line:nth-child(120) {
-webkit-transition-delay: 0.36s;
transition-delay: 0.36s;
}
.bannersd .bg .wave .mask .line:nth-child(121) {
-webkit-transition-delay: 0.363s;
transition-delay: 0.363s;
}
.bannersd .bg .wave .mask .line:nth-child(122) {
-webkit-transition-delay: 0.366s;
transition-delay: 0.366s;
}
.bannersd .bg .wave .mask .line:nth-child(123) {
-webkit-transition-delay: 0.369s;
transition-delay: 0.369s;
}
.bannersd .bg .wave .mask .line:nth-child(124) {
-webkit-transition-delay: 0.372s;
transition-delay: 0.372s;
}
.bannersd .bg .wave .mask .line:nth-child(125) {
-webkit-transition-delay: 0.375s;
transition-delay: 0.375s;
}
.bannersd .bg .wave .mask .line:nth-child(126) {
-webkit-transition-delay: 0.378s;
transition-delay: 0.378s;
}
.bannersd .bg .wave .mask .line:nth-child(127) {
-webkit-transition-delay: 0.381s;
transition-delay: 0.381s;
}
.bannersd .bg .wave .mask .line:nth-child(128) {
-webkit-transition-delay: 0.384s;
transition-delay: 0.384s;
}
.bannersd .bg .wave .mask .line:nth-child(129) {
-webkit-transition-delay: 0.387s;
transition-delay: 0.387s;
}
.bannersd .bg .wave .mask .line:nth-child(130) {
-webkit-transition-delay: 0.39s;
transition-delay: 0.39s;
}
.bannersd .bg .wave .mask .line:nth-child(131) {
-webkit-transition-delay: 0.393s;
transition-delay: 0.393s;
}
.bannersd .bg .wave .mask .line:nth-child(132) {
-webkit-transition-delay: 0.396s;
transition-delay: 0.396s;
}
.bannersd .bg .wave .mask .line:nth-child(133) {
-webkit-transition-delay: 0.399s;
transition-delay: 0.399s;
}
.bannersd .bg .wave .mask .line:nth-child(134) {
-webkit-transition-delay: 0.402s;
transition-delay: 0.402s;
}
.bannersd .bg .wave .mask .line:nth-child(135) {
-webkit-transition-delay: 0.405s;
transition-delay: 0.405s;
}
.bannersd .bg .wave .mask .line:nth-child(136) {
-webkit-transition-delay: 0.408s;
transition-delay: 0.408s;
}
.bannersd .bg .wave .mask .line:nth-child(137) {
-webkit-transition-delay: 0.411s;
transition-delay: 0.411s;
}
.bannersd .bg .wave .mask .line:nth-child(138) {
-webkit-transition-delay: 0.414s;
transition-delay: 0.414s;
}
.bannersd .bg .wave .mask .line:nth-child(139) {
-webkit-transition-delay: 0.417s;
transition-delay: 0.417s;
}
.bannersd .bg .wave .mask .line:nth-child(140) {
-webkit-transition-delay: 0.42s;
transition-delay: 0.42s;
}
.bannersd .bg .wave .mask .line:nth-child(141) {
-webkit-transition-delay: 0.423s;
transition-delay: 0.423s;
}
.bannersd .bg .wave .mask .line:nth-child(142) {
-webkit-transition-delay: 0.426s;
transition-delay: 0.426s;
}
.bannersd .bg .wave .mask .line:nth-child(143) {
-webkit-transition-delay: 0.429s;
transition-delay: 0.429s;
}
.bannersd .bg .wave .mask .line:nth-child(144) {
-webkit-transition-delay: 0.432s;
transition-delay: 0.432s;
}
.bannersd .bg .wave .mask .line:nth-child(145) {
-webkit-transition-delay: 0.435s;
transition-delay: 0.435s;
}
.bannersd .bg .wave .mask .line:nth-child(146) {
-webkit-transition-delay: 0.438s;
transition-delay: 0.438s;
}
.bannersd .bg .wave .mask .line:nth-child(147) {
-webkit-transition-delay: 0.441s;
transition-delay: 0.441s;
}
.bannersd .bg .wave .mask .line:nth-child(148) {
-webkit-transition-delay: 0.444s;
transition-delay: 0.444s;
}
.bannersd .bg .wave .mask .line:nth-child(149) {
-webkit-transition-delay: 0.447s;
transition-delay: 0.447s;
}
.bannersd .bg .wave .mask .line:nth-child(150) {
-webkit-transition-delay: 0.45s;
transition-delay: 0.45s;
}
.bannersd .bg .wave .mask .line:nth-child(151) {
-webkit-transition-delay: 0.453s;
transition-delay: 0.453s;
}
.bannersd .bg .wave .mask .line:nth-child(152) {
-webkit-transition-delay: 0.456s;
transition-delay: 0.456s;
}
.bannersd .bg .wave .mask .line:nth-child(153) {
-webkit-transition-delay: 0.459s;
transition-delay: 0.459s;
}
.bannersd .bg .wave .mask .line:nth-child(154) {
-webkit-transition-delay: 0.462s;
transition-delay: 0.462s;
}
.bannersd .bg .wave .mask .line:nth-child(155) {
-webkit-transition-delay: 0.465s;
transition-delay: 0.465s;
}
.bannersd .bg .wave .mask .line:nth-child(156) {
-webkit-transition-delay: 0.468s;
transition-delay: 0.468s;
}
.bannersd .bg .wave .mask .line:nth-child(157) {
-webkit-transition-delay: 0.471s;
transition-delay: 0.471s;
}
.bannersd .bg .wave .mask .line:nth-child(158) {
-webkit-transition-delay: 0.474s;
transition-delay: 0.474s;
}
.bannersd .bg .wave .mask .line:nth-child(159) {
-webkit-transition-delay: 0.477s;
transition-delay: 0.477s;
}
.bannersd .bg .wave .mask .line:nth-child(160) {
-webkit-transition-delay: 0.48s;
transition-delay: 0.48s;
}
.bannersd .bg .wave .mask .line:nth-child(161) {
-webkit-transition-delay: 0.483s;
transition-delay: 0.483s;
}
.bannersd .bg .wave .mask .line:nth-child(162) {
-webkit-transition-delay: 0.486s;
transition-delay: 0.486s;
}
.bannersd .bg .wave .mask .line:nth-child(163) {
-webkit-transition-delay: 0.489s;
transition-delay: 0.489s;
}
.bannersd .bg .wave .mask .line:nth-child(164) {
-webkit-transition-delay: 0.492s;
transition-delay: 0.492s;
}
.bannersd .bg .wave .mask .line:nth-child(165) {
-webkit-transition-delay: 0.495s;
transition-delay: 0.495s;
}
.bannersd .bg .wave .mask .line:nth-child(166) {
-webkit-transition-delay: 0.498s;
transition-delay: 0.498s;
}
.bannersd .bg .wave .mask .line:nth-child(167) {
-webkit-transition-delay: 0.501s;
transition-delay: 0.501s;
}
.bannersd .bg .wave .mask .line:nth-child(168) {
-webkit-transition-delay: 0.504s;
transition-delay: 0.504s;
}
.bannersd .bg .wave .mask .line:nth-child(169) {
-webkit-transition-delay: 0.507s;
transition-delay: 0.507s;
}
.bannersd .bg .wave .mask .line:nth-child(170) {
-webkit-transition-delay: 0.51s;
transition-delay: 0.51s;
}
.bannersd .bg .wave .mask .line:nth-child(171) {
-webkit-transition-delay: 0.513s;
transition-delay: 0.513s;
}
.bannersd .bg .wave .mask .line:nth-child(172) {
-webkit-transition-delay: 0.516s;
transition-delay: 0.516s;
}
.bannersd .bg .wave .mask .line:nth-child(173) {
-webkit-transition-delay: 0.519s;
transition-delay: 0.519s;
}
.bannersd .bg .wave .mask .line:nth-child(174) {
-webkit-transition-delay: 0.522s;
transition-delay: 0.522s;
}
.bannersd .bg .wave .mask .line:nth-child(175) {
-webkit-transition-delay: 0.525s;
transition-delay: 0.525s;
}
.bannersd .bg .wave .mask .line:nth-child(176) {
-webkit-transition-delay: 0.528s;
transition-delay: 0.528s;
}
.bannersd .bg .wave .mask .line:nth-child(177) {
-webkit-transition-delay: 0.531s;
transition-delay: 0.531s;
}
.bannersd .bg .wave .mask .line:nth-child(178) {
-webkit-transition-delay: 0.534s;
transition-delay: 0.534s;
}
.bannersd .bg .wave .mask .line:nth-child(179) {
-webkit-transition-delay: 0.537s;
transition-delay: 0.537s;
}
.bannersd .bg .wave .mask .line:nth-child(180) {
-webkit-transition-delay: 0.54s;
transition-delay: 0.54s;
}
.bannersd .bg .wave .mask .line:nth-child(181) {
-webkit-transition-delay: 0.543s;
transition-delay: 0.543s;
}
.bannersd .bg .wave .mask .line:nth-child(182) {
-webkit-transition-delay: 0.546s;
transition-delay: 0.546s;
}
.bannersd .bg .wave .mask .line:nth-child(183) {
-webkit-transition-delay: 0.549s;
transition-delay: 0.549s;
}
.bannersd .bg .wave .mask .line:nth-child(184) {
-webkit-transition-delay: 0.552s;
transition-delay: 0.552s;
}
.bannersd .bg .wave .mask .line:nth-child(185) {
-webkit-transition-delay: 0.555s;
transition-delay: 0.555s;
}
.bannersd .bg .wave .mask .line:nth-child(186) {
-webkit-transition-delay: 0.558s;
transition-delay: 0.558s;
}
.bannersd .bg .wave .mask .line:nth-child(187) {
-webkit-transition-delay: 0.561s;
transition-delay: 0.561s;
}
.bannersd .bg .wave .mask .line:nth-child(188) {
-webkit-transition-delay: 0.564s;
transition-delay: 0.564s;
}
.bannersd .bg .wave .mask .line:nth-child(189) {
-webkit-transition-delay: 0.567s;
transition-delay: 0.567s;
}
.bannersd .bg .wave .mask .line:nth-child(190) {
-webkit-transition-delay: 0.57s;
transition-delay: 0.57s;
}
.bannersd .bg .wave .mask .line:nth-child(191) {
-webkit-transition-delay: 0.573s;
transition-delay: 0.573s;
}
.bannersd .bg .wave .mask .line:nth-child(192) {
-webkit-transition-delay: 0.576s;
transition-delay: 0.576s;
}
.bannersd .bg .wave .mask .line:nth-child(193) {
-webkit-transition-delay: 0.579s;
transition-delay: 0.579s;
}
.bannersd .bg .wave .mask .line:nth-child(194) {
-webkit-transition-delay: 0.582s;
transition-delay: 0.582s;
}
.bannersd .bg .wave .mask .line:nth-child(195) {
-webkit-transition-delay: 0.585s;
transition-delay: 0.585s;
}
.bannersd .bg .wave .mask .line:nth-child(196) {
-webkit-transition-delay: 0.588s;
transition-delay: 0.588s;
}
.bannersd .bg .wave .mask .line:nth-child(197) {
-webkit-transition-delay: 0.591s;
transition-delay: 0.591s;
}
.bannersd .bg .wave .mask .line:nth-child(198) {
-webkit-transition-delay: 0.594s;
transition-delay: 0.594s;
}
.bannersd .bg .wave .mask .line:nth-child(199) {
-webkit-transition-delay: 0.597s;
transition-delay: 0.597s;
}
.bannersd .bg .wave .mask .line:nth-child(200) {
-webkit-transition-delay: 0.6s;
transition-delay: 0.6s;
}
.home .bannersd{
width:120rem;
}
.home .bannersd .bg .wave .mask .line {
width: 2px;
height: 20rem;
background: -webkit-linear-gradient(
bottom,
rgba(215, 0, 15, 0) 0%,
rgba(215, 0, 15, 0.5) 70%
);
background: linear-gradient(
0deg,
rgba(215, 0, 15, 0) 0%,
rgba(215, 0, 15, 0.5) 70%
);
}
.home .bannersd .wave{
width:100rem;
height:16rem;
}
.home .bannersd .bg .w1 {
pointer-events: none;
z-index: 16;
width: 75%;
position: absolute;
right: 1.6rem;
bottom: 0;
}
.home .bannersd .bg .w2{
pointer-events: none;
z-index: 16;
width: 75%;
position: absolute;
right: -31.3rem;
bottom: -.2rem;
}
body {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
color: var(--black);
}
:root {
--main: rgba(175, 226, 38, 1);
--white: #ffffff;
--green: rgba(29, 95, 99, 1);
--orange: #f8c291;
--gray: rgba(26, 56, 55, 0.5);
--black: rgba(26, 56, 55, 1);
--pGray: rgba(26, 56, 55, 0.5);
--ease: cubic-bezier(0.38, 0, 0, 1);
--ease1: cubic-bezier(0.43, 0.195, 0.02, 1);
}
.home .bannersd .bg .wave .mask {
-webkit-mask-image: url(../images/water.svg);
mask-image: url(../images/water.svg);
-webkit-mask-size: 100vw;
mask-size: 100vw;
-webkit-mask-repeat: repeat-x;
mask-repeat: repeat-x;
-webkit-animation: move-svgS 4s linear infinite;
animation: move-svgS 4s linear infinite;
display: grid;
grid-template-columns: repeat(200, 1fr);
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
.zhpx .content{
width: 100%;
padding: 0rem 4.44rem 9.88rem 3.63rem;
}
.zhpx .content .layui-tab{
width: 100%;
}
.zhpx .content .swiperbox{
overflow: hidden;
}
.zhpx .content .left-panel{
width: 63%;
}
.zhpx-container .right-panel{
margin-bottom: 3rem;
}
.zhpx .layui-tab .layui-tab-title li{
font-size: 1.2rem;
line-height: 2.5rem!important;
font-weight: bold;
color: #333333!important;
background:#D7000F!important
color: #fff;
padding: 0 1.25rem;
border-radius: 1.25rem;
cursor: pointer;
transition: background 0.3s;
margin:0 1rem;
}
[data-aos] {
visibility: visible !important;
opacity: 1 !important;
transform: none !important;
animation: none !important;
transition: none !important;
-webkit-animation: none !important;
-webkit-transform: none !important;
}
.zhpx .layui-tab .layui-tab-title:after {
content: "";
border-bottom-color: #eee;
border-bottom-width: 1px;
border-style: none none solid;
bottom: -1rem;
left: 0;
right: auto;
top: auto;
pointer-events: none;
position: absolute;
width: 100%;
z-index: 8;
}
.zhpx .layui-tab .layui-tab-title .layui-this{
color: #D7000F!important;
background:#D7000F!important;
color: #fff!important;
border-radius: 1.25rem;
cursor: pointer;
transition: background 0.3s;
}
.zhpx .layui-tab .layui-tab-title{
height:2.5rem;
}
.zhpx .layui-tab .layui-tab-title li:hover{
background:#D7000F!important;
color: #fff!important;
}
.zhpx .swiper-pagination-bullet-dt{
background-color:#D7000F!important;
opacity: 1;
}
.zhpx .swiper-pagination-dt{
margin-top: 2rem;
text-align: center;
}
.zhpx .content img{
width: 100%;
height: 30.38rem;
object-fit: cover;
}
.zhpx .layui-tab-content{
margin-top: 3rem;
}
.zhpx .layui-tab .layui-tab-title{
display: flex;
justify-content: center;
}
.zhpx{
top: 3rem!important;
}
.zhpx .intro-card{
margin-top:2rem;
position:relative;
}
.zhpx .plans{
position: absolute;
width:3rem;
height:3rem;
background-size:100% 100%;
top: 0rem;
transform: rotate(102deg);
right: 1.5rem;
}
.zhpx .intro-card p{
position:relative;
margin: 0 21rem;
font-weight:normal;
line-height2rem;
color:#808080;
font-size: 1.25rem;
background: #fff;
border-radius: 12px;
padding: 4rem 2.3rem;
margin-bottom:4rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
border-left: 5px solid #D7000F!important;
}
.zhpx .left a{
font-size: 1rem;
}
.zhpx-container p{
font-weight:normal;
font-size:1.25rem;
line-height:2rem;
color:#808080;
}
.zhpx .layui-tab-content{
min-height:45rem;
}
.zhpx-container{
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
@-webkit-keyframes move-svgS {
0% {
-webkit-mask-position-x: 0;
}
to {
-webkit-mask-position-x: 100vw;
}
}
@keyframes move-svgS {
0% {
-webkit-mask-position-x: 0;
}
to {
-webkit-mask-position-x: 100vw;
}
}
/* -webkit-mask-position-x: 535.071px; */