.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.popover,
.tooltip,
body,
h1,
h2,
h3,
h4,
h5,
h6,
span {
font-family: "Noto Sans SC", -apple-system, blinkmacsystemfont, "Segoe UI",
roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}
body img {
image-rendering: -webkit-optimize-contrast;
}
html {
font-size: 16px;
}
.qidian_wpa_img {
bottom: 56px !important;
}
.font-weight-thin {
font-weight: 100 !important;
}
.font-weight-extra-light {
font-weight: 200 !important;
}
.font-weight-light {
font-weight: 300 !important;
}
.font-weight-normal {
font-weight: 400 !important;
}
.font-weight-medium {
font-weight: 500 !important;
}
.font-weight-semi-bold {
font-weight: 600 !important;
}
.font-weight-bold {
font-weight: 700 !important;
}
.font-weight-extra-bold {
font-weight: 800 !important;
}
.font-weight-black {
font-weight: 900 !important;
}
ul li {
list-style: none;
}
a:hover {
text-decoration: none;
}
.fixed-top {
background: #fff;
}
header {
color: #121212;
}
header a {
color: inherit !important;
transition: none;
}
header .nav-item:hover .nav-link {
color: rgba(0, 0, 0, 0.5) !important;
}
header .nav-item:hover .nav-link path {
stroke: rgba(0, 0, 0, 0.5) !important;
}
.header-logo-white,
.white-logo ~ #wsc-header .bg-transparent .header-logo-black,
body[data-home] .bg-transparent .header-logo-black {
display: none;
}
.white-logo ~ #wsc-header .bg-transparent .header-logo-white,
body[data-home] .bg-transparent .header-logo-white {
display: block;
}
.bg-transparent .nav-item:hover .nav-link {
color: rgba(255, 255, 255, 0.7) !important;
}
.header-border {
border-bottom: 1px solid #eee;
}
.bg-transparent .nav-item:hover .nav-link path {
stroke: rgba(255, 255, 255, 0.7) !important;
}
.header-logo {
width: 98px;
height: 32px;
margin-right: 6px;
}
.px-30 {
padding-left: 28px !important;
padding-right: 28px !important;
}
.py-12 {
padding-top: 12px;
padding-bottom: 12px;
}
.py-20 {
padding-top: 20px !important;
padding-bottom: 20px !important;
}
.navbar {
height: auto;
}
#wsc-header .nav-item .nav-link:active,
#wsc-header .nav-item:active #wsc-header .nav-item .nav-link:hover,
#wsc-header .nav-item:hover {
text-decoration: none;
}
#wsc-header .navbar-nav .nav-link,
#wsc-header .toWorkbench {
white-space: nowrap;
}
#wsc-header .navbar-collapse {
height: 100% !important;
}
#wsc-header .product-style:hover {
background-color: #f2f2f2;
border-radius: 5px;
}
#wsc-header .product-style {
padding: 0 12px;
}
.header-dropdown-item {
transform-style: preserve-3d;
}
#navbarMainContent .dropdown-nav-item .collapse {
opacity: 0;
visibility: hidden;
display: block;
clip-path: inset(0 10em 10em 15em);
margin-left: -4em;
will-change: margin, visibility, opacity;
-webkit-font-smoothing: antialiased;
}
#navbarMainContent .dropdown-nav-item:hover .collapse {
opacity: 1;
visibility: visible;
margin-left: 0;
clip-path: inset(0 0 0 0);
pointer-events: all;
transition: all 0.25s ease-out, opacity 0.25s ease-in,
margin-left 0.25s ease-out, clip-path 50ms ease-out;
}
#navbarMainContent .dropdown-nav-item .aria-expanded-true-show {
display: none;
}
#navbarMainContent .dropdown-nav-item:hover .aria-expanded-false-show {
display: none;
}
#navbarMainContent .dropdown-nav-item:hover .aria-expanded-true-show {
display: inline-block;
}
.toWorkbench-container {
padding-left: 24px;
margin-right: 24px;
}
.beforeLogin {
padding-left: 38px;
}
.header-logined .beforeLogin {
display: none;
}
.header-logined .afterLogin {
display: block !important;
}
.toWorkbench {
display: flex;
background: linear-gradient(-90deg, #a65ef7 0, #4c53ff 100%), #fff;
border-radius: 49px;
padding: 0 25px;
height: 36px;
align-items: center;
transition: all 0.3s;
}
.toWorkbench:hover {
box-shadow: 0 5px 12px rgb(39 78 188 / 29%);
}
.bg-transparent .toWorkbench {
background: #fff;
}
.header-gradient--text {
font-size: 14px;
font-weight: 400;
color: #fff;
}
.bg-transparent .header-gradient--text {
color: #336fff;
}
.bg-transparent .header-gradient--text:hover {
color: #4e84fd;
}
.Tdesign-banner {
width: 100%;
padding: 12px 4px;
background: linear-gradient(
90deg,
#6139f6 0.126%,
#524af1 44.067%,
#2a7af2 97.163%
);
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.Tdesign-banner--btn__active,
.Tdesign-banner--btn__default {
padding: 2px 11px;
border-radius: 20px;
font-size: 12px;
line-height: 18px;
cursor: pointer;
text-align: center;
}
.Tdesign-banner--btn__active {
border: 1px solid #fff;
background: #fff;
color: #565dff;
margin-left: 40px;
margin-right: 20px;
}
.Tdesign-banner--btn__default {
border: 1px solid #fff;
color: #fff;
}
.Tdesign-banner--btn-close {
position: absolute;
right: 16px;
top: 12px;
cursor: pointer;
}
.close-tdesign-banner {
width: 21px;
height: 21px;
background: rgba(255, 255, 255, 0.15);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.close-tdesign-banner:hover {
background: rgba(255, 255, 255, 0.25);
}
.fixed-top {
stroke: #000;
}
.bg-transparent {
background-color: transparent;
color: #fff;
}
.bg-transparent svg {
stroke: #fff;
}
.dropdown--arrow {
margin-left: 4px;
transition: transform 0.2s;
will-change: transform;
transform-origin: center center;
}
#wsc-header .nav-link[aria-expanded="true"] .dropdown--arrow,
.dropdown-nav-item:hover .dropdown--arrow {
transform: rotate(-180deg);
}
.product-box {
border-radius: 16px;
display: flex;
width: 830px;
justify-content: space-between;
padding: 16px;
}
.product-box--item {
border-radius: 10px;
padding: 12px;
flex: 0 0 244px;
}
.product-box--item:hover {
background: rgba(0, 0, 0, 0.03);
}
.nav-item .collapse-box.collapse-box {
top: 60px;
left: 50%;
transform: translateX(-50%);
cursor: default;
border-radius: 16px;
overflow: hidden;
}
.header-support .collapse-box.collapse-box{
top: 61px;
left: 42%;
transform: translateX(-50%);
cursor: default;
border-radius: 16px;
overflow: hidden;
}

.community-box {
padding: 27px 26px 27px 30px;
display: flex;
}
.community-box--works {
padding: 12px 0;
}
.header-item {
border-radius: 10px;
display: flex;
align-items: center;
padding: 14px;
cursor: pointer;
width: 266px;
}
.header-resource .header-item:not(:last-child) {
margin-bottom: 10px;
}
.header-item:hover {
background: rgba(0, 0, 0, 0.03);
}
.support-item:hover .header-title {
color: black;
font-weight: 600;
/* background-color: #121212; */
}
.header-title {
font-size: 16px;
font-weight: 500;
margin-bottom: 0;
color: #121212;
}
.support-box .header-title{
font-size: 14px;
font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;;
line-height: 20px;
font-weight: 500;
margin-bottom: 0;
color: rgba(18, 18, 18, 0.8);
}
.support-community-box{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 214px;
}
.header-description {
margin-left: 12px;
flex: 1;
}
.community-box--activity {
/* border: 1px solid rgba(0, 0, 0, 0.05); */
border-radius: 10px;
width: 220px;
display: block;
}
.community-box--activity-img-box {
overflow: hidden;
border-radius: 10px;
padding-bottom: 56.3%;
height: 132px;
transform: rotate(0);
}
.community-box--activity-description {
padding: 15px 12px;
display: flex;
align-items: center;
}
.community-box--activity-img-box:hover .community-box--activity-img {
transform: scale(1.05);
}
.design-skill-box {
padding-bottom: 0;
height: 80px;
}
.community-box--works {
width: 220px;
}
.community-box--work-img {
width: 220px;
height: 130px;
cursor: pointer;
transition: transform 1s cubic-bezier(0, 0, 0, 1);
}
.community-box--work-link {
overflow: hidden;
display: inline-block;
}
.community-box--work-link:hover .community-box--work-img {
transform: scale(1.05);
transition: transform 1s cubic-bezier(0, 0, 0, 1);
}
.community-box--work-list {
width: calc(220px * 3);
}
.community-box--works input[type="radio"] {
display: none;
}
.community-box--work-control {
right: 9px;
bottom: 15px;
}
.community-box--work-control--item {
width: 4px;
height: 4px;
background: rgba(255, 255, 255, 0.6);
border-radius: 50%;
margin: 0 1px;
transition: all 0.3s;
}
.community-box--work-list {
transition: margin 0.8s;
}
#work-control1:checked ~ .community-box--work-list {
margin-left: 0;
}
#work-control-left1:checked ~ .community-box--work-list,
#work-control2:checked ~ .community-box--work-list {
margin-left: -100%;
}
#work-control-left2:checked ~ .community-box--work-list,
#work-control3:checked ~ .community-box--work-list {
margin-left: -200%;
}
#work-control-left3:checked ~ .community-box--work-list {
margin-left: 0;
transition: margin 0.8s 0s;
}
#work-control-left1:checked
~ .community-box--work-control
label[for="work-control1"],
#work-control-left2:checked
~ .community-box--work-control
label[for="work-control2"],
#work-control1:checked
~ .community-box--work-control
label[for="work-control1"],
#work-control2:checked
~ .community-box--work-control
label[for="work-control2"],
#work-control3:checked
~ .community-box--work-control
label[for="work-control3"] {
width: 12px;
height: 4px;
background-color: #fff;
border-radius: 31px;
}
.business-box {
padding: 16px;
width: 298px;
}
.support-box {
padding: 6px 0;
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.customer-box {
width: 274px;
height: 340px;
background: rgb(241, 244, 248);
border-radius: 10px;
padding: 8px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: rgb(51, 111, 255);
}
.customer-logo{
width: 100%;
padding: 19px 12px;
max-height: 174px;
border-radius:6px;
background-size: cover;
background-image: url('../png/bg.png');
/* background-color: rgb(0,0,0,0.2); */
}
.customer-logo-menu{
position: relative;
width: 100%;
list-style: none;
display: grid;
gap: 6px;
padding: 0;
margin: 0;
grid-template-columns:repeat(5,42px) ;
grid-template-rows:repeat(3,42px) ;
}
.customer-logo-item{
position: relative;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
width: 42px;
height: 42px;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.04);
border: 0.5px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
border-radius:12px;
transform: scale(0.8);
will-change: transform;
transition: transform .3s .2s;
}
.customer-logo-item-show{
border: none;
color:rgb(255,255,255,0.25) ;
border-top: 0.5px solid;
background-color: rgba(255,255,255,0.06);
clip-path: inset(0 0 round 12px);
}
.customer-logo-item img{
width: 42px;
height: 42px;
transition: all .3s;
}
.customer-logo-item:nth-child(1){
opacity: 0;
}
.customer-logo-item-show:hover{
background-color: rgba(255,255,255,0.03);
}
.customer-logo-item:nth-child(2):hover ~ .jingrong-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(4){
opacity: 0;
}
.customer-logo-item:nth-child(6):hover ~ .net-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(8){
/* border: none; */
background: linear-gradient(26.15deg, rgb(151, 23, 255) 7.039%,rgb(105, 77, 255) 41.654%,rgb(44, 150, 255) 68.259%,rgb(27, 255, 216) 98.184%);
color: rgb(203,242,255,1)
}
.customer-logo-item:nth-child(8):hover ~ .company-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(9):hover ~ .car-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(10):hover ~ .made-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(11):hover ~ .bus-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(12){
opacity: 0;
}
.customer-logo-item:nth-child(13):hover ~ .yun-position{
opacity: 1;
z-index: 1;
}
.customer-logo-item:nth-child(15){
opacity: 0;
}	
.logo-title-common{
position:absolute;
/* width: 68px; */
width: max-content;
height: 28px;
background: rgba(255, 255, 255, 0.08);
backdrop-filter: blur(4px);
border-radius:62px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
padding: 6px 10px 6px 10px;	
color: rgb(255, 255, 255);
font-family: 苹方-简;
font-size: 12px;
font-weight: 400;
line-height: 16px;
/* display: none; */
opacity: 0;
transition: opacity .3s;
z-index: -1;
}
.jingrong-position{
/* display: block; */
/* opacity: 1; */
left: 36px;
top: 47px;
}
.net-position{
top: 16px;
left: 0;
}
.company-position{
top: 16px;
left: 70px;
}
.car-position{
top: 16px;
left: 132px;
}
.made-position{
top: 16px;
left: 166px;
}
.bus-position{
/* display: block; */
top: 63px;
left: 0;
}
.yun-position{
top: 63px;
left: 90px;
}
.support-item {
padding: 12px 0;
width: 146px;
margin-left: 35px;
}
.customer-title-box{
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
padding: 12px 8px;
}
.customer-title{
color: rgb(18, 18, 18);
font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;;
font-size: 16px;
font-weight: 600;
line-height: 22px;
letter-spacing: 0px;
}
.customer-cont{
display: flex;
height: 16px;
color: rgb(18, 18, 18);
font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;;
font-size: 12px;
font-weight: 400;
line-height: 16px;
margin-bottom: 7px;
padding: 0;
}
.customer-cont img{
width: 15px;
height: 15px;
margin-right: 6px;
}

