@charset "UTF-8"; body, html { font-size: 0.8333333333vw; } @media (min-width: 1024px) and (max-width: 1366px) { body, html { font-size: 1vw; } } @media (min-width: 767px) and (max-width: 1024px) { body, html { font-size: 1.1111111111vw; } } @media (max-width: 767px) { body, html { font-size: 14px; } } body { font-family: "Roboto", sans-serif !important; background: #121825; overflow: visible; } @media (max-width: 767px){ body{ overflow: hidden; } } body * { outline: none; } p { padding: 0; margin: 0; } :root { --color-bs: #fff; --color-ys: #7F7F7F; --color-zt: #0095FF; --head-height: 4.375rem; --cbasta: 13.5416666667%; --pandrd: 5.375rem; --borderRadius: 2.5rem; } @media (max-width: 1366px) { :root { --cbasta: 12.25%; } } @media (max-width: 768px) { :root { --cbasta: 4%; --pandrd: 2rem; --borderRadius: 1rem; } } .wh { padding: 0 var(--cbasta); } .wh1 { padding: 0 6.1111111111%; } @media (max-width: 768px) { .wh1 { padding: 0 3.5%; } } .flex { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .flex-z { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .flex_left { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .flex_left1 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .flex2 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .flex3 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; } .flex21 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 990px) { .pc-hidden { display: none; } } .m-hidden { display: none; } @media (max-width: 990px) { .m-hidden { display: block; } } @media (max-width: 990px) { body { padding: 0 !important; } } /* end */ @-webkit-keyframes banscaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/ 0% { -webkit-transform: scale(1); transform: scale(1); /*开始为原始大小*/ } 25% { -webkit-transform: scale(1.1); transform: scale(1.1); /*放大1.1倍*/ } 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } 75% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes banscaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/ 0% { -moz-transform: scale(1); transform: scale(1); /*开始为原始大小*/ } 25% { -moz-transform: scale(1.1); transform: scale(1.1); /*放大1.1倍*/ } 50% { -moz-transform: scale(1.2); transform: scale(1.2); } 75% { -moz-transform: scale(1.1); transform: scale(1.1); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes banscaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/ 0% { -o-transform: scale(1); transform: scale(1); /*开始为原始大小*/ } 25% { -o-transform: scale(1.1); transform: scale(1.1); /*放大1.1倍*/ } 50% { -o-transform: scale(1.2); transform: scale(1.2); } 75% { -o-transform: scale(1.1); transform: scale(1.1); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes banscaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/ 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); /*开始为原始大小*/ } 25% { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); /*放大1.1倍*/ } 50% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } 75% { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .swiper { overflow: hidden; } .overa { overflow: hidden; } /* 图片动画 */ .fang { overflow: hidden; display: block; } .fang img { -webkit-transition: all 0.6s; -o-transition: all 0.6s; -moz-transition: all 0.6s; transition: all 0.6s; } .fang:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .xz img { -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .xz:hover img { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); transform: rotateY(180deg); } .top { -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .top:hover { -webkit-transform: translateY(-1rem); -moz-transform: translateY(-1rem); -ms-transform: translateY(-1rem); -o-transform: translateY(-1rem); transform: translateY(-1rem); } .heng1 { display: block; font-size: 0; } .heng1 img { width: 100%; } .hidden { display: none; } .title1 { text-align: center; } .title1 .tit { color: #fff; font-size: 2.0rem; font-weight: 500; line-height: 1.125em; background: -webkit-linear-gradient(top, #007bff -120%, #FFF 156%); background: -moz-linear-gradient(top, #007bff -120%, #FFF 156%); background: -o-linear-gradient(top, #007bff -120%, #FFF 156%); background: linear-gradient(180deg, #007bff -120%, #FFF 156%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } @media (max-width: 768px) { .title1 .tit { font-size: 2rem; } } .title1.tl { text-align: left; } .sa-cont1 { position: relative; } .sa-cont1 .img { position: relative; } .sa-cont1 .img img { width: 100%; -o-object-fit: cover; object-fit: cover; } @media (max-width: 768px) { .sa-cont1 .img img { height: auto; -o-object-fit: cover; object-fit: cover; } } .sa-cont1 .img video { position: absolute; left: 0; top: -20px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @media (max-width: 768px) { .sa-cont1 .img video { display: none; } } .sa-cont1 .sa-a1v1 { display: none; position: absolute; left: 0; bottom: 15%; width: 100%; z-index: 9; } .sa-cont1 .sa-a1v1 .whas { padding: 0 13%; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 { /*display: block !important;*/ /* bottom: auto; top: 35%; */ left: 0%; bottom: 6%; } /*.sa-cont1 .img picture {*/ /*    display: none;*/ /*}*/ } .sa-cont1 .sa-a1v1 .sa-a1b1 img { height: 3.875rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b1 img { height: 1.65rem; } } .sa-cont1 .sa-a1v1 .sa-a1b2 { padding: 7rem 0 7.8125rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b2 { padding: 2rem 0 2rem; } } .sa-cont1 .sa-a1v1 .sa-a1b2 img { height: 13.875rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b2 img { height: 4.5rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 { color: #fff; } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 p, .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c1  p { font-weight: 300; } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c1 { font-size: 0.875rem; line-height: 1.5em; font-weight: 600; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3{ justify-content: center; } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c1 { font-size: 0.875rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c1 .tit { font-size: 1.25rem; line-height: 1.25em; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c1 .tit { font-size: 1.35rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 { padding-left: 1.5rem; border-left: 1px solid #FFFFFF; margin-left: 1.5rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 { margin-left: 1.5rem; padding-left: 1rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 i { width: 2rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 i { width: 2rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 i img { width: 100%; } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 .acta { font-size: 0.875rem; line-height: 1em; margin-left: 1rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 .acta { font-size: 1rem; } } .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 .acta b { display: block; font-size: 1.5rem; line-height: 1.125em; } @media (max-width: 768px) { .sa-cont1 .sa-a1v1 .sa-a1b3 .sa-a1b3c2 .acta b { font-size: 1.35rem; } } .sa-cont1 .sa-a1v2 { position: absolute; right:calc(var(--cbasta) - 4rem); top: 20%; z-index: 1; color: rgba(255, 255, 255, 0.4); font-size: 1.125rem; line-height: 1.5em; font-weight: 300; /*border: 1px solid #fff;*/ padding:   0; border-radius: 3rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v2 { top: 2.5%; font-size: 1rem; right: 4%; } } .sa-cont1 .sa-a1v2 i { font-size: 1.25rem; color: #fff; } @media (max-width: 768px) { .sa-cont1 .sa-a1v2 i { font-size: 1.125rem; } } .sa-cont1 .sa-a1v2 a { color: rgba(255, 255, 255, 0.5); padding:0.25rem 0.5em; } .sa-cont1 .sa-a1v2 a.bs{ color: #fff; } .sa-cont1 .sa-a1v2 a:hover { color: #fff; } .sa-cont1 .sa-a1v3 { position: absolute; right: -webkit-calc(var(--cbasta) * 0.4); right: -moz-calc(var(--cbasta) * 0.4); right: calc(var(--cbasta) * 0.4); bottom: 5.5%; z-index: 9; width: 5.25rem; } @media (max-width: 768px) { .sa-cont1 .sa-a1v3 { width: 2.5rem; display: none; } } .sa-cont1 .sa-a1v3 img { width: 100%; } .reveal1 { position: relative; overflow: hidden; visibility: hidden; } .reveal1 img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transform-origin: center; -moz-transform-origin: center; -ms-transform-origin: center; -o-transform-origin: center; transform-origin: center; } .sa-cont2 { border-bottom: 1px solid #212121; padding: 0.75rem 0; background: rgba(6, 9, 16, 0.95); position: sticky; top: 54px; left: 0; width: 100%; z-index: 99; } @media (max-width: 768px) { .sa-cont2 { display: none; } } @media (max-width: 768px) { .sa-cont2 .as-za1 { -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } .sa-cont2 .as-za1 li a { display: block; color: rgb(255 255 255 / 43%); font-size: 0.9rem; line-height: 2.5rem; padding: 0 1.125em; border-radius: 2.5rem; cursor: pointer; } @media (max-width: 768px) { .sa-cont2 .as-za1 li a { padding: 0 1.125em; line-height: 2.125rem; } } .sa-cont2 .as-za1 li.on a, .sa-cont2 .as-za1 li:hover a { background: #0095FF; color: #fff; } a.moer-xa { color: #0095FF; font-size: 1.0rem; font-weight: 500; line-height: 1.5em; } @media (max-width: 768px) { a.moer-xa { font-size: 1rem; } } a.moer-xa i { display: block; font-size: 0; width: 1.5rem; margin-left: 0.1rem; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } @media (max-width: 768px) { a.moer-xa i { width: 1.25rem; } } a.moer-xa i img { width: 80%; } a.moer-xa:hover i { margin-left: 1rem; } .sa-cont3 { background: url('https://t1-mfs.ezv-test.com/mall/static/topic-page/40a301c18417d7127d40d27c0a0cf244.png') no-repeat center; -o-background-size: 136.875% auto; background-size: 136.875% auto; } .sa-cont3 .sa-a3v1 { padding: 4.375rem 0 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 { position: relative; margin-top: 2.8125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div { z-index: 1; top: 42%; background: rgba(255, 255, 255, 0.75); width: 2rem; height: 2rem; border-radius: 50%; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div.swiper-button-next1 { right: -4.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores{ display: none; } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div.swiper-button-next1 { right: 3%; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div.swiper-button-prev1 { left: -4.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div.swiper-button-prev1 { left: 3%; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div i { color: #333333; font-size: 2.75rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div i { font-size: .875rem; color: rgba(0, 0, 0, 1); } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div i:hover { color: #fff; } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 { border-radius: 1rem; overflow: hidden; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .jt-mores > div i:hover { color: rgba(0, 0, 0, 1); } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 { border-radius: 0; padding: 0 7.5%; } } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 .swiper-slide .img { border-radius: 1rem; overflow: hidden; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 .swiper-slide .img img { width: 100%; aspect-ratio: 1400/584; -o-object-fit: cover; object-fit: cover; } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 .swiper-slide p { display: none; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .mySwiper1 .swiper-slide p { display: block; text-align: center; font-size: 1rem; line-height: 1.5em; color: #fff; margin-top: 1rem; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 { position: absolute; left: 50%; bottom: 1.5rem; width: 96%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; background: rgba(255, 255, 255, 0.1); border-radius: 3.75rem; border: 1px solid rgba(255, 255, 255, 0.5); backdrop-filter: blur(15px); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -1px 0 rgba(255, 255, 255, 0.1), inset 0 0 0px 0px rgba(255, 255, 255, 0); display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 { bottom: 1rem; border-radius: 1rem; position: static; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); margin-top: 1rem; width: 100%; display: none; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 li span { color: rgba(255, 255, 255, 0.3); font-size: 0.875rem; line-height: 3.625rem; text-align: center; padding: 0 0.85em; display: block; cursor: pointer; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; position: relative; } @media (max-width: 768px) { .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 li span { padding: 0 1em; } } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 li span::after { content: ""; position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); width: 0%; height: 2px; background: #fff; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 li.on span { font-weight: 600; color: #fff; } .sa-cont3 .sa-a3v1 .sa-a3v1-c1 .sa-a3v1-d1 li.on span::after { width: 100%; } .sa-cont3 .sa-a3v2 { padding-top: 6.875rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 { margin-top: 3.75rem; position: relative; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .img1 { overflow: hidden; position: relative; width: 56%; margin-left: 7%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .img1 { width: 100%; margin-left: 0; margin-bottom: 1.5rem; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .img1 img { width: 100%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li { position: absolute; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li { -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); transform: scale(0.5); } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li .dan { width: 1.125rem; height: 1.125rem; border-radius: 50%; background: -webkit-linear-gradient(left, rgba(0, 149, 255, 0.8274509804) 0%, rgba(97, 246, 241, 0.7411764706) 100%); background: -moz-linear-gradient(left, rgba(0, 149, 255, 0.8274509804) 0%, rgba(97, 246, 241, 0.7411764706) 100%); background: -o-linear-gradient(left, rgba(0, 149, 255, 0.8274509804) 0%, rgba(97, 246, 241, 0.7411764706) 100%); background: linear-gradient(90deg, rgba(0, 149, 255, 0.8274509804) 0%, rgba(97, 246, 241, 0.7411764706) 100%); cursor: pointer; -webkit-animation: boderM1 3s infinite; -moz-animation: boderM1 3s infinite; -o-animation: boderM1 3s infinite; animation: boderM1 3s infinite; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li .dan::after, .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li .dan::before { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 1.5rem; height: 1.5rem; border-radius: 50%; background: rgba(0, 149, 255, 0.32); } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li .dan::after { -webkit-animation: boderM 3s infinite; -moz-animation: boderM 3s infinite; -o-animation: boderM 3s infinite; animation: boderM 3s infinite; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li .dan::before { -webkit-animation: boderM 3s 0.75s infinite; -moz-animation: boderM 3s 0.75s infinite; -o-animation: boderM 3s 0.75s infinite; animation: boderM 3s 0.75s infinite; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(1) { left: 65%; bottom: 40%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(2) { left: 28%; top: 67%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(3) { left: 74%; top: 29%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(4) { left: 49%; bottom: 52%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(5) { left: 88%; bottom: 59%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d1 li:nth-child(6) { left: 56%; bottom: 51%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li { position: absolute; right: 7%; top: 0; width: 20.6470588235%; z-index: 1; display: none; background: -webkit-linear-gradient(#212838, #212838) padding-box, -webkit-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: -moz-linear-gradient(#212838, #212838) padding-box, -moz-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: -o-linear-gradient(#212838, #212838) padding-box, -o-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: linear-gradient(#212838, #212838) padding-box, linear-gradient(135deg, #0095FF 0%, #61F6F1 100%) border-box; border-radius: 1rem; padding: 2.8125rem 2%; border: 1px solid transparent; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li { position: static; width: 100%; border-radius: 1rem; margin-top: 1rem; padding: 1.25rem 5%; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .tit { color: #FFFFFF; font-size: 1.375rem; line-height: 1.5em; font-weight: 500; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 { margin-top: 1.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 { margin-top: 1rem; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li + li { margin-top: 1.35rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li + li { margin-top: 1rem; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .img { width: 21.6027874564%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .img { width: 13.93728223%; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .img img { width: 100%; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .cont-p { width: 68.9895470383%; color: #fff; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .cont-p { width: 80.1393728223%; } } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .cont-p .titax { font-size: 1.125rem; line-height: 1.4736842105em; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .jast1 li .imbga .cont-p .txt { color: rgba(255, 255, 255, 0.7); font-size: 1.0rem; line-height: 1.1176470588em; } .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .moer-xa { margin-top: 2.25rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v2 .sa-a3v2c1 .sa-a3v2c1d2 > li .moer-xa { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v3 { padding-top: 11.0625rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 { margin-top: 3.125rem; position: relative; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .img { border-radius: 1rem; overflow: hidden; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .img { border-radius: 1rem; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .img img { width: 100%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .img img { -o-object-fit: cover; object-fit: cover; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p { position: absolute; left: 0; width: 100%; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); padding: 0 8.4285714286%; color: #fff; z-index: 1; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p { padding: 0 5%; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .tit { font-weight: 700; line-height: 1.4em; font-size: 2.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .tit { font-size: 1.8rem; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .p1 { font-size: 1.4rem; line-height: 1.1em; margin-top: 0.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .p1 { font-size: 1.35rem; width: 70%; } } .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p a.moer-xa { margin-top: 1.85rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p a.moer-xa { margin-top: 1rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5625rem; margin-top: 2rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 { grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 1.5rem; -webkit-padding-start: 0.5208333333vw; -moz-padding-start: 0.5208333333vw; padding-inline-start: 0.5208333333vw; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; overflow-y: auto; gap: 12px; scrollbar-width: none; } } .sa-cont3 .sa-a3v3 .ast-sft1 li { position: relative; } .sa-cont3 .sa-a3v3 .ast-sft1 li .img { position: relative; border-radius: 1rem; overflow: hidden; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li .img { border-radius: 1rem; width: 160px; } } .sa-cont3 .sa-a3v3 .ast-sft1 li .img::before { content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.45); } .sa-cont3 .sa-a3v3 .ast-sft1 li .img img { width: 100%; aspect-ratio: 330/200; -o-object-fit: cover; object-fit: cover; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p { position: absolute; left: 0; width: 100%; top: 50%; padding: 1rem 2rem; z-index: 2; color: #fff; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p { padding: 1rem 1rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p img { height: 3.8125rem; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto; display: block; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p img { height: 2.5rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p .tit { font-size: 1.875rem; line-height: 1.5em; text-align: center; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p .tit { font-size: 1.25rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p p { height: 0; overflow: hidden; text-align: left; font-size: 1.125rem; line-height: 1.35em; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li .cont-p p { font-size: 0.875rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .img img { -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p img { height: 2.625rem; margin-left: 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p img { height: 2rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p .tit { font-size: 1.35rem; text-align: left; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p .tit { font-size: 1.25rem; } } .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p p { height: 5.4em; margin-top: 1.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v3 .ast-sft1 li:hover .cont-p p { margin-top: 0.65rem; } } .sa-cont3 .sa-a3v4 { padding: 6.75rem 0 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v4 .title1 .tit { background: -webkit-linear-gradient(top, #007bff -120%, #FFF 156%); background: -moz-linear-gradient(top, #007bff -120%, #FFF 156%); background: -o-linear-gradient(top, #007bff -120%, #FFF 156%); background: linear-gradient(180deg, #007bff -120%, #FFF 156%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .sa-cont3 .sa-a3v4 #certify { position: relative; } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify { margin-top: 1.5rem; padding: 0 4%; } } .sa-cont3 .sa-a3v4 #certify .swiper-container { padding: 4vw 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify .swiper-container { padding: 0 15%; } } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide { border-radius: 1.2rem; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; -webkit-transform: scale(0.7); -moz-transform: scale(0.7); -ms-transform: scale(0.7); -o-transform: scale(0.7); transform: scale(0.7); } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide { border-radius: 1rem; -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); } } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide.swiper-slide-active { -webkit-transform: scale(1.125); -moz-transform: scale(1.125); -ms-transform: scale(1.125); -o-transform: scale(1.125); transform: scale(1.125); } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide.swiper-slide-active { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide u { display: block; border-radius: 1rem; overflow: hidden; position: relative; } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide u { border-radius: 1rem; } } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide u::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide img { width: 100%; } .sa-cont3 .sa-a3v4 #certify .swiper-container .swiper-slide.swiper-slide-active u::after { opacity: 0; } .sa-cont3 .sa-a3v4 #certify .swiper-pagination { position: static; } @media (max-width: 768px) { .sa-cont3 .sa-a3v4 #certify .swiper-pagination { margin-top: 1.25rem; } } .swiper_ast_aft1 .swiper-pagination span, .sa-cont3 .sa-a3v4 #certify .swiper-pagination span { background: #4F4E4E; width: 1.1875rem; height: 0.375rem; border-radius: 0.375rem; margin: 0 0.25rem !important; opacity: 1; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; position: relative; overflow: hidden; } .swiper_ast_aft1 .swiper-pagination span:after, .sa-cont3 .sa-a3v4 #certify .swiper-pagination span:after{ content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #0095FF; border-radius: 0.375rem; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left center; -moz-transform-origin: left center; -ms-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .swiper_ast_aft1 .swiper-pagination span.swiper-pagination-bullet-active, .sa-cont3 .sa-a3v4 #certify .swiper-pagination span.swiper-pagination-bullet-active { background: #4F4E4E; width: 2rem; }.swiper_ast_aft1 .swiper-pagination  { margin-top: 1.25rem; } .swiper_ast_aft1 .swiper-pagination span.swiper-pagination-bullet-active:after, .sa-cont3 .sa-a3v4 #certify .swiper-pagination span.swiper-pagination-bullet-active:after { -webkit-animation: swiperPaginationProgress 3s linear forwards; -moz-animation: swiperPaginationProgress 3s linear forwards; -o-animation: swiperPaginationProgress 3s linear forwards; animation: swiperPaginationProgress 3s linear forwards; } @-webkit-keyframes swiperPaginationProgress { from { -webkit-transform: scaleX(0); transform: scaleX(0); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @-moz-keyframes swiperPaginationProgress { from { -moz-transform: scaleX(0); transform: scaleX(0); } to { -moz-transform: scaleX(1); transform: scaleX(1); } } @-o-keyframes swiperPaginationProgress { from { -o-transform: scaleX(0); transform: scaleX(0); } to { -o-transform: scaleX(1); transform: scaleX(1); } } @keyframes swiperPaginationProgress { from { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } to { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); } } @-webkit-keyframes swiperPaginationProgressY { from { -webkit-transform: scaleY(0); transform: scaleY(0); } to { -webkit-transform: scaleY(1); transform: scaleY(1); } } @-moz-keyframes swiperPaginationProgressY { from { -moz-transform: scaleY(0); transform: scaleY(0); } to { -moz-transform: scaleY(1); transform: scaleY(1); } } @-o-keyframes swiperPaginationProgressY { from { -o-transform: scaleY(0); transform: scaleY(0); } to { -o-transform: scaleY(1); transform: scaleY(1); } } @keyframes swiperPaginationProgressY { from { -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); } to { -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); } } .sa-cont3 .sa-a3v5 { padding-top: 4.625rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa { margin-top: 2rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a { height: 29rem; position: relative; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide { background: #212838; border-radius: 1rem; padding: 1.6rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide { border-radius: 1.5rem; padding: 1.65rem 3.5%; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .img { width: 45rem; border-radius: 1.25rem; overflow: hidden; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .img img { width: 45rem; height: 25.875rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .img { width: 354px; height: 202px; border-radius: 1rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .img img { width: 354px; height: 202px; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p { width: 42%; padding-right: 2rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p { width: 100%; margin-top: 1.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .data i { display: block; font-size: 0; width: 1.0625rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .data i img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .data p { color: rgba(255, 255, 255, 0.7); font-size: 0.875rem; line-height: 1.4285714286em; margin-left: 0.45em; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p a.tit { display: block; font-size: 1.4rem; line-height: 1.1851851852em; color: #fff; margin: 1.5rem 0; text-align: left; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p a.tit { font-size: 1.25rem; margin: 1rem 0; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 { margin-top: 4rem; padding-right: 3rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 .ashta1 u { display: block; font-size: 0; /* width: 2.75rem; */ border-radius: 50%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 .ashta1 u img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 .ashta1 p { color: #FFFFFF; font-size: 1rem; line-height: 1.5em; margin-left: 1rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p .asht-a1 .asx { font-size: 1rem; color: rgba(255, 255, 255, 0.7); font-size: 1rem; line-height: 1.5em; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-pagination { position: absolute; right: 1.5rem; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); z-index: 9; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-pagination span { background: #4F4E4E; width: 0.375rem; height: 0.375rem; border-radius: 0.375rem; margin: 0.5rem 0 !important; opacity: 1; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; position: relative; overflow: hidden; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-pagination span:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #0095FF; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: center top; -moz-transform-origin: center top; -ms-transform-origin: center top; -o-transform-origin: center top; transform-origin: center top; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-pagination span.swiper-pagination-bullet-active { background: #4F4E4E; height: 1.65rem; width: 0.375rem !important; } .swiper-pagination-bullet-active:after{ background-color: #0095FF !important; } .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-pagination span.swiper-pagination-bullet-active:after { -webkit-animation: swiperPaginationProgressY 3s linear forwards; -moz-animation: swiperPaginationProgressY 3s linear forwards; -o-animation: swiperPaginationProgressY 3s linear forwards; animation: swiperPaginationProgressY 3s linear forwards; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 { margin-top: 3.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li { background: #101319; border-radius: 2.5rem; padding: 3.5rem 3%; position: sticky; top: -webkit-calc(var(--head-height) + 4rem); top: -moz-calc(var(--head-height) + 4rem); top: calc(var(--head-height) + 4rem); } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li { border-radius: 1.5rem; padding: 1.65rem 3.5%; position: static; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li + li { margin-top: 2rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li + li { margin-top: 1.25rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .img { width: 54.0769230769%; border-radius: 1.25rem; overflow: hidden; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .img { width: 100%; border-radius: 1rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .img img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p { width: 40%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p { width: 100%; margin-top: 1.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .data i { display: block; font-size: 0; width: 1.0625rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .data i img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .data p { color: rgba(255, 255, 255, 0.7); font-size: 0.875rem; line-height: 1.4285714286em; margin-left: 0.45em; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p a.tit { display: block; font-size: 1.6875rem; line-height: 1.1851851852em; color: #fff; margin: 1.5rem 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p a.tit { font-size: 1.25rem; margin: 1rem 0; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 { margin-top: 4rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 { margin-top: 1.5rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 .ashta1 u { display: block; font-size: 0; width: 2.75rem; border-radius: 50%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 .ashta1 u img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 .ashta1 p { color: #FFFFFF; font-size: 1rem; line-height: 1.5em; margin-left: 1rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c1 li .cont-p .asht-a1 .asx { font-size: 1rem; color: rgba(255, 255, 255, 0.7); font-size: 1rem; line-height: 1.5em; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 { margin-top: 1.875rem; } @media (min-width: 767px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 { -webkit-padding-start: 0.5208333333vw; -moz-padding-start: 0.5208333333vw; padding-inline-start: 0.5208333333vw; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 1.5rem; width: 100%; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; overflow-y: auto; gap: 12px; padding-bottom: 20px; scrollbar-width: none; } } @media (min-width: 767px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 li { width: 31.2142857143%; } } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx { padding:  1.25rem; display: block; border-radius: 1rem; background-color: #212838; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; position: relative; border: 1px solid transparent; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx { border-radius: 1rem; padding: 1.5rem 1.35rem; width: 250px; } } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx u { display: block; font-size: 0; border-radius: 0.625rem; overflow: hidden; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx u img { width: 25rem !important; height: 14.375rem !important; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx u img { width: 227px !important; height: 130px !important; } } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .data { padding: 1.35rem 0 1.125rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .data i { display: block; font-size: 0; width: 1.0625rem; margin-right: 0.5rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .data i img { width: 100%; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .data p { color: rgba(255, 255, 255, 0.7); font-size: 0.875rem; line-height: 1.4285714286em; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .tit { color: rgba(255, 255, 255, 0.5); font-size: 1.125rem; line-height: 1.375em; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; font-weight: 300; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .tit { font-size: 1.25rem; } } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx:hover { background: -webkit-linear-gradient(#101319, #101319) padding-box, -webkit-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: -moz-linear-gradient(#101319, #101319) padding-box, -moz-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: -o-linear-gradient(#101319, #101319) padding-box, -o-linear-gradient(315deg, #0095FF 0%, #61F6F1 100%) border-box; background: linear-gradient(#101319, #101319) padding-box, linear-gradient(135deg, #0095FF 0%, #61F6F1 100%) border-box; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx:hover .tit { color: #fff; } .sa-cont3 .sa-a3v5 a.moer-xa { margin-top: 3.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 a.moer-xa { margin-top: 0; margin-left: 20px; } } .sa-cont3 .sa-a3v6 { padding-top: 6.625rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v6 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v6 .sa-a3b6c1 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 2.8125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v6 .sa-a3b6c1 { margin-top: 1.5rem; gap: 1.5rem 0; } } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li { width: 22.3571428571%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v6 .sa-a3b6c1 li { width: 47%; } } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa { display: block; position: relative; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt { border-radius: 1.25rem; overflow: hidden; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt u { display: block; font-size: 0; position: relative; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt u::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 39.1719745223%; background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); z-index: 1; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt u::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 39.1719745223%; background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 100%); z-index: 1; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt u img { width: 100%; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .con-axt p { position: absolute; left: 0; top: 1em; width: 100%; padding: 0 7.5%; color: #fff; font-size: 1.125rem; line-height: 1.3333333333em; z-index: 2; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .xz-more { position: absolute; width: 4.0625rem; height: 4.0625rem; background: -webkit-linear-gradient(left, #0095FF 0%, #61F6F1 100%); background: -moz-linear-gradient(left, #0095FF 0%, #61F6F1 100%); background: -o-linear-gradient(left, #0095FF 0%, #61F6F1 100%); background: linear-gradient(90deg, #0095FF 0%, #61F6F1 100%); z-index: 3; right: -1rem; bottom: 10%; border-radius: 50%; opacity: 0; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } @media (max-width: 768px) { .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .xz-more { width: 4rem; height: 4rem; } } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa .xz-more img { width: 45%; } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa:hover .con-axt { -webkit-transform: rotate(9.493deg); -moz-transform: rotate(9.493deg); -ms-transform: rotate(9.493deg); -o-transform: rotate(9.493deg); transform: rotate(9.493deg); } .sa-cont3 .sa-a3v6 .sa-a3b6c1 li a.imgxa:hover .xz-more { opacity: 1; } .sa-cont3 .sa-a3v7 { padding-top: 8.375rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v7 { padding-top: 2.5rem; } } .sa-cont3 .sa-a3v7 .xzmh-conxa { width: 100%; height: 30.1875rem; position: relative; margin-top: 0; } @media (max-width: 768px) { .sa-cont3 .sa-a3v7 .xzmh-conxa { margin-top: 1.5rem; height: 20rem; } } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform-origin: center center; -moz-transform-origin: center center; -ms-transform-origin: center center; -o-transform-origin: center center; transform-origin: center center; -webkit-animation: carouselRotateY 60s linear infinite; -moz-animation: carouselRotateY 60s linear infinite; -o-animation: carouselRotateY 60s linear infinite; animation: carouselRotateY 60s linear infinite; } @-webkit-keyframes carouselRotateY { 0% { -webkit-transform: translate(-50%, -50%) rotateY(0deg); transform: translate(-50%, -50%) rotateY(0deg); } 100% { -webkit-transform: translate(-50%, -50%) rotateY(360deg); transform: translate(-50%, -50%) rotateY(360deg); } } @-moz-keyframes carouselRotateY { 0% { -moz-transform: translate(-50%, -50%) rotateY(0deg); transform: translate(-50%, -50%) rotateY(0deg); } 100% { -moz-transform: translate(-50%, -50%) rotateY(360deg); transform: translate(-50%, -50%) rotateY(360deg); } } @-o-keyframes carouselRotateY { 0% { transform: translate(-50%, -50%) rotateY(0deg); } 100% { transform: translate(-50%, -50%) rotateY(360deg); } } @keyframes carouselRotateY { 0% { -webkit-transform: translate(-50%, -50%) rotateY(0deg); -moz-transform: translate(-50%, -50%) rotateY(0deg); transform: translate(-50%, -50%) rotateY(0deg); } 100% { -webkit-transform: translate(-50%, -50%) rotateY(360deg); -moz-transform: translate(-50%, -50%) rotateY(360deg); transform: translate(-50%, -50%) rotateY(360deg); } } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure { position: absolute; margin: 0; top: 50%; left: 50%; width: min(48vw, 42rem); -webkit-transform-origin: center center; -moz-transform-origin: center center; -ms-transform-origin: center center; -o-transform-origin: center center; transform-origin: center center; overflow: hidden; border-radius: 8px; -webkit-transition: -webkit-transform 0.5s ease; transition: -webkit-transform 0.5s ease; -o-transition: -o-transform 0.5s ease; -moz-transition: transform 0.5s ease, -moz-transform 0.5s ease; transition: transform 0.5s ease; transition: transform 0.5s ease, -webkit-transform 0.5s ease, -moz-transform 0.5s ease, -o-transform 0.5s ease; -webkit-backface-visibility: visible; -moz-backface-visibility: visible; backface-visibility: visible; } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure a.more-ax { display: block; width: 2.8rem; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure a.more-ax img { width: 100%; } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure { width: 21.3125rem; -webkit-transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(25rem); -moz-transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(25rem); transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(25rem); border-radius: 8px; } @media (max-width: 768px) { .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure { width: 16.625rem; -webkit-transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(16rem); -moz-transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(16rem); transform: translate(-50%, -50%) rotateY(var(--rotate-y)) translateZ(16rem); } } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure img { border-radius: 8px; } .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure img, .sa-cont3 .sa-a3v7 .xzmh-conxa .carousel figure video { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; display: block; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; cursor: pointer; -webkit-backface-visibility: visible; -moz-backface-visibility: visible; backface-visibility: visible; aspect-ratio: 16 / 9; } .sa-cont3 .sa-a3v8 { padding-top: 1.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v8 { padding-top: 1.5rem; } } .sa-cont3 .sa-a3v8 .picList li { float: left; width: 21.0625rem; margin-right: 1.5rem; border-radius: 1.25rem; overflow: hidden; } @media (max-width: 768px) { .sa-cont3 .sa-a3v8 .picList li { width: 10rem; margin-right: 1rem; border-radius: 0.875rem; } } .sa-cont3 .sa-a3v8 .picList li img { aspect-ratio: 353/212; -o-object-fit: cover; object-fit: cover; } .sa-cont3 .sa-a3v8 .asht2 { margin-top: 1.5rem; } .sa-cont3 .sa-a3v9 { padding: 7.1875rem 0 3rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 { padding: 2.5rem 0 1rem; } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva1 { width: 100%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva1 { width: 100%; /* padding: 0 6%; */ } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva1  .title1 .tit{ /*text-align: center;*/ } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva1 .p1 { color: #fff; font-size: 1.5rem; line-height: 1.3333333333em; margin-top: 1.5rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva1 .p1 { margin-top: 1rem; font-size: 1.125rem; } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 { width: 100%; margin-top: 2rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 { width: 100%;margin-top: 1.5rem; } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li { background: #212838; border-radius: 1rem; padding: 2.5rem 4.5% 3rem; width: 48%; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li { border-radius: 1rem; padding: 2rem 6% 2rem;width: 100%; } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li+li{ margin-top: 1.25rem; } } /*.sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li + li {*/ /*  margin-top: 2rem;*/ /*}*/ /*@media (max-width: 768px) {*/ /*  .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li + li {*/ /*    margin-top: 1.5rem;*/ /*  }*/ /*}*/ .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .tit { color: #fff; font-weight: 700; font-size: 1.25rem; line-height: 1.5em; } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 1rem 0; margin-top: 1.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 { gap: 0.785rem 0; margin-top: 1rem; } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx { display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; width: 50%; } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx i { display: block; font-size: 0; width: 1.25rem; margin-right: 1rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx i { width: 1.125rem; margin-right: 0.65rem; } } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx i img { width: 100%; } .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx p { color: rgba(255, 255, 255, 0.7); font-size: 1.125rem; } @media (max-width: 768px) { .sa-cont3 .sa-a3v9 .sa-a3v9cvt1 .sa-a3v9cva2 .as-sxt1 li .asjht1 a.asx p { font-size: 0.875rem; } } @-webkit-keyframes boderM { 0% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(2); transform: translate(-50%, -50%) scale(2); opacity: 0; } 100% { opacity: 0; } } @-moz-keyframes boderM { 0% { -moz-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { opacity: 1; } 75% { -moz-transform: translate(-50%, -50%) scale(2); transform: translate(-50%, -50%) scale(2); opacity: 0; } 100% { opacity: 0; } } @-o-keyframes boderM { 0% { -o-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { opacity: 1; } 75% { -o-transform: translate(-50%, -50%) scale(2); transform: translate(-50%, -50%) scale(2); opacity: 0; } 100% { opacity: 0; } } @keyframes boderM { 0% { -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(2); -moz-transform: translate(-50%, -50%) scale(2); -o-transform: translate(-50%, -50%) scale(2); transform: translate(-50%, -50%) scale(2); opacity: 0; } 100% { opacity: 0; } } @-webkit-keyframes boderM1 { 0% { -webkit-transform: scale(1); transform: scale(1); } 20% { -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { -webkit-transform: scale(1); transform: scale(1); } 75% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes boderM1 { 0% { -moz-transform: scale(1); transform: scale(1); } 20% { -moz-transform: scale(0.8); transform: scale(0.8); } 50% { -moz-transform: scale(1); transform: scale(1); } 75% { -moz-transform: scale(1.2); transform: scale(1.2); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes boderM1 { 0% { -o-transform: scale(1); transform: scale(1); } 20% { -o-transform: scale(0.8); transform: scale(0.8); } 50% { -o-transform: scale(1); transform: scale(1); } 75% { -o-transform: scale(1.2); transform: scale(1.2); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes boderM1 { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 20% { -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -o-transform: scale(0.8); transform: scale(0.8); } 50% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 75% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } /*Amy的修改*/ .sa-a3v5 .title1  a { position: absolute; top: 50%; transform: translateY(-50%); right: 0; margin-top: 2rem !important; } .swiper_ast_aft1 .swiper-slide { position: relative; /* border-radius: 1rem; */ } .swiper_ast_aft1 .swiper-slide .img { position: relative; border-radius: 1.875rem; overflow: hidden; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide .img { border-radius: 1rem; width: 100%; }.swiper_ast_aft1 .swiper-slide .img img { aspect-ratio: 16 / 12;} } .swiper_ast_aft1 .swiper-slide .img::before { content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.45); } .swiper_ast_aft1 .swiper-slide .img img { width: 100%; aspect-ratio: 330 / 160; object-fit: cover; transition: all 0.4s; } .swiper_ast_aft1 .swiper-slide .cont-p { position: absolute; left: 0; width: 100%; top: 50%; padding: 1rem 2rem; z-index: 2; color: #fff; transform: translateY(-50%); } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide .cont-p { padding: 1rem 1rem; } } .swiper_ast_aft1 .swiper-slide .cont-p img { height: 3.8125rem; transition: all 0.4s; width: fit-content; margin: 0 auto; display: block; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide .cont-p img { height: 2.5rem; } } .swiper_ast_aft1 .swiper-slide .cont-p .tit { font-size: 1.875rem; line-height: 1.5em; text-align: center; transition: all 0.4s; } .phone_show_767 { display: none; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide .cont-p .tit { font-size: 1.25rem; } .ast-sft1 { display: none; } .phone_show_767 { display: block; } } .swiper_ast_aft1 .swiper-slide .cont-p p { height: 0; overflow: hidden; text-align: left; font-size: 1.125rem; line-height: 1.35em; transition: all 0.4s; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide .cont-p p { font-size: 0.875rem; } } .swiper_ast_aft1 .swiper-slide:hover .img img { transition: all 0.4s; transform: scale(1.1); } .swiper_ast_aft1 .swiper-slide:hover .cont-p img { height: 2.625rem; margin-left: 0; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide:hover .cont-p img { height: 2rem; } /*Amy的修改*/ .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .tit { font-size: 1.58rem; }    .sa-cont3 .sa-a3v3 .sa-a3v3d1 .cont-p .p1 { font-size: 1.125rem; } .sa-cont3 .sa-a3v4 #certify .swiper-container { padding: 0; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .tit, .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a .swiper-slide .flex .cont-p a.tit { font-size: 1.125rem; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 2; overflow: hidden; margin: 0.5rem 0; }.sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a { height: 26.5rem; } .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx .tit { margin-top: 0; }    .sa-cont3 .sa-a3v5 .sa-a3v5c2 li a.imgsx { padding: 1rem 0.75rem; }    .title1 .tit { font-size: 20px; } } .swiper_ast_aft1 .swiper-slide:hover .cont-p .tit { font-size: 1.35rem; text-align: left; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide:hover .cont-p .tit { font-size: 1.25rem; } } .swiper_ast_aft1 .swiper-slide:hover .cont-p p { height: calc(1.35em * 4); margin-top: 1.125rem; } @media (max-width: 768px) { .swiper_ast_aft1 .swiper-slide:hover .cont-p p { margin-top: 0.65rem; } .sa-a3v5 .title1 a { display: none; } .kv-video { display: block !important ; width:100%; position: static !important; height:100%; object-fit:cover; } .sa-cont3 .sa-a3v3 .ast-sft1 { display: none !important; } .swiper_ast_aft1 { margin-top: 1.5rem; }.swiper_ast_aft1 .swiper-slide .cont-p img { height: 2.5rem; } } .sa-cont1 .sa-a1v2 a { padding: 0.125rem 0.875em; } .sa-cont1 .sa-a1v2 { overflow: hidden; z-index: 9; } .sa-cont1 .sa-a1v2::before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #fff; padding: 0; border-radius: 3rem; z-index: -1; } .sa-cont1 .sa-a1v2 a.bs{ background: #fff; border-radius: 0 5rem 5rem 0; color: rgba(6, 9, 16, 0.95); } .sa-a3v2c1d2 .li1   .imbga .img img { padding: 0.25rem; } .sa-a3v2c1d2 .li5 .imbga .img img, .sa-a3v2c1d2 .li1 .jast1 li:nth-child(1) .imbga .img img { padding: 0.375rem; } .sa-a3v2c1d2 .li5 .jast1 li:nth-child(2) .imbga .img img { padding: 0.25rem; } .sa-a3v2c1d2 .li2 .jast1 li:nth-child(3) .imbga .img img { padding: 0.25rem; } .sa-a3v2c1d2 .li2 .jast1 li:first-child .imbga .img img { transform: scale(1.2); } .sa-a3v2c1d2 .li5 .jast1 li:first-child .imbga .img img { padding: 0.125rem; } .sa-a3v2c1d2 .li1 .jast1 li:first-child .imbga .img img { padding: 0.5rem; } @media (max-width: 1280px){ .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a { height: 25.25rem; } .sa-cont2 { padding-left: 1rem; padding-right: 1rem; } } @media (max-width: 768px) { .sa-cont3 .sa-a3v5 .sa-a3v5c1aa .mySwiper1a { height: 27.25rem; } }