.customer-btn{
width: 232px;
height: 36px;
background: rgb(255, 255, 255);
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.03);
border-radius:100px;
color: rgb(51, 111, 255) !important;
font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;;
font-size: 14px;
font-weight: 600;
line-height: 20px;
letter-spacing: 0px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 10px;
margin-bottom: 12px;
border: none;
transition: all .3s;
}

.customer-btn:hover{
background: rgb(51, 111, 255);
}

@media (min-width: 981px) {
.header-arrow {
display: none;
}
.navbar-expand-1024 {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.navbar-expand-1024 .navbar-collapse {
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-1024 > .container,
.navbar-expand-md > .container-fluid,
.navbar-expand-md > .container-lg,
.navbar-expand-md > .container-md,
.navbar-expand-md > .container-sm,
.navbar-expand-md > .container-xl,
.navbar-expand-md > .container-xxl {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.navbar-expand-1024 .navbar-nav {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.icon-box {
display: none;
}
.navbar-nav {
align-items: center;
}
.header-dropdown-item {
display: block;
}
.header-dropdown-item-mobile {
display: none;
}
}
@media (max-width: 1120px) {
.avatar-container {
display: none !important;
}
}
@media (max-width: 1280px) {
.ws-member {
display: none;
}
.icon-box {
padding-right: 20px;
}
#wsc-header .navbar-collapse {
height: auto !important;
}
}
@media (max-width: 980px) {
.header-search--icon {
display: none !important;
}
.header-container {
padding-left: 0;
padding-right: 0;
}
.search {
padding: 12px 0;
}
.header-arrow {
display: block;
margin-left: 4px;
}
.toWorkbench {
height: 42px;
}
.header-link--mobile {
padding: 14px 0;
display: flex;
align-items: center;
}
.px-30.px-30 {
padding-left: 0 !important;
padding-right: 0 !important;
}
.py-20 {
padding-top: 15px !important;
padding-bottom: 15px !important;
}
.header-dropdown-item-mobile .nav-link:after {
display: inline-block;
content: "";
position: absolute;
left: -20px;
top: 0;
bottom: 0;
width: calc(100vw);
z-index: -1;
}
.header-dropdown-item-mobile .nav-link[aria-expanded="true"]::after {
background: rgba(0, 0, 0, 0.03);
}
.navbar-brand {
padding: 16px 0 16px 20px;
}
.icon-box {
display: block;
}
.navbar-nav {
align-items: start;
overflow-y: auto;
overflow-x: hidden;
max-height: calc(100vh - 128px);
padding: 0 20px;
}
.header-dropdown-item-mobile {
display: block;
width: 100%;
}
.header-dropdown-item {
display: none;
}
.toWorkbench-container {
padding-left: 0;
margin: 0 0 14px 0;
}
}
@media (max-width: 520px) {
.Tdesign-banner {
padding: 11px 10px;
justify-content: space-between;
}
.Tdesign-banner--btn__active {
margin-left: 4px;
margin-right: 4px;
}
.Tdesign-banner--btn-close {
position: absolute;
right: 2px;
cursor: pointer;
top: 50%;
transform: translateY(-50%);
}
}
.header-container {
max-width: 1550px;
}
.font-size-large {
font-size: 18px;
}
header input[name="dir"] {
display: none;
}
.header-swiper--container {
width: 100%;
height: 100%;
overflow: hidden;
}
.header-swiper--container .header-swiper-list {
position: relative;
width: 500%;
height: 100%;
transition: margin 0.8s;
}
.header-swiper--link {
float: left;
width: calc(100% / 5);
height: 100%;
color: #fff;
display: block;
}
.header-swiper--link:hover .header-swiper--link-img {
transform: scale(1.05);
transition: transform 1s cubic-bezier(0, 0, 0, 1);
}
.header-swiper--link-img {
width: 100%;
transition: transform 1s cubic-bezier(0, 0, 0, 1);
}
.header-swiper--container .header-swiper-list__after,
.header-swiper--container .header-swiper-list__before {
position: absolute;
top: 0;
width: 200%;
height: 100%;
opacity: 0;
z-index: -1;
}
.header-swiper--container .header-swiper-list__after .header-swiper--link {
width: 50%;
height: 100%;
float: left;
}
.header-swiper--container .header-swiper-list__after {
left: 0;
}
.header-swiper--container .header-swiper-list__before {
right: 0;
}
.header-swiper--control-list {
position: absolute;
right: 9px;
bottom: 6px;
padding-left: 0;
display: flex;
}
.header-swiper--control-btn {
display: block;
cursor: pointer;
width: 4px;
height: 4px;
background: rgba(255, 255, 255, 0.6);
border-radius: 50%;
margin: 0 3px;
transition: all 0.3s;
}
.header-control-js {
display: none;
}
.left_box {
left: 0;
}
.header-control-js label {
display: flex;
align-items: center;
justify-content: center;
font-size: 50px;
width: 100%;
height: 100%;
color: #fff;
cursor: pointer;
}
.header-control-js label {
display: none;
}
input[type="radio"]:checked ~ .header-control-js label {
display: none;
}
#header-swiper--control1:checked
~ .header-swiper--container
.header-swiper-list {
margin-left: 0;
}
#header-swiper--control1:checked
~ .header-control-js
.btn_header-swiper--control-btn1 {
display: flex;
}
#header-swiper--control2:checked
~ .header-swiper--container
.header-swiper-list {
margin-left: -100%;
}
#header-swiper--control2:checked
~ .header-control-js
.btn_header-swiper--control-btn2 {
display: flex;
}
#header-swiper--control3:checked
~ .header-swiper--container
.header-swiper-list {
margin-left: -200%;
}
#header-swiper--control1:checked
~ .header-swiper--control-list
.header-swiper--control-btn1,
#header-swiper--control2:checked
~ .header-swiper--control-list
.header-swiper--control-btn2,
#header-swiper--control3:checked
~ .header-swiper--control-list
.header-swiper--control-btn3,
#header-swiper--control4:checked
~ .header-swiper--control-list
.header-swiper--control-btn4,
#header-swiper--right1:checked
~ .header-swiper--control-list
.header-swiper--control-btn2,
#header-swiper--right2:checked
~ .header-swiper--control-list
.header-swiper--control-btn3,
#header-swiper--right3:checked
~ .header-swiper--control-list
.header-swiper--control-btn4,
#header-swiper--right4:checked
~ .header-swiper--control-list
.header-swiper--control-btn1 {
background: #fff;
width: 12px;
height: 4px;
background-color: #fff;
border-radius: 31px;
}
#header-swiper--control3:checked
~ .header-control-js
.btn_header-swiper--control-btn3 {
display: flex;
}
#header-swiper--control4:checked
~ .header-swiper--container
.header-swiper-list {
margin-left: -300%;
}
#header-swiper--control4:checked
~ .header-control-js
.btn_header-swiper--control-btn4 {
display: flex;
}
#header-swiper--right1:checked ~ .header-swiper--container .header-swiper-list {
margin-left: -100%;
}
#header-swiper--right1:checked
~ .header-control-js
.btn_header-swiper--control-btn2 {
display: flex;
}
#header-swiper--right2:checked ~ .header-swiper--container .header-swiper-list {
margin-left: -200%;
}
#header-swiper--right2:checked
~ .header-control-js
.btn_header-swiper--control-btn3 {
display: flex;
}
#header-swiper--right3:checked ~ .header-swiper--container .header-swiper-list {
margin-left: -300%;
}
#header-swiper--right3:checked
~ .header-control-js
.btn_header-swiper--control-btn4 {
display: flex;
}
#header-swiper--right4:checked ~ .header-swiper--container .header-swiper-list {
margin-left: -500%;
transition: margin 0.8s 0s;
}
#header-swiper--right4:checked
~ .header-swiper--container
.header-swiper-list__after {
transition: left 0.8s;
opacity: 1;
left: -100%;
z-index: 0;
}
#header-swiper--right4:checked ~ .header-swiper--container .header-swiper-list {
margin-left: 0;
transition: margin 0.8s 0s;
}
#header-swiper--right4:checked
~ .header-control-js
.btn_header-swiper--control-btn1 {
display: flex;
}
.header-cover-container {
position: absolute;
z-index: -1;
min-width: 100%;
top: 60px;
width: 100%;
}
.header-cover {
pointer-events: none;
color: rgba(0, 0, 0, 0.5);
font-weight: 400;
padding: 1em;
position: absolute;
transition: opacity 2s ease-out;
transform: rotateX(-25deg) scale(1);
transform-origin: 50% 7em 0;
opacity: 0;
box-shadow: 0 18px 80px rgb(0 0 0 / 7%);
border: 1px solid rgba(0, 0, 0, 0.05);
box-sizing: border-box;
top: -16px;
border-radius: 16px;
background: #fff;
display: block;
}
.header-product:hover ~ .header-cover-container .header-cover {
/* left: -36.8%;  */
left: -21%; 
height: 248px;
width: 828px;
}
.header-resource:hover ~ .header-cover-container .header-cover {
/* left: -10.6%; */
left: -0.6%;
height: 364px;
width: 577px;
}
.header-business:hover ~ .header-cover-container .header-cover {
left: 30.5%;
height: 105px;
width: 298px;
}
.header-support:hover ~ .header-cover-container .header-cover {
/* left: 21.4%; */
left: 28.4%;
height: 354px;
width: 704px;
display: flex;
justify-content: center;
align-items: center;
}
.header-support:hover .customer-logo-item{
transform: scale(1);
}
.header-dropdown-item:hover ~ .header-cover-container .header-cover {
animation: clipPath 0.25s ease-out 1 forwards;
transition: left 0.15s ease-out, height 0.15s ease-out, width 0.1s ease-out,
top 0.1s ease-in;
opacity: 1;
right: auto;
}
@keyframes clipPath {
0% {
opacity: 0;
}
100% {
transform: rotateX(0) scale(1);
top: 0;
opacity: 1;
}
}
/* 1280px */
@media screen and (max-width:1280px){
.header-support:hover ~ .header-cover-container .header-cover{
left: 15%;
}
.header-support .collapse-box.collapse-box{
left: -36%;
}
}
/* 1250px */
@media (max-width: 1360px) {
.toWorkbench-container {
padding-left: 12px;
}
.ws-member {
display: none;
}
.header-product:hover ~ .header-cover-container .header-cover {
/* left: calc(-36.8% - 50px); */
left: calc(-21% - 50px);
}
.header-support:hover ~ .header-cover-container .header-cover {
/* left: calc(2.5% + 96px); */
left: calc(13.5% + 96px);
}
.header-resource:hover ~ .header-cover-container .header-cover {
/* left: calc(-10.8% - 21px); */
left: calc(1.2% - 21px);
}
.header-support .collapse-box.collapse-box{
left: calc(-116.8% + 96px);
}
}
.footer-container {
border-bottom: solid 1px rgba(255, 255, 255, 0.2) !important;
}
.wsc-footer-left {
padding: 5rem 0 1.875rem;
border-right: solid 1px rgba(255, 255, 255, 0.1);
}
.wsc-footer-content {
padding: 5rem 0 2rem;
}
.wsc-footer-product {
padding-right: 6rem;
padding-left: 7.5rem;
}
.icon-weibo-box,
.icon-weixin-box {
display: none;
}
.wx-code {
top: -52px;
left: -93px;
z-index: 1;
width: 132px;
background-color: #fff;
transform: scale(0.7);
transform-origin: left bottom;
}
.wb-code {
top: -81px;
left: 27px;
z-index: 1;
width: 132px;
background-color: #fff;
transform: scale(0.7);
transform-origin: left bottom;
}
.wx-container {
overflow: visible;
}
.help--float-container:hover {
cursor: default;
}
.help--float-container .help--float-qrcode {
position: absolute;
left: 70px;
visibility: hidden;
bottom: -81px;
}
.help--float-container:hover .help--float-qrcode {
visibility: visible;
}
.help--float-container .help--float-qrcode--content {
width: 120px;
height: 146px;
padding: 16px;
margin-right: 10px;
border-radius: 6px;
background-color: #fff;
box-shadow: 1px 2px 12px rgb(0 0 0 / 15%);
display: flex;
flex-direction: column;
align-items: center;
font-size: 13px;
color: #000;
}
@media (max-width: 1279px) {
.wsc-footer-product {
padding: 0 6rem;
}
.wsc-icon.wsc-logo {
height: 4rem;
}
}
/* 991px */
@media (max-width: 1070px) {
#wsc-footer .container,
#wsc-footer .container-md,
#wsc-footer .container-sm {
max-width: 100%;
padding: 0 2rem;
}
.wsc-footer-content {
padding: 1rem 0;
}
.wsc-footer-product {
padding: 0;
}
.wsc-footer-left {
padding: 2rem 1rem 0;
border-right: none;
}
.footer-container {
max-width: 100%;
}
.wx-container {
overflow: hidden;
}
.wsc-footer-segment:hover {
overflow: visible;
}
.wx-code {
bottom: -76px;
left: 0;
max-width: 100px;
margin: auto;
}
.wb-code {
bottom: -66px;
left: 32px;
max-width: 100px;
margin: auto;
}
.help--float-container .help--float-qrcode {
bottom: -29px;
}
.help--float-container .help--float-qrcode--content {
width: 113px;
height: 127px;
padding: 7px;
margin-right: 10px;
}
}
@media (max-width: 576px) {
.header-apply {
margin-left: 10px !important;
max-width: 40px;
}
.Tdesign-banner-desc {
flex: 0 0 80%;
}
.help--float-container .help--float-qrcode {
left: 0;
right: 296px;
bottom: -18px;
}
}
@media (max-height: 603px) {
.qidian_wpa_img,
iframe[src*="webpage.qidian.qq.com"] {
display: none !important;
}
}
.ws-nps-form-type2 {
z-index: 1999999999 !important;
}
.footer-container.footer-container {
border-bottom: solid 1px rgba(255, 255, 255, 0.1) !important;
}
.prototype-meta {
position: relative;
}
@media (max-width: 400px) {
.Tdesign-banner-desc {
max-width: 253px;
}
}