/* 首页样式：基础、导航、各内容区、页脚及响应式规则。 */
[class*="ant-"]::-ms-clear,  [class*="ant-"] input::-ms-clear,  [class*="ant-"] input::-ms-reveal,  [class^="ant-"]::-ms-clear,  [class^="ant-"] input::-ms-clear,  [class^="ant-"] input::-ms-reveal {
     display: none;
}
input::-ms-clear,  input::-ms-reveal {
     display: none;
}
*,  ::after,  ::before {
     box-sizing: border-box;
}
[tabindex="-1"]:focus {
     outline: none !important;
}
 h2,  h3,  h5 {
     margin-top: 0px;
     margin-bottom: 0.5em;
     color: rgba(0, 0, 0, 0.85);
     font-weight: 500;
}
p {
     margin-top: 0px;
     margin-bottom: 1em;
}
 input[type="text"] {
     appearance: none;
}
 ul {
     margin-top: 0px;
     margin-bottom: 1em;
}
 ul ul {
     margin-bottom: 0px;
}
a {
     color: var(--brand-button-green);
     text-decoration: none;
     background-color: transparent;
     outline: none;
     cursor: pointer;
     transition: color 0.3s;
}
a:hover {
     color: var(--brand-green-hover);
}
a:active {
     color: var(--brand-green-active);
}
a:active,  a:focus,  a:hover {
     text-decoration: none;
     outline: 0px;
}
img {
     vertical-align: middle;
     border-style: none;
}
svg:not(:root) {
     overflow: hidden;
}
[role="button"],  a,  button,  input:not([type="range"]) {
     touch-action: manipulation;
}
button,  input {
     margin: 0px;
     color: inherit;
     font-size: inherit;
     font-family: inherit;
     line-height: inherit;
}
button,  input {
     overflow: visible;
}
button {
     text-transform: none;
}
 [type="submit"],  button,  html [type="button"] {
     appearance: button;
}
::-webkit-file-upload-button {
     font: inherit;
     appearance: button;
}
[hidden] {
     display: none !important;
}
::selection {
     color: rgb(255, 255, 255);
     background: var(--brand-button-green);
}
.anticon {
     display: inline-block;
     color: inherit;
     font-style: normal;
     line-height: 0;
     text-align: center;
     text-transform: none;
     vertical-align: -0.125em;
     text-rendering: optimizelegibility;
     -webkit-font-smoothing: antialiased;
}
.anticon > * {
     line-height: 1;
}
.anticon svg {
     display: inline-block;
}
.anticon::before {
     display: none;
}
.anticon[tabindex] {
     cursor: pointer;
}
@-webkit-keyframes antFadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@keyframes antFadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@-webkit-keyframes antFadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
@keyframes antFadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
@-webkit-keyframes antMoveDownIn {
        0% {
         transform: translateY(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antMoveDownIn {
        0% {
         transform: translateY(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antMoveDownOut {
        0% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateY(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antMoveDownOut {
        0% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateY(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antMoveLeftIn {
        0% {
         transform: translateX(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antMoveLeftIn {
        0% {
         transform: translateX(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antMoveLeftOut {
        0% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateX(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antMoveLeftOut {
        0% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateX(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antMoveRightIn {
        0% {
         transform: translateX(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antMoveRightIn {
        0% {
         transform: translateX(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antMoveRightOut {
        0% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateX(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antMoveRightOut {
        0% {
         transform: translateX(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateX(100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antMoveUpIn {
        0% {
         transform: translateY(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antMoveUpIn {
        0% {
         transform: translateY(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antMoveUpOut {
        0% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateY(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antMoveUpOut {
        0% {
         transform: translateY(0px);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: translateY(-100%);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes loadingCircle {
        100% {
         transform: rotate(1turn);
    }
}
@keyframes loadingCircle {
        100% {
         transform: rotate(1turn);
    }
}
@-webkit-keyframes waveEffect {
        100% {
         box-shadow: 0 0 0 6px var(--antd-wave-shadow-color);
    }
}
@keyframes waveEffect {
        100% {
         box-shadow: 0 0 0 6px var(--antd-wave-shadow-color);
    }
}
@-webkit-keyframes fadeEffect {
        100% {
         opacity: 0;
    }
}
@keyframes fadeEffect {
        100% {
         opacity: 0;
    }
}
@-webkit-keyframes antSlideUpIn {
        0% {
         transform: scaleY(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: scaleY(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antSlideUpIn {
        0% {
         transform: scaleY(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: scaleY(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antSlideUpOut {
        0% {
         transform: scaleY(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: scaleY(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antSlideUpOut {
        0% {
         transform: scaleY(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: scaleY(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antSlideDownIn {
        0% {
         transform: scaleY(0.8);
         transform-origin: 100% 100%;
         opacity: 0;
    }
       100% {
         transform: scaleY(1);
         transform-origin: 100% 100%;
         opacity: 1;
    }
}
@keyframes antSlideDownIn {
        0% {
         transform: scaleY(0.8);
         transform-origin: 100% 100%;
         opacity: 0;
    }
       100% {
         transform: scaleY(1);
         transform-origin: 100% 100%;
         opacity: 1;
    }
}
@-webkit-keyframes antSlideDownOut {
        0% {
         transform: scaleY(1);
         transform-origin: 100% 100%;
         opacity: 1;
    }
       100% {
         transform: scaleY(0.8);
         transform-origin: 100% 100%;
         opacity: 0;
    }
}
@keyframes antSlideDownOut {
        0% {
         transform: scaleY(1);
         transform-origin: 100% 100%;
         opacity: 1;
    }
       100% {
         transform: scaleY(0.8);
         transform-origin: 100% 100%;
         opacity: 0;
    }
}
@-webkit-keyframes antSlideLeftIn {
        0% {
         transform: scaleX(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: scaleX(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@keyframes antSlideLeftIn {
        0% {
         transform: scaleX(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
       100% {
         transform: scaleX(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antSlideLeftOut {
        0% {
         transform: scaleX(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: scaleX(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@keyframes antSlideLeftOut {
        0% {
         transform: scaleX(1);
         transform-origin: 0px 0px;
         opacity: 1;
    }
       100% {
         transform: scaleX(0.8);
         transform-origin: 0px 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antSlideRightIn {
        0% {
         transform: scaleX(0.8);
         transform-origin: 100% 0px;
         opacity: 0;
    }
       100% {
         transform: scaleX(1);
         transform-origin: 100% 0px;
         opacity: 1;
    }
}
@keyframes antSlideRightIn {
        0% {
         transform: scaleX(0.8);
         transform-origin: 100% 0px;
         opacity: 0;
    }
       100% {
         transform: scaleX(1);
         transform-origin: 100% 0px;
         opacity: 1;
    }
}
@-webkit-keyframes antSlideRightOut {
        0% {
         transform: scaleX(1);
         transform-origin: 100% 0px;
         opacity: 1;
    }
       100% {
         transform: scaleX(0.8);
         transform-origin: 100% 0px;
         opacity: 0;
    }
}
@keyframes antSlideRightOut {
        0% {
         transform: scaleX(1);
         transform-origin: 100% 0px;
         opacity: 1;
    }
       100% {
         transform: scaleX(0.8);
         transform-origin: 100% 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antZoomIn {
        0% {
         transform: scale(0.2);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@keyframes antZoomIn {
        0% {
         transform: scale(0.2);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@-webkit-keyframes antZoomOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0.2);
         opacity: 0;
    }
}
@keyframes antZoomOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0.2);
         opacity: 0;
    }
}
@-webkit-keyframes antZoomBigIn {
        0% {
         transform: scale(0.8);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@keyframes antZoomBigIn {
        0% {
         transform: scale(0.8);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@-webkit-keyframes antZoomBigOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0.8);
         opacity: 0;
    }
}
@keyframes antZoomBigOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0.8);
         opacity: 0;
    }
}
@-webkit-keyframes antZoomUpIn {
        0% {
         transform: scale(0.8);
         transform-origin: 50% 0px;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 50% 0px;
    }
}
@keyframes antZoomUpIn {
        0% {
         transform: scale(0.8);
         transform-origin: 50% 0px;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 50% 0px;
    }
}
@-webkit-keyframes antZoomUpOut {
        0% {
         transform: scale(1);
         transform-origin: 50% 0px;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 50% 0px;
         opacity: 0;
    }
}
@keyframes antZoomUpOut {
        0% {
         transform: scale(1);
         transform-origin: 50% 0px;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 50% 0px;
         opacity: 0;
    }
}
@-webkit-keyframes antZoomLeftIn {
        0% {
         transform: scale(0.8);
         transform-origin: 0px 50%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 0px 50%;
    }
}
@keyframes antZoomLeftIn {
        0% {
         transform: scale(0.8);
         transform-origin: 0px 50%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 0px 50%;
    }
}
@-webkit-keyframes antZoomLeftOut {
        0% {
         transform: scale(1);
         transform-origin: 0px 50%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 0px 50%;
         opacity: 0;
    }
}
@keyframes antZoomLeftOut {
        0% {
         transform: scale(1);
         transform-origin: 0px 50%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 0px 50%;
         opacity: 0;
    }
}
@-webkit-keyframes antZoomRightIn {
        0% {
         transform: scale(0.8);
         transform-origin: 100% 50%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 100% 50%;
    }
}
@keyframes antZoomRightIn {
        0% {
         transform: scale(0.8);
         transform-origin: 100% 50%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 100% 50%;
    }
}
@-webkit-keyframes antZoomRightOut {
        0% {
         transform: scale(1);
         transform-origin: 100% 50%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 100% 50%;
         opacity: 0;
    }
}
@keyframes antZoomRightOut {
        0% {
         transform: scale(1);
         transform-origin: 100% 50%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 100% 50%;
         opacity: 0;
    }
}
@-webkit-keyframes antZoomDownIn {
        0% {
         transform: scale(0.8);
         transform-origin: 50% 100%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 50% 100%;
    }
}
@keyframes antZoomDownIn {
        0% {
         transform: scale(0.8);
         transform-origin: 50% 100%;
         opacity: 0;
    }
       100% {
         transform: scale(1);
         transform-origin: 50% 100%;
    }
}
@-webkit-keyframes antZoomDownOut {
        0% {
         transform: scale(1);
         transform-origin: 50% 100%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 50% 100%;
         opacity: 0;
    }
}
@keyframes antZoomDownOut {
        0% {
         transform: scale(1);
         transform-origin: 50% 100%;
    }
       100% {
         transform: scale(0.8);
         transform-origin: 50% 100%;
         opacity: 0;
    }
}
@-webkit-keyframes antStatusProcessing {
        0% {
         transform: scale(0.8);
         opacity: 0.5;
    }
       100% {
         transform: scale(2.4);
         opacity: 0;
    }
}
@keyframes antStatusProcessing {
        0% {
         transform: scale(0.8);
         opacity: 0.5;
    }
       100% {
         transform: scale(2.4);
         opacity: 0;
    }
}
@-webkit-keyframes antZoomBadgeIn {
        0% {
         transform: scale(0) translate(50%, -50%);
         opacity: 0;
    }
       100% {
         transform: scale(1) translate(50%, -50%);
    }
}
@keyframes antZoomBadgeIn {
        0% {
         transform: scale(0) translate(50%, -50%);
         opacity: 0;
    }
       100% {
         transform: scale(1) translate(50%, -50%);
    }
}
@-webkit-keyframes antZoomBadgeOut {
        0% {
         transform: scale(1) translate(50%, -50%);
    }
       100% {
         transform: scale(0) translate(50%, -50%);
         opacity: 0;
    }
}
@keyframes antZoomBadgeOut {
        0% {
         transform: scale(1) translate(50%, -50%);
    }
       100% {
         transform: scale(0) translate(50%, -50%);
         opacity: 0;
    }
}
@-webkit-keyframes antNoWrapperZoomBadgeIn {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
    }
}
@keyframes antNoWrapperZoomBadgeIn {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
    }
}
@-webkit-keyframes antNoWrapperZoomBadgeOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0);
         opacity: 0;
    }
}
@keyframes antNoWrapperZoomBadgeOut {
        0% {
         transform: scale(1);
    }
       100% {
         transform: scale(0);
         opacity: 0;
    }
}
@-webkit-keyframes antBadgeLoadingCircle {
        0% {
         transform-origin: 50% center;
    }
       100% {
         transform: translate(50%, -50%) rotate(1turn);
         transform-origin: 50% center;
    }
}
@keyframes antBadgeLoadingCircle {
        0% {
         transform-origin: 50% center;
    }
       100% {
         transform: translate(50%, -50%) rotate(1turn);
         transform-origin: 50% center;
    }
}
@-webkit-keyframes antZoomBadgeInRtl {
        0% {
         transform: scale(0) translate(-50%, -50%);
         opacity: 0;
    }
       100% {
         transform: scale(1) translate(-50%, -50%);
    }
}
@keyframes antZoomBadgeInRtl {
        0% {
         transform: scale(0) translate(-50%, -50%);
         opacity: 0;
    }
       100% {
         transform: scale(1) translate(-50%, -50%);
    }
}
@-webkit-keyframes antZoomBadgeOutRtl {
        0% {
         transform: scale(1) translate(-50%, -50%);
    }
       100% {
         transform: scale(0) translate(-50%, -50%);
         opacity: 0;
    }
}
@keyframes antZoomBadgeOutRtl {
        0% {
         transform: scale(1) translate(-50%, -50%);
    }
       100% {
         transform: scale(0) translate(-50%, -50%);
         opacity: 0;
    }
}
.ant-btn {
     line-height: 1.5715;
     position: relative;
     display: inline-block;
     font-weight: 400;
     white-space: nowrap;
     text-align: center;
     box-shadow: rgba(0, 0, 0, 0.016) 0px 2px 0px;
     cursor: pointer;
     transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
     user-select: none;
     touch-action: manipulation;
     height: 32px;
     padding: 4px 15px;
     font-size: 14px;
     border-radius: 2px;
     color: rgba(0, 0, 0, 0.85);
     border: 1px solid rgb(217, 217, 217);
     background: rgb(255, 255, 255);
}
.ant-btn,  .ant-btn:active,  .ant-btn:focus {
     outline: 0px;
}
.ant-btn:not([disabled]):hover {
     text-decoration: none;
}
.ant-btn:not([disabled]):active {
     outline: 0px;
     box-shadow: none;
}
.ant-btn:focus,  .ant-btn:hover {
     color: var(--brand-green-hover);
     border-color: var(--brand-green-hover);
     background: rgb(255, 255, 255);
}
.ant-btn:active {
     color: var(--brand-green-active);
     border-color: var(--brand-green-active);
     background: rgb(255, 255, 255);
}
.ant-btn:active,  .ant-btn:focus,  .ant-btn:hover {
     text-decoration: none;
     background: rgb(255, 255, 255);
}
.ant-btn > span {
     display: inline-block;
}
.ant-btn::before {
     position: absolute;
     inset: -1px;
     z-index: 1;
     display: none;
     background: rgb(255, 255, 255);
     border-radius: inherit;
     opacity: 0.35;
     transition: opacity 0.2s;
     content: "";
     pointer-events: none;
}
.ant-btn:active > span,  .ant-btn:focus > span {
     position: relative;
}
.ant-btn-two-chinese-chars > :not(.anticon) {
     margin-right: -0.34em;
     letter-spacing: 0.34em;
}
.ant-btn:empty {
     display: inline-block;
     width: 0px;
     visibility: hidden;
     content: " ";
}
@-webkit-keyframes card-loading {
        0%, 100% {
         background-position: 0px 50%;
    }
       50% {
         background-position: 100% 50%;
    }
}
@keyframes card-loading {
        0%, 100% {
         background-position: 0px 50%;
    }
       50% {
         background-position: 100% 50%;
    }
}
@-webkit-keyframes antCheckboxEffect {
        0% {
         transform: scale(1);
         opacity: 0.5;
    }
       100% {
         transform: scale(1.6);
         opacity: 0;
    }
}
@keyframes antCheckboxEffect {
        0% {
         transform: scale(1);
         opacity: 0.5;
    }
       100% {
         transform: scale(1.6);
         opacity: 0;
    }
}
 .ant-comment-content-author-name > :hover {
     color: rgba(0, 0, 0, 0.45);
}
.ant-drawer {
     position: fixed;
     z-index: 1000;
     width: 0px;
     height: 100%;
     transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1), height 0.3s, width 0.3s;
}
.ant-drawer > * {
     transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1), box-shadow 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);
}
.ant-drawer-content-wrapper {
     position: absolute;
     width: 100%;
     height: 100%;
}
.ant-drawer .ant-drawer-content {
     width: 100%;
     height: 100%;
}
.ant-drawer-left {
     top: 0px;
     width: 0px;
     height: 100%;
}
.ant-drawer-left .ant-drawer-content-wrapper {
     height: 100%;
}
.ant-drawer-left.ant-drawer-open {
     width: 100%;
     transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);
}
.ant-drawer-left,  .ant-drawer-left .ant-drawer-content-wrapper {
     left: 0px;
}
.ant-drawer-left.ant-drawer-open .ant-drawer-content-wrapper {
     box-shadow: rgba(0, 0, 0, 0.08) 6px 0px 16px -8px, rgba(0, 0, 0, 0.05) 9px 0px 28px 0px, rgba(0, 0, 0, 0.03) 12px 0px 48px 16px;
}
.ant-drawer.ant-drawer-open .ant-drawer-mask {
     height: 100%;
     opacity: 1;
     transition: none;
     animation: 0.3s cubic-bezier(0.7, 0.3, 0.1, 1) 0s 1 normal none running antdDrawerFadeIn;
     pointer-events: auto;
}
.ant-drawer-title {
     margin: 0px;
     color: rgba(0, 0, 0, 0.85);
     font-weight: 500;
     font-size: 16px;
     line-height: 22px;
}
.ant-drawer-content {
     position: relative;
     z-index: 1;
     overflow: auto;
     background-color: rgb(255, 255, 255);
     background-clip: padding-box;
     border: 0px;
}
.ant-drawer-close {
     position: absolute;
     top: 0px;
     right: 0px;
     z-index: 10;
     display: block;
     padding: 20px;
     color: rgba(0, 0, 0, 0.45);
     font-weight: 700;
     font-size: 16px;
     font-style: normal;
     line-height: 1;
     text-align: center;
     text-transform: none;
     text-decoration: none;
     background: transparent;
     border: 0px;
     outline: 0px;
     cursor: pointer;
     transition: color 0.3s;
     text-rendering: auto;
}
.ant-drawer-close:focus,  .ant-drawer-close:hover {
     color: rgba(0, 0, 0, 0.75);
     text-decoration: none;
}
.ant-drawer-header {
     position: relative;
     padding: 16px 24px;
     border-bottom: 1px solid rgb(240, 240, 240);
     border-radius: 2px 2px 0px 0px;
}
.ant-drawer-header {
     color: rgba(0, 0, 0, 0.85);
     background: rgb(255, 255, 255);
}
.ant-drawer-wrapper-body {
     display: flex;
     flex-flow: column;
     width: 100%;
     height: 100%;
}
.ant-drawer-body {
     flex-grow: 1;
     padding: 24px;
     overflow: auto;
     font-size: 14px;
     line-height: 1.5715;
     overflow-wrap: break-word;
}
.ant-drawer-mask {
     position: absolute;
     top: 0px;
     left: 0px;
     width: 100%;
     height: 0px;
     background-color: rgba(0, 0, 0, 0.45);
     opacity: 0;
     transition: opacity 0.3s linear, height 0.3s;
     pointer-events: none;
}
@-webkit-keyframes antdDrawerFadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@keyframes antdDrawerFadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
.ant-form-horizontal .ant-form-item-control {
     flex: 1 1 0%;
}
@media (max-width: 575px) {
     .ant-form .ant-form-item {
         flex-wrap: wrap;
    }
     .ant-form .ant-form-item .ant-form-item-control {
         flex: 0 0 100%;
         max-width: 100%;
    }
}
.ant-form {
     box-sizing: border-box;
     margin: 0px;
     padding: 0px;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     font-variant: tabular-nums;
     line-height: 1.5715;
     list-style: none;
     font-feature-settings: "tnum", "tnum";
}
.ant-form-item {
     box-sizing: border-box;
     padding: 0px;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     font-variant: tabular-nums;
     line-height: 1.5715;
     list-style: none;
     font-feature-settings: "tnum", "tnum";
     margin: 0px 0px 24px;
     vertical-align: top;
}
.ant-form-item-control {
     display: flex;
     flex-direction: column;
     flex-grow: 1;
}
.ant-form-item-control:first-child:not([class^="ant-col-"]):not([class*=" ant-col-"]) {
     width: 100%;
}
.ant-form-item-control-input {
     position: relative;
     display: flex;
     align-items: center;
     min-height: 32px;
}
.ant-form-item-control-input-content {
     flex: 1 1 auto;
     max-width: 100%;
}
@-webkit-keyframes antShowHelpIn {
        0% {
         transform: translateY(-5px);
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         opacity: 1;
    }
}
@keyframes antShowHelpIn {
        0% {
         transform: translateY(-5px);
         opacity: 0;
    }
       100% {
         transform: translateY(0px);
         opacity: 1;
    }
}
@-webkit-keyframes antShowHelpOut {
        100% {
         transform: translateY(-5px);
         opacity: 0;
    }
}
@keyframes antShowHelpOut {
        100% {
         transform: translateY(-5px);
         opacity: 0;
    }
}
@-webkit-keyframes diffZoomIn1 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@keyframes diffZoomIn1 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@-webkit-keyframes diffZoomIn2 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@keyframes diffZoomIn2 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@-webkit-keyframes diffZoomIn3 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
@keyframes diffZoomIn3 {
        0% {
         transform: scale(0);
         opacity: 0;
    }
       100% {
         transform: scale(1);
         opacity: 1;
    }
}
.ant-row {
     flex-flow: wrap;
}
.ant-row,  .ant-row::after,  .ant-row::before {
     display: flex;
}
.ant-col {
     position: relative;
     max-width: 100%;
     min-height: 1px;
}
.ant-input-affix-wrapper {
     position: relative;
     width: 100%;
     min-width: 0px;
     padding: 4px 11px;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     line-height: 1.5715;
     background-color: rgb(255, 255, 255);
     background-image: none;
     border: 1px solid rgb(217, 217, 217);
     border-radius: 2px;
     transition: 0.3s;
     display: inline-flex;
}
.ant-input-affix-wrapper::placeholder {
     color: rgb(191, 191, 191);
}
.ant-input-affix-wrapper:placeholder-shown {
     text-overflow: ellipsis;
}
.ant-input-affix-wrapper:hover {
     border-color: var(--brand-green-hover);
     border-right-width: 1px !important;
}
.ant-input-affix-wrapper-focused,  .ant-input-affix-wrapper:focus {
     border-color: var(--brand-green-hover);
     outline: 0px;
     box-shadow: rgba(0, 143, 69, 0.2) 0px 0px 0px 2px;
     border-right-width: 1px !important;
}
.ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
     border-color: var(--brand-green-hover);
     z-index: 1;
     border-right-width: 1px !important;
}
.ant-input-affix-wrapper-focused,  .ant-input-affix-wrapper:focus {
     z-index: 1;
}
.ant-input-affix-wrapper > input.ant-input {
     padding: 0px;
     border-width: medium;
     border-style: none;
     border-color: currentcolor;
     border-image: none;
     outline: none;
}
.ant-input-affix-wrapper > input.ant-input:focus {
     box-shadow: none !important;
}
.ant-input-affix-wrapper::before {
     width: 0px;
     visibility: hidden;
     content: " ";
}
 .ant-input-suffix {
     display: flex;
     flex: 0 0 auto;
     align-items: center;
}
.ant-input-suffix {
     margin-left: 4px;
}
.anticon.ant-input-clear-icon {
     margin: 0px;
     color: rgba(0, 0, 0, 0.25);
     font-size: 12px;
     vertical-align: -1px;
     cursor: pointer;
     transition: color 0.3s;
}
.anticon.ant-input-clear-icon:hover {
     color: rgba(0, 0, 0, 0.45);
}
.anticon.ant-input-clear-icon:active {
     color: rgba(0, 0, 0, 0.85);
}
.anticon.ant-input-clear-icon-hidden {
     visibility: hidden;
}
.anticon.ant-input-clear-icon-has-suffix {
     margin: 0px 4px;
}
.ant-input {
     box-sizing: border-box;
     margin: 0px;
     font-variant: tabular-nums;
     list-style: none;
     font-feature-settings: "tnum", "tnum";
     position: relative;
     display: inline-block;
     width: 100%;
     min-width: 0px;
     padding: 4px 11px;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     line-height: 1.5715;
     background-color: rgb(255, 255, 255);
     background-image: none;
     border: 1px solid rgb(217, 217, 217);
     border-radius: 2px;
     transition: 0.3s;
}
.ant-input::placeholder {
     color: rgb(191, 191, 191);
}
.ant-input:placeholder-shown {
     text-overflow: ellipsis;
}
.ant-input:hover {
     border-color: var(--brand-green-hover);
     border-right-width: 1px !important;
}
 .ant-input:focus {
     border-color: var(--brand-green-hover);
     outline: 0px;
     box-shadow: rgba(0, 143, 69, 0.2) 0px 0px 0px 2px;
     border-right-width: 1px !important;
}
.ant-input-group.ant-input-group-compact > :not(:last-child) {
     margin-right: -1px;
     border-right-width: 1px;
}
 .ant-input-group.ant-input-group-compact > :first-child {
     border-top-left-radius: 2px;
     border-bottom-left-radius: 2px;
}
 .ant-input-group.ant-input-group-compact > :last-child {
     border-right-width: 1px;
     border-top-right-radius: 2px;
     border-bottom-right-radius: 2px;
}
.ant-input-group-rtl.ant-input-group.ant-input-group-compact > :not(:last-child) {
     margin-right: 0px;
     margin-left: -1px;
     border-left-width: 1px;
}
 .ant-input-group-rtl.ant-input-group.ant-input-group-compact > :first-child {
     border-radius: 0px 2px 2px 0px;
}
 .ant-input-group-rtl.ant-input-group.ant-input-group-compact > :last-child {
     border-left-width: 1px;
     border-radius: 2px 0px 0px 2px;
}
.ant-input-search-rtl > .ant-input-group > .ant-input-affix-wrapper-focused {
     border-right-color: var(--brand-green-hover);
}
@media (-ms-high-contrast:none), screen and (-ms-high-contrast:active) {
     .ant-input {
         height: 32px;
    }
     .ant-input-affix-wrapper > input.ant-input {
         height: auto;
    }
}
.ant-menu {
     box-sizing: border-box;
     font-variant: tabular-nums;
     font-feature-settings: "tnum", "tnum";
     margin: 0px;
     padding: 0px;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     line-height: 0;
     text-align: left;
     list-style: none;
     background: rgb(255, 255, 255);
     outline: none;
     box-shadow: rgba(0, 0, 0, 0.12) 0px 3px 6px -4px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.05) 0px 9px 28px 8px;
     transition: background 0.3s, width 0.3s cubic-bezier(0.2, 0, 0, 1);
}
.ant-menu::after,  .ant-menu::before {
     display: table;
     content: "";
}
.ant-menu::after {
     clear: both;
}
.ant-menu.ant-menu-root:focus-visible {
     box-shadow: rgba(0, 143, 69, 0.2) 0px 0px 0px 2px;
}
.ant-menu-submenu,  .ant-menu-submenu-inline {
     transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
}
 .ant-menu-submenu-title:active {
     background: var(--brand-green-soft);
}
.ant-menu-title-content {
     transition: color 0.3s;
}
.ant-menu-inline {
     border-right: 1px solid rgb(240, 240, 240);
}
 .ant-menu-submenu-title {
     position: relative;
     display: block;
     margin: 0px;
     padding: 0px 20px;
     white-space: nowrap;
     cursor: pointer;
     transition: border-color 0.3s, background 0.3s, padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
 .ant-menu-submenu-title:focus-visible {
     box-shadow: rgba(0, 143, 69, 0.2) 0px 0px 0px 2px;
}
.ant-menu-submenu > .ant-menu-submenu-title::after {
     transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.ant-menu-submenu-arrow {
     position: absolute;
     top: 50%;
     right: 16px;
     width: 10px;
     color: rgba(0, 0, 0, 0.85);
     transform: translateY(-50%);
     transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.ant-menu-submenu-arrow::after,  .ant-menu-submenu-arrow::before {
     position: absolute;
     width: 6px;
     height: 1.5px;
     background-color: currentcolor;
     border-radius: 2px;
     transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), top 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
     content: "";
}
.ant-menu-submenu-arrow::before {
     transform: rotate(45deg) translateY(-2.5px);
}
.ant-menu-submenu-arrow::after {
     transform: rotate(-45deg) translateY(2.5px);
}
.ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
     color: var(--brand-button-green);
}
 .ant-menu-submenu-inline .ant-menu-submenu-arrow::before {
     transform: rotate(-45deg) translateX(2.5px);
}
 .ant-menu-submenu-inline .ant-menu-submenu-arrow::after {
     transform: rotate(45deg) translateX(-2.5px);
}
.ant-menu-submenu-open.ant-menu-submenu-inline > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
     transform: translateY(-2px);
}
.ant-menu-submenu-open.ant-menu-submenu-inline > .ant-menu-submenu-title > .ant-menu-submenu-arrow::after {
     transform: rotate(-45deg) translateX(-2.5px);
}
.ant-menu-submenu-open.ant-menu-submenu-inline > .ant-menu-submenu-title > .ant-menu-submenu-arrow::before {
     transform: rotate(45deg) translateX(2.5px);
}
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open {
     color: var(--brand-button-green);
}
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open::after {
     border-bottom: 2px solid var(--brand-button-green);
}
 .ant-menu-inline .ant-menu-submenu-title {
     height: 40px;
     margin-top: 4px;
     margin-bottom: 4px;
     padding: 0px 16px;
     overflow: hidden;
     line-height: 40px;
     text-overflow: ellipsis;
}
.ant-menu-inline .ant-menu-submenu {
     padding-bottom: 0.02px;
}
 .ant-menu-inline > .ant-menu-submenu > .ant-menu-submenu-title {
     height: 40px;
     line-height: 40px;
}
.ant-menu-inline {
     width: 100%;
}
 .ant-menu-inline .ant-menu-submenu-title {
     width: calc(100% + 1px);
}
 .ant-menu-inline .ant-menu-submenu-title {
     padding-right: 34px;
}
 .ant-menu-inline.ant-menu-root .ant-menu-submenu-title {
     display: flex;
     align-items: center;
     transition: border-color 0.3s, background 0.3s, padding 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
}
 .ant-menu-inline.ant-menu-root .ant-menu-submenu-title > .ant-menu-title-content {
     flex: 1 1 auto;
     min-width: 0px;
     overflow: hidden;
     text-overflow: ellipsis;
}
 .ant-menu-inline.ant-menu-root .ant-menu-submenu-title > * {
     flex: 0 0 auto;
}
.ant-menu-root.ant-menu-inline {
     box-shadow: none;
}
 .ant-menu-light .ant-menu-submenu-title:hover {
     color: var(--brand-button-green);
}
@-webkit-keyframes MessageMoveOut {
        0% {
         max-height: 150px;
         padding: 8px;
         opacity: 1;
    }
       100% {
         max-height: 0px;
         padding: 0px;
         opacity: 0;
    }
}
@keyframes MessageMoveOut {
        0% {
         max-height: 150px;
         padding: 8px;
         opacity: 1;
    }
       100% {
         max-height: 0px;
         padding: 0px;
         opacity: 0;
    }
}
.ant-modal {
     box-sizing: border-box;
     color: rgba(0, 0, 0, 0.85);
     font-size: 14px;
     font-variant: tabular-nums;
     line-height: 1.5715;
     list-style: none;
     font-feature-settings: "tnum", "tnum";
     pointer-events: none;
     position: relative;
     top: 100px;
     width: auto;
     max-width: calc(-32px + 100vw);
     margin: 0px auto;
     padding: 0px 0px 24px;
}
.ant-modal-mask {
     position: fixed;
     inset: 0px;
     z-index: 1000;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.45);
}
.ant-modal-wrap {
     position: fixed;
     inset: 0px;
     overflow: auto;
     outline: 0px;
     z-index: 1000;
}
.ant-modal-title {
     margin: 0px;
     color: rgba(0, 0, 0, 0.85);
     font-weight: 500;
     font-size: 16px;
     line-height: 22px;
     overflow-wrap: break-word;
}
.ant-modal-content {
     position: relative;
     background-color: rgb(255, 255, 255);
     background-clip: padding-box;
     border: 0px;
     border-radius: 2px;
     box-shadow: rgba(0, 0, 0, 0.12) 0px 3px 6px -4px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.05) 0px 9px 28px 8px;
     pointer-events: auto;
}
.ant-modal-close {
     position: absolute;
     top: 0px;
     right: 0px;
     z-index: 10;
     padding: 0px;
     color: rgba(0, 0, 0, 0.45);
     font-weight: 700;
     line-height: 1;
     text-decoration: none;
     background: transparent;
     border: 0px;
     outline: 0px;
     cursor: pointer;
     transition: color 0.3s;
}
.ant-modal-close-x {
     display: block;
     width: 56px;
     height: 56px;
     font-size: 16px;
     font-style: normal;
     line-height: 56px;
     text-align: center;
     text-transform: none;
     text-rendering: auto;
}
.ant-modal-close:focus,  .ant-modal-close:hover {
     color: rgba(0, 0, 0, 0.75);
     text-decoration: none;
}
.ant-modal-header {
     padding: 16px 24px;
     color: rgba(0, 0, 0, 0.85);
     background: rgb(255, 255, 255);
     border-bottom: 1px solid rgb(240, 240, 240);
     border-radius: 2px 2px 0px 0px;
}
.ant-modal-body {
     padding: 24px;
     font-size: 14px;
     line-height: 1.5715;
     overflow-wrap: break-word;
}
@media (max-width: 767px) {
     .ant-modal {
         max-width: calc(-16px + 100vw);
         margin: 8px auto;
    }
}
@-webkit-keyframes NotificationFadeIn {
        0% {
         left: 384px;
         opacity: 0;
    }
       100% {
         left: 0px;
         opacity: 1;
    }
}
@keyframes NotificationFadeIn {
        0% {
         left: 384px;
         opacity: 0;
    }
       100% {
         left: 0px;
         opacity: 1;
    }
}
@-webkit-keyframes NotificationLeftFadeIn {
        0% {
         right: 384px;
         opacity: 0;
    }
       100% {
         right: 0px;
         opacity: 1;
    }
}
@keyframes NotificationLeftFadeIn {
        0% {
         right: 384px;
         opacity: 0;
    }
       100% {
         right: 0px;
         opacity: 1;
    }
}
@-webkit-keyframes NotificationFadeOut {
        0% {
         max-height: 150px;
         margin-bottom: 16px;
         opacity: 1;
    }
       100% {
         max-height: 0px;
         margin-bottom: 0px;
         padding-top: 0px;
         padding-bottom: 0px;
         opacity: 0;
    }
}
@keyframes NotificationFadeOut {
        0% {
         max-height: 150px;
         margin-bottom: 16px;
         opacity: 1;
    }
       100% {
         max-height: 0px;
         margin-bottom: 0px;
         padding-top: 0px;
         padding-bottom: 0px;
         opacity: 0;
    }
}
.ant-page-header-heading-extra > :first-child {
     margin-left: 0px;
}
.ant-page-header-rtl .ant-page-header-heading-extra > :first-child {
     margin-right: 0px;
}
@-webkit-keyframes ant-progress-active {
        0% {
         transform: translateX(-100%) scaleX(0);
         opacity: 0.1;
    }
       20% {
         transform: translateX(-100%) scaleX(0);
         opacity: 0.5;
    }
       100% {
         transform: translateX(0px) scaleX(1);
         opacity: 0;
    }
}
@keyframes ant-progress-active {
        0% {
         transform: translateX(-100%) scaleX(0);
         opacity: 0.1;
    }
       20% {
         transform: translateX(-100%) scaleX(0);
         opacity: 0.5;
    }
       100% {
         transform: translateX(0px) scaleX(1);
         opacity: 0;
    }
}
@-webkit-keyframes antRadioEffect {
        0% {
         transform: scale(1);
         opacity: 0.5;
    }
       100% {
         transform: scale(1.6);
         opacity: 0;
    }
}
@keyframes antRadioEffect {
        0% {
         transform: scale(1);
         opacity: 0.5;
    }
       100% {
         transform: scale(1.6);
         opacity: 0;
    }
}
.ant-result-extra > :last-child {
     margin-right: 0px;
}
.ant-result-rtl .ant-result-extra > :last-child {
     margin-left: 0px;
}
.ant-skeleton-content .ant-skeleton-paragraph > li:last-child:not(:first-child):not(:nth-child(2)) {
     width: 61%;
}
@-webkit-keyframes ant-skeleton-loading {
        0% {
         background-position: 100% 50%;
    }
       100% {
         background-position: 0px 50%;
    }
}
@keyframes ant-skeleton-loading {
        0% {
         background-position: 100% 50%;
    }
       100% {
         background-position: 0px 50%;
    }
}
@-webkit-keyframes ant-skeleton-loading-rtl {
        0% {
         background-position: 0px 50%;
    }
       100% {
         background-position: 100% 50%;
    }
}
@keyframes ant-skeleton-loading-rtl {
        0% {
         background-position: 0px 50%;
    }
       100% {
         background-position: 100% 50%;
    }
}
@-webkit-keyframes antSpinMove {
        100% {
         opacity: 1;
    }
}
@keyframes antSpinMove {
        100% {
         opacity: 1;
    }
}
@-webkit-keyframes antRotate {
        100% {
         transform: rotate(405deg);
    }
}
@keyframes antRotate {
        100% {
         transform: rotate(405deg);
    }
}
@-webkit-keyframes antRotateRtl {
        100% {
         transform: rotate(-405deg);
    }
}
@keyframes antRotateRtl {
        100% {
         transform: rotate(-405deg);
    }
}
.ant-transfer-list-header > :not(:last-child) {
     margin-right: 4px;
}
.ant-transfer-list-content-item > :not(:last-child) {
     margin-right: 8px;
}
.ant-transfer-rtl .ant-transfer-list-header > :not(:last-child) {
     margin-right: 0px;
     margin-left: 4px;
}
.ant-transfer-rtl .ant-transfer-list-content-item > :not(:last-child) {
     margin-right: 0px;
     margin-left: 8px;
}
@-webkit-keyframes uploadAnimateInlineIn {
        0% {
         width: 0px;
         height: 0px;
         margin: 0px;
         padding: 0px;
         opacity: 0;
    }
}
@keyframes uploadAnimateInlineIn {
        0% {
         width: 0px;
         height: 0px;
         margin: 0px;
         padding: 0px;
         opacity: 0;
    }
}
@-webkit-keyframes uploadAnimateInlineOut {
        100% {
         width: 0px;
         height: 0px;
         margin: 0px;
         padding: 0px;
         opacity: 0;
    }
}
@keyframes uploadAnimateInlineOut {
        100% {
         width: 0px;
         height: 0px;
         margin: 0px;
         padding: 0px;
         opacity: 0;
    }
}
.animated {
     animation-duration: 1s;
     animation-fill-mode: both;
}
@-webkit-keyframes bounce {
        0%, 20%, 50%, 80%, 100% {
         transform: translateY(0px);
    }
       40% {
         transform: translateY(-30px);
    }
       60% {
         transform: translateY(-15px);
    }
}
@keyframes bounce {
        0%, 20%, 50%, 80%, 100% {
         transform: translateY(0px);
    }
       40% {
         transform: translateY(-30px);
    }
       60% {
         transform: translateY(-15px);
    }
}
@-webkit-keyframes flash {
        0%, 50%, 100% {
         opacity: 1;
    }
       25%, 75% {
         opacity: 0;
    }
}
@keyframes flash {
        0%, 50%, 100% {
         opacity: 1;
    }
       25%, 75% {
         opacity: 0;
    }
}
@-webkit-keyframes pulse {
        0% {
         transform: scale(1);
    }
       50% {
         transform: scale(1.1);
    }
       100% {
         transform: scale(1);
    }
}
@keyframes pulse {
        0% {
         transform: scale(1);
    }
       50% {
         transform: scale(1.1);
    }
       100% {
         transform: scale(1);
    }
}
@-webkit-keyframes shake {
        0%, 100% {
         transform: translateX(0px);
    }
       10%, 30%, 50%, 70%, 90% {
         transform: translateX(-10px);
    }
       20%, 40%, 60%, 80% {
         transform: translateX(10px);
    }
}
@keyframes shake {
        0%, 100% {
         transform: translateX(0px);
    }
       10%, 30%, 50%, 70%, 90% {
         transform: translateX(-10px);
    }
       20%, 40%, 60%, 80% {
         transform: translateX(10px);
    }
}
@-webkit-keyframes swing {
        20% {
         transform: rotate(15deg);
    }
       40% {
         transform: rotate(-10deg);
    }
       60% {
         transform: rotate(5deg);
    }
       80% {
         transform: rotate(-5deg);
    }
       100% {
         transform: rotate(0deg);
    }
}
@keyframes swing {
        20% {
         transform: rotate(15deg);
    }
       40% {
         transform: rotate(-10deg);
    }
       60% {
         transform: rotate(5deg);
    }
       80% {
         transform: rotate(-5deg);
    }
       100% {
         transform: rotate(0deg);
    }
}
@-webkit-keyframes tada {
        0% {
         transform: scale(1);
    }
       10%, 20% {
         transform: scale(0.9) rotate(-3deg);
    }
       30%, 50%, 70%, 90% {
         transform: scale(1.1) rotate(3deg);
    }
       40%, 60%, 80% {
         transform: scale(1.1) rotate(-3deg);
    }
       100% {
         transform: scale(1) rotate(0deg);
    }
}
@keyframes tada {
        0% {
         transform: scale(1);
    }
       10%, 20% {
         transform: scale(0.9) rotate(-3deg);
    }
       30%, 50%, 70%, 90% {
         transform: scale(1.1) rotate(3deg);
    }
       40%, 60%, 80% {
         transform: scale(1.1) rotate(-3deg);
    }
       100% {
         transform: scale(1) rotate(0deg);
    }
}
@-webkit-keyframes wobble {
        0% {
         transform: translateX(0px);
    }
       15% {
         transform: translateX(-25%) rotate(-5deg);
    }
       30% {
         transform: translateX(20%) rotate(3deg);
    }
       45% {
         transform: translateX(-15%) rotate(-3deg);
    }
       60% {
         transform: translateX(10%) rotate(2deg);
    }
       75% {
         transform: translateX(-5%) rotate(-1deg);
    }
       100% {
         transform: translateX(0px);
    }
}
@keyframes wobble {
        0% {
         transform: translateX(0px);
    }
       15% {
         transform: translateX(-25%) rotate(-5deg);
    }
       30% {
         transform: translateX(20%) rotate(3deg);
    }
       45% {
         transform: translateX(-15%) rotate(-3deg);
    }
       60% {
         transform: translateX(10%) rotate(2deg);
    }
       75% {
         transform: translateX(-5%) rotate(-1deg);
    }
       100% {
         transform: translateX(0px);
    }
}
@-webkit-keyframes bounceIn {
        0% {
         opacity: 0;
         transform: scale(0.3);
    }
       50% {
         opacity: 1;
         transform: scale(1.05);
    }
       70% {
         transform: scale(0.9);
    }
       100% {
         transform: scale(1);
    }
}
@keyframes bounceIn {
        0% {
         opacity: 0;
         transform: scale(0.3);
    }
       50% {
         opacity: 1;
         transform: scale(1.05);
    }
       70% {
         transform: scale(0.9);
    }
       100% {
         transform: scale(1);
    }
}
@-webkit-keyframes bounceInDown {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       60% {
         opacity: 1;
         transform: translateY(30px);
    }
       80% {
         transform: translateY(-10px);
    }
       100% {
         transform: translateY(0px);
    }
}
@keyframes bounceInDown {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       60% {
         opacity: 1;
         transform: translateY(30px);
    }
       80% {
         transform: translateY(-10px);
    }
       100% {
         transform: translateY(0px);
    }
}
@-webkit-keyframes bounceInLeft {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       60% {
         opacity: 1;
         transform: translateX(30px);
    }
       80% {
         transform: translateX(-10px);
    }
       100% {
         transform: translateX(0px);
    }
}
@keyframes bounceInLeft {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       60% {
         opacity: 1;
         transform: translateX(30px);
    }
       80% {
         transform: translateX(-10px);
    }
       100% {
         transform: translateX(0px);
    }
}
@-webkit-keyframes bounceInRight {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       60% {
         opacity: 1;
         transform: translateX(-30px);
    }
       80% {
         transform: translateX(10px);
    }
       100% {
         transform: translateX(0px);
    }
}
@keyframes bounceInRight {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       60% {
         opacity: 1;
         transform: translateX(-30px);
    }
       80% {
         transform: translateX(10px);
    }
       100% {
         transform: translateX(0px);
    }
}
@-webkit-keyframes bounceInUp {
        0% {
         opacity: 0;
         transform: translateY(2000px);
    }
       60% {
         opacity: 1;
         transform: translateY(-30px);
    }
       80% {
         transform: translateY(10px);
    }
       100% {
         transform: translateY(0px);
    }
}
@keyframes bounceInUp {
        0% {
         opacity: 0;
         transform: translateY(2000px);
    }
       60% {
         opacity: 1;
         transform: translateY(-30px);
    }
       80% {
         transform: translateY(10px);
    }
       100% {
         transform: translateY(0px);
    }
}
@-webkit-keyframes bounceOut {
        0% {
         transform: scale(1);
    }
       25% {
         transform: scale(0.95);
    }
       50% {
         opacity: 1;
         transform: scale(1.1);
    }
       100% {
         opacity: 0;
         transform: scale(0.3);
    }
}
@keyframes bounceOut {
        0% {
         transform: scale(1);
    }
       25% {
         transform: scale(0.95);
    }
       50% {
         opacity: 1;
         transform: scale(1.1);
    }
       100% {
         opacity: 0;
         transform: scale(0.3);
    }
}
@-webkit-keyframes bounceOutDown {
        0% {
         transform: translateY(0px);
    }
       20% {
         opacity: 1;
         transform: translateY(-20px);
    }
       100% {
         opacity: 0;
         transform: translateY(2000px);
    }
}
@keyframes bounceOutDown {
        0% {
         transform: translateY(0px);
    }
       20% {
         opacity: 1;
         transform: translateY(-20px);
    }
       100% {
         opacity: 0;
         transform: translateY(2000px);
    }
}
@-webkit-keyframes bounceOutLeft {
        0% {
         transform: translateX(0px);
    }
       20% {
         opacity: 1;
         transform: translateX(20px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@keyframes bounceOutLeft {
        0% {
         transform: translateX(0px);
    }
       20% {
         opacity: 1;
         transform: translateX(20px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@-webkit-keyframes bounceOutRight {
        0% {
         transform: translateX(0px);
    }
       20% {
         opacity: 1;
         transform: translateX(-20px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@keyframes bounceOutRight {
        0% {
         transform: translateX(0px);
    }
       20% {
         opacity: 1;
         transform: translateX(-20px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@-webkit-keyframes bounceOutUp {
        0% {
         transform: translateY(0px);
    }
       20% {
         opacity: 1;
         transform: translateY(20px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@keyframes bounceOutUp {
        0% {
         transform: translateY(0px);
    }
       20% {
         opacity: 1;
         transform: translateY(20px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@-webkit-keyframes fadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@keyframes fadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@-webkit-keyframes fadeInDown {
        0% {
         opacity: 0;
         transform: translateY(-20px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@keyframes fadeInDown {
        0% {
         opacity: 0;
         transform: translateY(-20px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@-webkit-keyframes fadeInDownBig {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@keyframes fadeInDownBig {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@-webkit-keyframes fadeInLeft {
        0% {
         opacity: 0;
         transform: translateX(-20px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@keyframes fadeInLeft {
        0% {
         opacity: 0;
         transform: translateX(-20px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@-webkit-keyframes fadeInLeftBig {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@keyframes fadeInLeftBig {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@-webkit-keyframes fadeInRight {
        0% {
         opacity: 0;
         transform: translateX(20px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@keyframes fadeInRight {
        0% {
         opacity: 0;
         transform: translateX(20px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@-webkit-keyframes fadeInRightBig {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@keyframes fadeInRightBig {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       100% {
         opacity: 1;
         transform: translateX(0px);
    }
}
@-webkit-keyframes fadeInUp {
        0% {
         opacity: 0;
         transform: translateY(20px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@keyframes fadeInUp {
        0% {
         opacity: 0;
         transform: translateY(20px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
.fadeInUp {
     animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
        0% {
         opacity: 0;
         transform: translateY(2000px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@keyframes fadeInUpBig {
        0% {
         opacity: 0;
         transform: translateY(2000px);
    }
       100% {
         opacity: 1;
         transform: translateY(0px);
    }
}
@-webkit-keyframes fadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
@keyframes fadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
@-webkit-keyframes fadeOutDown {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(20px);
    }
}
@keyframes fadeOutDown {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(20px);
    }
}
@-webkit-keyframes fadeOutDownBig {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(2000px);
    }
}
@keyframes fadeOutDownBig {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(2000px);
    }
}
@-webkit-keyframes fadeOutLeft {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-20px);
    }
}
@keyframes fadeOutLeft {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-20px);
    }
}
@-webkit-keyframes fadeOutLeftBig {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@keyframes fadeOutLeftBig {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@-webkit-keyframes fadeOutRight {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(20px);
    }
}
@keyframes fadeOutRight {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(20px);
    }
}
@-webkit-keyframes fadeOutRightBig {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@keyframes fadeOutRightBig {
        0% {
         opacity: 1;
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@-webkit-keyframes fadeOutUp {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-20px);
    }
}
@keyframes fadeOutUp {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-20px);
    }
}
@-webkit-keyframes fadeOutUpBig {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@keyframes fadeOutUpBig {
        0% {
         opacity: 1;
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@-webkit-keyframes flip {
        0% {
         transform: perspective(400px) translateZ(0px) rotateY(0deg) scale(1);
         animation-timing-function: ease-out;
    }
       40% {
         transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
         animation-timing-function: ease-out;
    }
       50% {
         transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
         animation-timing-function: ease-in;
    }
       80% {
         transform: perspective(400px) translateZ(0px) rotateY(1turn) scale(0.95);
         animation-timing-function: ease-in;
    }
       100% {
         transform: perspective(400px) translateZ(0px) rotateY(1turn) scale(1);
         animation-timing-function: ease-in;
    }
}
@keyframes flip {
        0% {
         transform: perspective(400px) translateZ(0px) rotateY(0deg) scale(1);
         animation-timing-function: ease-out;
    }
       40% {
         transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
         animation-timing-function: ease-out;
    }
       50% {
         transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
         animation-timing-function: ease-in;
    }
       80% {
         transform: perspective(400px) translateZ(0px) rotateY(1turn) scale(0.95);
         animation-timing-function: ease-in;
    }
       100% {
         transform: perspective(400px) translateZ(0px) rotateY(1turn) scale(1);
         animation-timing-function: ease-in;
    }
}
@-webkit-keyframes flipInX {
        0% {
         transform: perspective(400px) rotateX(90deg);
         opacity: 0;
    }
       40% {
         transform: perspective(400px) rotateX(-10deg);
    }
       70% {
         transform: perspective(400px) rotateX(10deg);
    }
       100% {
         transform: perspective(400px) rotateX(0deg);
         opacity: 1;
    }
}
@keyframes flipInX {
        0% {
         transform: perspective(400px) rotateX(90deg);
         opacity: 0;
    }
       40% {
         transform: perspective(400px) rotateX(-10deg);
    }
       70% {
         transform: perspective(400px) rotateX(10deg);
    }
       100% {
         transform: perspective(400px) rotateX(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes flipInY {
        0% {
         transform: perspective(400px) rotateY(90deg);
         opacity: 0;
    }
       40% {
         transform: perspective(400px) rotateY(-10deg);
    }
       70% {
         transform: perspective(400px) rotateY(10deg);
    }
       100% {
         transform: perspective(400px) rotateY(0deg);
         opacity: 1;
    }
}
@keyframes flipInY {
        0% {
         transform: perspective(400px) rotateY(90deg);
         opacity: 0;
    }
       40% {
         transform: perspective(400px) rotateY(-10deg);
    }
       70% {
         transform: perspective(400px) rotateY(10deg);
    }
       100% {
         transform: perspective(400px) rotateY(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes flipOutX {
        0% {
         transform: perspective(400px) rotateX(0deg);
         opacity: 1;
    }
       100% {
         transform: perspective(400px) rotateX(90deg);
         opacity: 0;
    }
}
@keyframes flipOutX {
        0% {
         transform: perspective(400px) rotateX(0deg);
         opacity: 1;
    }
       100% {
         transform: perspective(400px) rotateX(90deg);
         opacity: 0;
    }
}
@-webkit-keyframes flipOutY {
        0% {
         transform: perspective(400px) rotateY(0deg);
         opacity: 1;
    }
       100% {
         transform: perspective(400px) rotateY(90deg);
         opacity: 0;
    }
}
@keyframes flipOutY {
        0% {
         transform: perspective(400px) rotateY(0deg);
         opacity: 1;
    }
       100% {
         transform: perspective(400px) rotateY(90deg);
         opacity: 0;
    }
}
@-webkit-keyframes lightSpeedIn {
        0% {
         transform: translateX(100%) skewX(-30deg);
         opacity: 0;
    }
       60% {
         transform: translateX(-20%) skewX(30deg);
         opacity: 1;
    }
       80% {
         transform: translateX(0px) skewX(-15deg);
         opacity: 1;
    }
       100% {
         transform: translateX(0px) skewX(0deg);
         opacity: 1;
    }
}
@keyframes lightSpeedIn {
        0% {
         transform: translateX(100%) skewX(-30deg);
         opacity: 0;
    }
       60% {
         transform: translateX(-20%) skewX(30deg);
         opacity: 1;
    }
       80% {
         transform: translateX(0px) skewX(-15deg);
         opacity: 1;
    }
       100% {
         transform: translateX(0px) skewX(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes lightSpeedOut {
        0% {
         transform: translateX(0px) skewX(0deg);
         opacity: 1;
    }
       100% {
         transform: translateX(100%) skewX(-30deg);
         opacity: 0;
    }
}
@keyframes lightSpeedOut {
        0% {
         transform: translateX(0px) skewX(0deg);
         opacity: 1;
    }
       100% {
         transform: translateX(100%) skewX(-30deg);
         opacity: 0;
    }
}
@-webkit-keyframes rotateIn {
        0% {
         transform-origin: center center;
         transform: rotate(-200deg);
         opacity: 0;
    }
       100% {
         transform-origin: center center;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@keyframes rotateIn {
        0% {
         transform-origin: center center;
         transform: rotate(-200deg);
         opacity: 0;
    }
       100% {
         transform-origin: center center;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes rotateInDownLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@keyframes rotateInDownLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes rotateInDownRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@keyframes rotateInDownRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes rotateInUpLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@keyframes rotateInUpLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes rotateInUpRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@keyframes rotateInUpRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
}
@-webkit-keyframes rotateOut {
        0% {
         transform-origin: center center;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: center center;
         transform: rotate(200deg);
         opacity: 0;
    }
}
@keyframes rotateOut {
        0% {
         transform-origin: center center;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: center center;
         transform: rotate(200deg);
         opacity: 0;
    }
}
@-webkit-keyframes rotateOutDownLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
}
@keyframes rotateOutDownLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
}
@-webkit-keyframes rotateOutDownRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
}
@keyframes rotateOutDownRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
}
@-webkit-keyframes rotateOutUpLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
}
@keyframes rotateOutUpLeft {
        0% {
         transform-origin: left bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: left bottom;
         transform: rotate(-90deg);
         opacity: 0;
    }
}
@-webkit-keyframes rotateOutUpRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
}
@keyframes rotateOutUpRight {
        0% {
         transform-origin: right bottom;
         transform: rotate(0deg);
         opacity: 1;
    }
       100% {
         transform-origin: right bottom;
         transform: rotate(90deg);
         opacity: 0;
    }
}
@-webkit-keyframes slideInDown {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       100% {
         transform: translateY(0px);
    }
}
@keyframes slideInDown {
        0% {
         opacity: 0;
         transform: translateY(-2000px);
    }
       100% {
         transform: translateY(0px);
    }
}
@-webkit-keyframes slideInLeft {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       100% {
         transform: translateX(0px);
    }
}
@keyframes slideInLeft {
        0% {
         opacity: 0;
         transform: translateX(-2000px);
    }
       100% {
         transform: translateX(0px);
    }
}
@-webkit-keyframes slideInRight {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       100% {
         transform: translateX(0px);
    }
}
@keyframes slideInRight {
        0% {
         opacity: 0;
         transform: translateX(2000px);
    }
       100% {
         transform: translateX(0px);
    }
}
@-webkit-keyframes slideOutLeft {
        0% {
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@keyframes slideOutLeft {
        0% {
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(-2000px);
    }
}
@-webkit-keyframes slideOutRight {
        0% {
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@keyframes slideOutRight {
        0% {
         transform: translateX(0px);
    }
       100% {
         opacity: 0;
         transform: translateX(2000px);
    }
}
@-webkit-keyframes slideOutUp {
        0% {
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@keyframes slideOutUp {
        0% {
         transform: translateY(0px);
    }
       100% {
         opacity: 0;
         transform: translateY(-2000px);
    }
}
@-webkit-keyframes hinge {
        0% {
         transform: rotate(0deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       20%, 60% {
         transform: rotate(80deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       40% {
         transform: rotate(60deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       80% {
         transform: rotate(60deg) translateY(0px);
         opacity: 1;
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       100% {
         transform: translateY(700px);
         opacity: 0;
    }
}
@keyframes hinge {
        0% {
         transform: rotate(0deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       20%, 60% {
         transform: rotate(80deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       40% {
         transform: rotate(60deg);
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       80% {
         transform: rotate(60deg) translateY(0px);
         opacity: 1;
         transform-origin: left top;
         animation-timing-function: ease-in-out;
    }
       100% {
         transform: translateY(700px);
         opacity: 0;
    }
}
@-webkit-keyframes rollIn {
        0% {
         opacity: 0;
         transform: translateX(-100%) rotate(-120deg);
    }
       100% {
         opacity: 1;
         transform: translateX(0px) rotate(0deg);
    }
}
@keyframes rollIn {
        0% {
         opacity: 0;
         transform: translateX(-100%) rotate(-120deg);
    }
       100% {
         opacity: 1;
         transform: translateX(0px) rotate(0deg);
    }
}
@-webkit-keyframes rollOut {
        0% {
         opacity: 1;
         transform: translateX(0px) rotate(0deg);
    }
       100% {
         opacity: 0;
         transform: translateX(100%) rotate(120deg);
    }
}
@keyframes rollOut {
        0% {
         opacity: 1;
         transform: translateX(0px) rotate(0deg);
    }
       100% {
         opacity: 0;
         transform: translateX(100%) rotate(120deg);
    }
}
@font-face {
     font-family: iconfont;
     src: url("../fonts/d466dbd3-iconfont.f1191a07.woff2") format("woff2"), url("/static/media/iconfont.f73c24eb.woff") format("woff"), url("/static/media/iconfont.b25f051c.ttf") format("truetype");
}
.iconfont {
     font-size: 16px;
     font-style: normal;
     -webkit-font-smoothing: antialiased;
     font-family: iconfont !important;
}
.iconfenjianchuku::before {
     content: "";
}
.iconbaodanfenjian::before {
     content: "";
}
.iconCeiling::before {
     content: "";
}
.iconlianxi_h::before {
     content: "";
}
.iconicon_quchechaxun::before {
     content: "";
}
.icon-network::before {
     content: "";
}
.icongjiantous::before {
     content: "";
}
.iconwuliu1::before {
     content: "";
}
.iconicon_jiantou_r::before {
     content: "";
}
.iconicon_jiantou_l::before {
     content: "";
}
.iconicon_home_mouse::before {
     content: "";
}
.iconicon_linkedin::before {
     content: "";
}
.iconicon_youtube::before {
     content: "";
}
.iconnav_search::before {
     content: "";
}
.icona-icon_rightmenu_top::before {
     content: "";
}
.icona-icon_rightmenu_message::before {
     content: "";
}
.icona-icon_rightmenu_wechat::before {
     content: "";
}
.icona-icon_rightmenu_tel::before {
     content: "";
}
* {
     box-sizing: border-box;
}
 button,  form,  h2,  h3,  h5,  img,  input,  li,  p,  ul {
     margin: 0px;
     padding: 0px;
}
 h2,  h3,  h5 {
     font-weight: 600;
}
button,  img,  input {
     border-width: medium;
     border-style: none;
     border-color: currentcolor;
     border-image: none;
     padding: 0px;
     margin: 0px;
     outline: none;
}
 ul {
     list-style: none;
}
img {
     border: 0px;
     vertical-align: middle;
     height: auto;
}
a,  a:hover {
     color: rgb(51, 51, 51);
     text-decoration: none;
     outline: none;
}
 i {
     font-style: normal;
}
::-webkit-input-placeholder {
     color: rgb(153, 153, 153);
}
.mask-bg {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0px;
     z-index: 1;
     background-color: rgba(18, 18, 18, 0.4);
}
@media screen and (max-width: 1024px) {
     #root {
         display: flex;
         flex-direction: column;
         min-height: 100vh;
    }
     #root .layout-container {
         flex: 1 0 auto;
    }
}
.container {
     width: 1400px;
     margin: auto;
}
@media screen and (max-width: 1600px) and (min-width: 1024px) {
     .container {
         width: 80%;
    }
}
@media screen and (max-width: 1024px) {
     .container {
         width: 92%;
    }
}
.layout-container {
     min-height: 400px;
     width: 100%;
     max-width: 1920px;
     margin: auto;
     background: rgb(248, 248, 248);
}
@media screen and (max-width: 1024px) {
     .layout-container {
         padding-top: 60px;
    }
}
@font-face {
     font-family: "Open Sans";
     src: url("/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
     font-family: OpenSansBold;
     src: url("/OpenSans-Bold.ttf") format("truetype");
}
@font-face {
     font-family: OpenSansLight;
     src: url("/OpenSans-Light.ttf") format("truetype");
}
.ant-input-clear-icon {
     color: rgb(193, 193, 193) !important;
}
.ant-input-clear-icon:hover {
     color: rgb(153, 153, 153) !important;
}
 .ant-input:focus {
     border-color: var(--brand-button-green);
}
.ant-btn {
     height: 40px;
     border-radius: 20px;
     padding: 4px 28px;
}
@media screen and (max-width: 767px) {
     .ant-btn {
         height: 36px;
         border-radius: 18px;
         padding: 4px 22px;
    }
}
.header-search-modal .ant-modal {
     width: 920px !important;
}
.header-search-modal .ant-modal .ant-modal-content {
     background: transparent;
     box-shadow: none;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-close {
     right: -56px;
     top: 36px;
     color: rgb(255, 255, 255);
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x {
     font-size: 27px;
     transition: 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-close:hover .ant-modal-close-x {
     transform: rotate(180deg);
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-header {
     background: transparent;
     border-width: medium;
     border-style: none;
     border-color: currentcolor;
     border-image: none;
     padding: 18px 0px;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-header .ant-modal-title {
     font-size: 40px;
     color: rgb(255, 255, 255);
     line-height: 67px;
     text-align: center;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body {
     padding: 0px;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper {
     padding: 23px 48px 23px 56px;
     border-width: medium;
     border-style: none;
     border-color: currentcolor;
     border-image: none;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper .ant-input {
     font-size: 18px;
     font-weight: 400;
     line-height: 25px;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper .ant-input-suffix {
     margin-left: 20px;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper .ant-input-suffix .search-icon {
     cursor: pointer;
     font-size: 20px;
     line-height: 25px;
     color: rgb(51, 51, 51);
     transition: 0.4s;
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper .ant-input-suffix .search-icon:hover {
     color: var(--brand-button-green);
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper .ant-input-suffix .ant-input-clear-icon {
     font-size: 16px;
     margin: 0px 10px;
     color: rgb(153, 153, 153);
}
.header-search-modal .ant-modal .ant-modal-content .ant-modal-body .search-modal-body .ant-input-affix-wrapper:hover {
     border-width: medium !important;
     border-style: none !important;
     border-color: currentcolor !important;
     border-image: none !important;
}
@media screen and (max-width: 1100px) {
     .header-search-modal .ant-modal {
         width: 80% !important;
    }
}
.header {
     width: 100%;
     height: 80px;
     background: rgb(255, 255, 255);
     border-bottom: 1px solid rgb(232, 232, 232);
     position: fixed;
     top: 0px;
     z-index: 99;
     transition: 0.4s;
}
.header.transparent {
     border-bottom-width: medium;
     border-bottom-style: none;
     border-bottom-color: currentcolor;
     background: linear-gradient(rgba(0, 0, 0, 0.1), transparent);
}
.header.transparent .language-wraper .language-item > a.active,  .header.transparent .language-wraper li .iconfont,  .header.transparent .nav-container .nav-list .nav-item > a {
     color: rgb(255, 255, 255);
}
.header.transparent .language-wraper li:last-child::before {
     content: "/";
     color: rgb(255, 255, 255);
}
.header.transparent .search {
     color: rgb(255, 255, 255);
}
.header .header-content,  .header .header-right {
     display: flex;
     justify-content: space-between;
}
.header .logo {
     height: 100%;
     line-height: 80px;
}
.header .logo img {
     height: 26px;
}
.header .logo.cn img {
     height: 56px;
}
.header .nav-container .nav-list .nav-item {
     position: relative;
     float: left;
     display: block;
     height: 80px;
     padding: 0px 10px;
     margin: 0px 26px;
}
.header .nav-container .nav-list .nav-item > a {
     position: relative;
     display: block;
     font-size: 16px;
     color: rgb(51, 51, 51);
     line-height: 80px;
}
.header .nav-container .nav-list .nav-item > a::after {
     content: "";
     width: 0px;
     height: 3px;
     background: var(--brand-button-green);
     position: absolute;
     left: 50%;
     bottom: 16px;
     z-index: 2;
     transition: 0.6s;
}
.header .nav-container .nav-list .nav-item:hover > a::after {
     left: 0px;
     width: 100%;
}
.header .nav-container .nav-list .nav-item .nav-collapse {
     position: fixed;
     left: 0px;
     width: 100%;
     transition: height 0.4s cubic-bezier(0.26, 0.63, 0.26, 0.88);
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown {
     width: 100%;
     background: rgb(255, 255, 255);
     overflow: hidden;
     border-bottom: 1px solid rgb(222, 222, 222);
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul {
     padding: 40px 0px;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu {
     margin-bottom: 40px;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu .second-name {
     font-size: 16px;
     line-height: 22px;
     font-weight: 700;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu .line {
     line-height: 3px;
     margin: 6px 0px 16px;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu .third-ul .third-menu {
     margin-bottom: 12px;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu .third-ul .third-menu .third-name {
     font-size: 14px;
     font-weight: 400;
     color: rgb(102, 102, 102);
     line-height: 20px;
     transition: 0.3s;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .second-ul .second-menu .third-ul .third-menu .third-name:hover {
     color: var(--brand-button-green);
     cursor: pointer;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .column-wrap {
     column-count: 7;
     column-gap: 20px;
}
@media screen and (max-width: 1200px) {
     .header .nav-container .nav-list .nav-item .nav-item-dropdown .column-wrap {
         column-count: 5;
    }
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .column-wrap .second-menu {
     break-inside: avoid;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .flex-wrap {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown .flex-wrap .second-menu {
     max-width: 182px;
     margin-right: 60px;
     margin-bottom: 0px;
}
.header .nav-container .nav-list .nav-item .nav-collapse-small {
     position: absolute;
     left: 50%;
     top: 100%;
     width: 188px;
     transform: translateX(-50%);
     box-shadow: rgba(0, 0, 0, 0.1) 0px 8px 16px 0px;
     transition: height 0.4s cubic-bezier(0.26, 0.63, 0.26, 0.88);
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown-small {
     width: 100%;
     background: rgb(255, 255, 255);
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown-small .dropdown-items .dropdown-item a {
     display: block;
     padding: 11px 16px;
     font-size: 16px;
     line-height: 22px;
     color: rgb(51, 51, 51);
     font-weight: 400;
}
.header .nav-container .nav-list .nav-item .nav-item-dropdown-small .dropdown-items .dropdown-item a:hover {
     background-color: rgb(244, 244, 244);
     color: var(--brand-button-green);
}
.header .language-wraper {
     position: relative;
}
.header .language-wraper li {
     float: left;
     line-height: 80px;
     color: rgb(102, 102, 102);
     transition: 0.4s;
     cursor: pointer;
}
.header .language-wraper li .iconfont {
     color: rgb(102, 102, 102);
}
.header .language-wraper li:last-child::before {
     content: "/";
     color: rgb(102, 102, 102);
}
.header .language-wraper .language-item > a {
     line-height: 80px;
     padding: 0px 6px;
     color: rgb(153, 153, 153);
     font-size: 14px;
}
.header .language-wraper .language-item > a.active {
     color: rgb(51, 51, 51);
}
.header .search {
     color: rgb(51, 51, 51);
     line-height: 80px;
     margin-left: 45px;
     cursor: pointer;
     transition: 0.4s;
}
.header .search:hover {
     color: var(--brand-button-green);
}
@media screen and (max-width: 1440px) {
     .header .header-content {
         width: 92% !important;
    }
}
@media screen and (max-width: 1366px) {
     .header .nav-container .nav-list .nav-item {
         padding: 0px 10px;
         margin: 0px 15px;
    }
}
@media screen and (max-width: 1240px) {
     .header .container,  .header .header-content {
         width: 90% !important;
    }
     .header .nav-container .nav-list .nav-item {
         margin: 0px 5px;
    }
     .header .search {
         margin-left: 20px;
    }
}
@media screen and (max-width: 1100px) {
     .header .container,  .header .header-content {
         width: 90% !important;
    }
     .header .search {
         margin-left: 15px;
    }
}
@media screen and (max-width: 1024px) {
     .header .container,  .header .header-content {
         width: 90% !important;
    }
     .header .nav-container,  .header .search {
         display: none;
    }
}
@-webkit-keyframes fadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@keyframes fadeIn {
        0% {
         opacity: 0;
    }
       100% {
         opacity: 1;
    }
}
@-webkit-keyframes fadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
@keyframes fadeOut {
        0% {
         opacity: 1;
    }
       100% {
         opacity: 0;
    }
}
.header-mobile {
     width: 100%;
     height: 60px;
     background: rgb(255, 255, 255);
     border-bottom: 1px solid rgb(232, 232, 232);
     position: fixed;
     top: 0px;
     z-index: 99;
     transition: 0.4s;
}
.header-mobile .header-layout {
     display: flex;
     flex-direction: row-reverse;
     align-items: center;
}
.header-mobile .header-layout .drop-down-btn {
     position: relative;
     width: 22px;
     height: 60px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     cursor: pointer;
}
.header-mobile .header-layout .drop-down-btn:hover > span {
     background: var(--brand-button-green);
}
.header-mobile .header-layout .drop-down-btn > span {
     height: 3px;
     width: 22px;
     border-radius: 4px;
     background: rgb(51, 51, 51);
     transition: 0.4s;
}
.header-mobile .header-layout .drop-down-btn > span:first-child,  .header-mobile .header-layout .drop-down-btn > span:nth-child(3) {
     width: 16px;
}
.header-mobile .header-layout .drop-down-btn > span + span {
     margin-top: 5px;
}
.header-mobile .header-layout .drop-down-btn.active > span {
     position: absolute;
}
.header-mobile .header-layout .drop-down-btn.active > span:nth-child(2) {
     opacity: 0;
}
.header-mobile .header-layout .drop-down-btn.active > span:first-child {
     width: 22px;
     transform: rotate(45deg);
}
.header-mobile .header-layout .drop-down-btn.active > span:nth-child(3) {
     width: 22px;
     transform: rotate(-45deg);
}
.header-mobile .header-layout .drop-down-btn.active > span + span {
     margin-top: 0px;
}
.header-mobile .header-layout .logo {
     position: absolute;
     top: 0px;
     left: 50%;
     transform: translateX(-50%);
     line-height: 60px;
     vertical-align: middle;
}
.header-mobile .header-layout .logo img {
     height: 22px;
}
.header-mobile .header-layout .logo.cn img {
     height: 36px;
}
.header-mobile .header-layout .search-and-langs {
     display: flex;
     justify-content: center;
     align-items: center;
     margin-right: 16px;
}
.header-mobile .header-layout .search-and-langs .right-item {
     cursor: pointer;
     margin-left: 9px;
     padding: 0px 5px;
}
.header-mobile .header-layout .search-and-langs .search .iconfont {
     color: rgb(51, 51, 51);
     font-size: 18px;
     line-height: 60px;
}
.header-mobile .header-layout .search-and-langs .search:hover .iconfont {
     color: var(--brand-button-green);
}
.header-mobile .header-layout .search-and-langs .langs {
     color: rgb(51, 51, 51);
     line-height: 60px;
     font-size: 16px;
}
.header-mobile .header-layout .search-and-langs .langs:hover {
     color: var(--brand-button-green);
}
.mobile-menu-drawer {
     top: 60px;
     height: calc(100% - 60px);
}
.mobile-menu-drawer .ant-drawer-mask {
     background-color: rgba(0, 0, 0, 0.6);
}
.mobile-menu-drawer .ant-drawer-content-wrapper {
     width: 100%;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .ant-drawer-header {
     display: none;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .ant-drawer-body {
     padding: 30px 24px;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper {
     margin-top: 25px;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item {
     font-size: 14px;
     font-weight: 400;
     color: rgb(51, 51, 51);
     line-height: 20px;
     padding: 0px 16px;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item + .menu-item {
     margin-top: 24px;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item a {
     display: block;
}
.mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item .sub-link {
     display: block;
     margin-top: 10px;
     padding-left: 10px;
     color: rgb(153, 153, 153);
}
@media screen and (max-width: 768px) {
     .mobile-menu-drawer .ant-drawer-content-wrapper .ant-drawer-body {
         padding: 12px 16px;
    }
     .mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper {
         margin-top: 0px;
    }
     .mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item {
         padding: 0px;
    }
     .mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item a {
         color: rgb(51, 51, 51);
         display: block;
         font-family: OpenSans;
         font-size: 16px;
         font-weight: 700;
         line-height: 22px;
    }
     .mobile-menu-drawer .ant-drawer-content-wrapper .menu-wraper .menu-item .sub-link {
         font-family: OpenSans;
         font-size: 14px;
         display: block;
         margin-top: 16px;
         padding-left: 16px;
         line-height: 20px;
         color: rgb(102, 102, 102);
         font-weight: 400;
    }
     .header-mobile .header-layout .logo {
         transform: none;
         left: 18px;
    }
     .header-mobile .container {
         width: 100%;
         padding: 0px 16px;
    }
}
.footer {
     width: 100%;
     max-width: 1920px;
     background: rgb(24, 24, 24);
     margin: 0px auto;
     position: relative;
}
.footer .footer-menu-cls {
     display: none;
}
.footer .line-cls {
     width: 100%;
     border-top: 1px solid rgba(255, 255, 255, 0.32);
     margin-top: 12px;
     display: none;
}
.footer .footer-content {
     width: 100%;
     max-width: 1400px;
     margin: 0px auto;
     padding-top: 56px;
     display: flex;
     justify-content: space-between;
}
.footer .footer-content .footer-left {
     width: 864px;
     flex-shrink: 1;
     margin-right: 40px;
}
.footer .footer-content .footer-left .nav-wraper {
     display: flex;
     justify-content: space-around;
}
.footer .footer-content .footer-left .nav-wraper .nav-list .nav-name {
     font-size: 16px;
     font-weight: 600;
     color: rgb(255, 255, 255);
     line-height: 22px;
     padding-bottom: 24px;
}
.footer .footer-content .footer-left .nav-wraper .nav-list .nav-item a {
     font-size: 14px;
     font-weight: 400;
     color: rgba(255, 255, 255, 0.56);
     line-height: 20px;
     cursor: pointer;
}
.footer .footer-content .footer-left .nav-wraper .nav-list .nav-item + .nav-item {
     margin-top: 16px;
}
.footer .footer-content .footer-left .nav-wraper .nav-list .nav-item:hover a {
     color: var(--brand-button-green);
}
.footer .footer-content .footer-left .nav-wraper li:last-child {
     margin-right: 0px;
}
.footer .footer-content .footer-right {
     width: 360px;
     flex-shrink: 0;
}
.footer .footer-content .footer-right .footer-right-top {
     display: flex;
     justify-content: space-between;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .cn {
     display: flex;
     align-items: center;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .cn img {
     height: 58px;
     margin-right: 24px;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .subscribe-new {
     margin: 32px 0px 16px;
     display: block;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .email-box {
     display: flex;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .email-box .icon-btn {
     cursor: pointer;
     width: 40px;
     height: 40px;
     line-height: 40px;
     margin-left: 8px;
     display: inline-block;
     background-color: var(--brand-button-green);
     color: rgb(255, 255, 255);
     text-align: center;
     border-radius: 4px;
     vertical-align: bottom;
     border-width: medium;
     border-style: none;
     border-color: currentcolor;
     border-image: none;
     padding: 0px;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo p {
     font-size: 14px;
     font-weight: 400;
     color: rgba(255, 255, 255, 0.64);
     line-height: 20px;
     margin-bottom: 4px;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo p:last-child {
     font-size: 20px;
     font-weight: 500;
     color: rgba(255, 255, 255, 0.88);
     line-height: 28px;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .ant-form-item {
     margin-bottom: 0px;
     width: 280px;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .ant-input {
     max-width: 280px;
     padding: 10px 14px;
     height: 40px;
     font-size: 14px;
     border-radius: 4px;
}
.footer .footer-content .footer-right .footer-right-bottom {
     display: flex;
     flex: 1 1 0%;
     justify-content: flex-start;
     margin-top: 64px;
}
.footer .footer-content .footer-right .footer-right-bottom .icon {
     width: 28px;
     height: 28px;
     background: rgba(255, 255, 255, 0.48);
     border-radius: 4px;
     text-align: center;
     cursor: pointer;
     transition: 0.4s;
}
.footer .footer-content .footer-right .footer-right-bottom .icon + .icon {
     margin-left: 24px;
}
.footer .footer-content .footer-right .footer-right-bottom .icon a {
     display: inline-block;
     width: 100%;
     height: 100%;
}
.footer .footer-content .footer-right .footer-right-bottom .icon span {
     font-size: 16px;
     color: rgb(24, 24, 24);
     line-height: 28px;
     transition: 0.2s;
}
.footer .footer-content .footer-right .footer-right-bottom .icon .wechat-icon {
     display: inline-block;
     width: 100%;
     height: 100%;
}
.footer .footer-content .footer-right .footer-right-bottom .icon:hover {
     background: var(--brand-button-green);
}
.footer .footer-content .footer-right .footer-right-bottom .icon:hover span {
     color: rgb(255, 255, 255);
}
.footer .footer-info {
     width: 100%;
     max-width: 1920px;
     flex: 1 1 0%;
     border-top: 1px solid rgba(255, 255, 255, 0.32);
     margin-top: 56px;
}
.footer .footer-info .inner {
     max-width: 1400px;
     margin: 0px auto;
     display: flex;
     justify-content: flex-start;
}
.footer .footer-info .inner p {
     font-size: 14px;
     font-weight: 400;
     color: rgba(255, 255, 255, 0.4);
     line-height: 68px;
}
.footer .footer-info .inner p + p {
     padding-left: 10px;
}
.footer .footer-info .inner p a {
     color: rgba(255, 255, 255, 0.4) !important;
}
.footer .footer-info .inner p a:hover {
     color: var(--brand-button-green) !important;
}
.footer .ant-menu-submenu .ant-menu-title-content {
     font-size: 16px;
}
 .footer .ant-menu-submenu-title {
     padding-left: 0px !important;
}
 .footer .ant-menu-submenu-title:active {
     background: transparent;
     color: rgb(255, 255, 255);
}
 .footer .ant-menu-light .ant-menu-submenu-title:hover {
     color: rgb(255, 255, 255);
}
.footer .ant-menu-submenu-arrow {
     color: rgb(141, 143, 143);
}
.footer .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
     color: rgb(255, 255, 255);
}
.footer .ant-menu-inline {
     border-right-color: transparent;
}
@media screen and (max-width: 993px) {
     .footer .footer-menu-cls {
         display: block;
    }
     .footer .footer-menu-cls .first-menu-name .ant-menu-submenu-title .ant-menu-title-content {
         opacity: 0.9;
    }
     .footer .line-cls {
         display: block;
    }
     .footer .footer-content {
         padding-top: 0px;
         padding-bottom: 10px;
    }
     .footer .footer-content .footer-left {
         display: none;
    }
     .footer .footer-content .footer-right {
         width: 100%;
    }
     .footer .footer-content .footer-right .footer-right-top {
         justify-content: center;
    }
     .footer .footer-content .footer-right .footer-right-top .footer-right-logo {
         width: 100%;
    }
     .footer .footer-content .footer-right .footer-right-top .footer-right-logo img,  .footer .footer-content .footer-right .footer-right-top .footer-right-logo p {
         display: none;
    }
     .footer .footer-content .footer-right .footer-right-top .footer-right-logo .email-box {
         justify-content: center;
    }
     .footer .footer-content .footer-right .footer-right-top .footer-right-logo .ant-form-item {
         width: 100%;
    }
     .footer .footer-content .footer-right .footer-right-top .footer-right-logo .ant-input {
         max-width: 100%;
    }
     .footer .footer-content .footer-right .footer-right-bottom {
         margin-top: 24px;
         margin-bottom: 24px;
    }
     .footer .footer-info {
         margin-top: 0px;
         height: auto;
         padding: 16px 0px;
    }
     .footer .footer-info .inner {
         flex-direction: column;
         justify-content: center;
         align-items: flex-start;
    }
     .footer .footer-info .inner p {
         width: 270px;
         max-width: 100%;
         height: auto;
         color: rgba(255, 255, 255, 0.4);
         line-height: 20px;
         text-align: left;
    }
     .footer .footer-info .inner p + p {
         margin-top: 2px;
         padding-left: 0px;
    }
}
.side-float {
     position: fixed;
     right: 16px;
     z-index: 9999;
     bottom: 34%;
}
.side-float .item-wrap {
     height: 56px;
     margin-top: 6px;
     display: block;
     transition: 0.2s;
     position: relative;
}
.side-float .item-wrap:last-child {
     margin-top: 16px;
}
.side-float .item-wrap:hover .item {
     background: var(--brand-button-green);
}
.side-float .item-wrap:hover .item .iconfont {
     color: rgb(255, 255, 255);
}
.side-float .item-wrap:hover .item + .detail {
     display: block;
     user-select: auto;
     pointer-events: all;
}
.side-float .item-wrap .item {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 56px;
     height: 56px;
     background: rgba(161, 164, 171, 0.2);
     border-radius: 8px;
     transition: 0.4s cubic-bezier(0.19, 1, 0.22, 1);
     cursor: pointer;
}
.side-float .item-wrap .item .iconfont {
     color: rgb(161, 164, 171);
}
.side-float .item-wrap .item .iconfont.tel {
     font-size: 22px;
}
.side-float .item-wrap .item .iconfont.top {
     font-size: 20px;
}
.side-float .item-wrap .detail {
     position: absolute;
     right: 56px;
     top: 0px;
     display: none;
     padding-right: 4px;
     user-select: none;
     pointer-events: none;
     transition: 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.side-float .item-wrap .detail .tel {
     line-height: 56px;
     background: var(--brand-button-green);
     border-radius: 8px;
     font-size: 16px;
     font-weight: 600;
     color: rgb(255, 255, 255);
     padding: 0px 24px;
     white-space: nowrap;
}
.side-float .item-wrap .detail img {
     height: 111px;
     width: 111px;
}
.side-float .Inquiry {
     cursor: pointer;
     position: fixed;
     bottom: 48px;
     right: 16px;
     width: 120px;
     height: 56px;
     color: rgb(255, 255, 255);
     background: var(--brand-button-green);
     border-radius: 28px;
     transition: 0.3s;
}
.side-float .Inquiry,  .side-float .Inquiry .item {
     display: flex;
     justify-content: center;
     align-items: center;
}
.side-float .Inquiry .item {
     position: relative;
}
.side-float .Inquiry .item .iconfont {
     font-size: 22px;
     color: rgb(255, 255, 255);
     opacity: 1;
     transition: 0.6s;
}
.side-float .Inquiry .item a {
     display: flex;
     flex-direction: row-reverse;
     align-items: center;
}
.side-float .Inquiry .item a::before {
     content: "문의하기";
     display: block;
     line-height: 22px;
     font-size: 14px;
     color: rgb(255, 255, 255);
     font-weight: 700;
     margin-left: 6px;
}
.side-float .Inquiry .item .smile {
     position: absolute;
     opacity: 0;
     left: 0px;
     transition: 0.6s;
}
.side-float .Inquiry.Inquiry:hover {
     box-shadow: rgba(0, 143, 69, 0.4) 0px 0px 10px;
}
.side-float .Inquiry.Inquiry:hover .iconfont {
     opacity: 0;
}
.side-float .Inquiry.Inquiry:hover .smile {
     opacity: 1;
}
.side-float .Inquirycn {
     cursor: pointer;
     position: fixed;
     bottom: 48px;
     right: 16px;
     height: 48px;
     padding: 0px 16px 0px 12px;
     color: rgb(255, 255, 255);
     background: rgb(237, 114, 9);
     border-radius: 8px;
     transition: 0.3s;
}
.side-float .Inquirycn,  .side-float .Inquirycn .item {
     display: flex;
     justify-content: center;
     align-items: center;
}
.side-float .Inquirycn .item {
     position: relative;
}
.side-float .Inquirycn .item .service-img {
     max-width: 32px;
}
.side-float .Inquirycn .item a {
     display: flex;
     align-items: center;
}
.side-float .Inquirycn .item a span {
     display: block;
     line-height: 22px;
     font-size: 18px;
     color: rgb(255, 255, 255);
     font-weight: 700;
     margin-left: 12px;
}
.side-float .Inquirycn.Inquirycn:hover {
     box-shadow: rgb(237, 114, 9) 0px 0px 10px;
}
.no-scroll {
     display: none !important;
}
@font-face {
     font-family: swiper-icons;
     src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
     font-weight: 400;
     font-style: normal;
}
:root {
     --swiper-theme-color: var(--brand-button-green);
}
.swiper-container {
     margin-left: auto;
     margin-right: auto;
     position: relative;
     overflow: hidden;
     list-style: none;
     padding: 0px;
     z-index: 1;
}
.swiper-wrapper {
     position: relative;
     width: 100%;
     height: 100%;
     z-index: 1;
     display: flex;
     transition-property: transform;
     box-sizing: content-box;
}
 .swiper-wrapper {
     transform: translateZ(0px);
}
.swiper-slide {
     flex-shrink: 0;
     width: 100%;
     height: 100%;
     position: relative;
     transition-property: transform;
}
:root {
     --swiper-navigation-size: 44px;
}
.swiper-button-next,  .swiper-button-prev {
     position: absolute;
     top: 50%;
     width: calc(var(--swiper-navigation-size)/44*27);
     height: var(--swiper-navigation-size);
     margin-top: calc(-1*var(--swiper-navigation-size)/2);
     z-index: 10;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--swiper-navigation-color,var(--swiper-theme-color));
}
.swiper-button-next::after,  .swiper-button-prev::after {
     font-family: swiper-icons;
     font-size: var(--swiper-navigation-size);
     letter-spacing: 0px;
     font-variant: normal;
     line-height: 1;
     text-transform: none !important;
}
.swiper-button-prev {
     left: 10px;
     right: auto;
}
.swiper-button-prev::after {
     content: "prev";
}
.swiper-button-next {
     right: 10px;
     left: auto;
}
.swiper-button-next::after {
     content: "next";
}
.swiper-pagination {
     position: absolute;
     text-align: center;
     transition: opacity 0.3s;
     transform: translateZ(0px);
     z-index: 10;
}
.swiper-pagination-bullet {
     width: 8px;
     height: 8px;
     display: inline-block;
     border-radius: 100%;
     background: rgb(0, 0, 0);
     opacity: 0.2;
}
.swiper-pagination-bullet-active {
     opacity: 1;
     background: var(--swiper-pagination-color,var(--swiper-theme-color));
}
@keyframes swiper-preloader-spin {
        100% {
         transform: rotate(1turn);
    }
}
.swiper-container .swiper-notification {
     position: absolute;
     left: 0px;
     top: 0px;
     pointer-events: none;
     opacity: 0;
     z-index: -1000;
}
.swiper-container-fade .swiper-slide {
     pointer-events: none;
     transition-property: opacity;
}
.swiper-container-fade .swiper-slide-active {
     pointer-events: auto;
}
.home-banner {
     position: fixed;
     width: 100%;
     z-index: 0;
     max-width: 1920px;
}
.home-banner .banner-list .banner-item {
     position: relative;
     overflow: hidden;
     display: block;
     height: 100vh;
}
.home-banner .banner-list .banner-item .banner-video {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0px;
     left: 0px;
     object-fit: cover;
}
.home-banner .banner-list .banner-item .video-text {
     position: absolute;
     top: 49%;
     left: 50%;
     transform: translate(-50%, -50%);
     text-align: center;
     width: 100%;
     z-index: 2;
     opacity: 0;
}
.home-banner .banner-list .banner-item .video-text .title {
     font-size: 50px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 84px;
}
.home-banner .banner-list .banner-item .video-text .video-btn {
     margin-top: 86px;
     background-color: transparent;
     color: rgb(255, 255, 255);
}
.home-banner .banner-list .banner-item .video-text .video-btn:hover {
     border-color: rgb(255, 255, 255);
}
.home-banner .banner-list .banner-item.swiper-slide-active .video-text {
     opacity: 1;
}
.home-banner .tip-icon {
     position: absolute;
     z-index: 99;
     bottom: 140px;
     left: 50%;
     transform: translate(-50%);
}
.home-banner .tip-icon .iconfont {
     color: rgb(255, 255, 255);
     font-size: 35px;
}
.home-banner .tip-icon .iconfont::before {
     display: inline-block;
     position: relative;
     animation: 1.5s linear 1s infinite normal both running fading;
}
@keyframes fading {
        0% {
         top: 0px;
    }
       100% {
         top: 30px;
         opacity: 0;
    }
}
@-webkit-keyframes fading {
        0% {
         top: 0px;
    }
       100% {
         top: 30px;
         opacity: 0;
    }
}
@-webkit-keyframes bannerPaginationProgress {
        0% {
         width: 0px;
    }
       100% {
         width: 100%;
    }
}
@keyframes bannerPaginationProgress {
        0% {
         width: 0px;
    }
       100% {
         width: 100%;
    }
}
@media screen and (max-width: 1400px) {
     .home-banner .banner-list .banner-item .video-text .title {
         font-size: 46px;
         line-height: 68px;
    }
}
@media screen and (max-width: 992px) {
     .home-banner .banner-list .banner-item .video-text .title {
         font-size: 34px;
         line-height: 48px;
    }
     .home-banner .banner-list .banner-item .video-text .video-btn {
         margin-top: 40px;
    }
}
@media screen and (max-width: 767px) {
     .home-banner .banner-list .banner-item .video-text .title {
         font-size: 20px;
         line-height: 28px;
    }
}
.home-title {
     text-align: center;
     padding: 64px 0px 32px;
}
.home-title .title {
     font-size: 34px;
     font-weight: 600;
     color: rgb(51, 51, 51);
     line-height: 56px;
}
@media screen and (max-width: 1200px) {
     .home-title .title {
         font-size: 32px;
         line-height: 42px;
    }
}
@media screen and (max-width: 1024px) {
     .home-title .title {
         font-size: 28px;
         line-height: 32px;
    }
}
@media screen and (max-width: 992px) {
     .home-title {
         padding: 48px 0px 28px;
    }
     .home-title .title {
         font-size: 24px;
         line-height: 32px;
    }
}
@media screen and (max-width: 767px) {
     .home-title {
         padding: 40px 0px 20px;
    }
     .home-title .title {
         font-size: 20px;
         line-height: 24px;
    }
}
.good-cases {
     padding-bottom: 72px;
     position: relative;
     background: rgb(248, 248, 248);
}
.good-cases .case-container .case-wrapper .case-slide a {
     display: block;
     position: relative;
     max-width: 1200px;
     height: 480px;
     overflow: hidden;
}
.good-cases .case-container .case-wrapper .case-slide .case-img {
     height: 100%;
     position: absolute;
     left: 50%;
     top: 0px;
     transform: translateX(-50%);
     min-width: 100%;
     object-fit: cover;
}
.good-cases .case-container .case-wrapper .case-slide .case-content {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     text-align: center;
     z-index: 1;
}
.good-cases .case-container .case-wrapper .case-slide .case-content .title {
     font-size: 34px;
     font-weight: 600;
     color: rgb(255, 255, 255);
     line-height: 50px;
}
.good-cases .case-container .case-wrapper .case-slide .case-content .line {
     width: 16px;
     height: 2px;
     background: rgb(255, 255, 255);
     border-radius: 1px;
     margin: 32px auto;
}
.good-cases .case-container .case-wrapper .case-slide .case-content .desc {
     font-size: 16px;
     font-weight: 500;
     color: rgb(255, 255, 255);
     line-height: 22px;
}
.good-cases .case-container .swiper-button-next .iconfont,  .good-cases .case-container .swiper-button-prev .iconfont {
     font-size: 24px;
     line-height: 24px;
     color: rgb(255, 255, 255);
     display: inline-block;
     width: 60px;
     height: 60px;
     background-color: rgba(0, 0, 0, 0.1);
     border-radius: 50%;
     padding: 18px;
}
.good-cases .case-container .swiper-button-next::after,  .good-cases .case-container .swiper-button-prev::after {
     content: "";
}
.good-cases .case-container .swiper-button-next:focus,  .good-cases .case-container .swiper-button-prev:focus {
     outline-color: transparent;
}
.good-cases .case-container .swiper-button-prev {
     left: 120px;
}
.good-cases .case-container .swiper-button-next {
     right: 120px;
}
.good-cases .swiper-pagination {
     bottom: 144px;
     left: 50%;
     transform: translateX(-50%);
}
.good-cases .swiper-pagination .swiper-pagination-bullet {
     margin: 0px 4px;
     background: rgb(216, 216, 216);
     opacity: 1;
}
.good-cases .swiper-pagination .swiper-pagination-bullet-active {
     background: var(--brand-button-green);
}
.good-cases .case-more {
     text-align: center;
     margin-top: 88px;
}
@media screen and (max-width: 1400px) {
     .good-cases .case-container .case-wrapper .case-slide a {
         height: 375px;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .title {
         font-size: 30px;
         line-height: 42px;
    }
}
@media screen and (max-width: 1200px) {
     .good-cases .case-container .case-wrapper .case-slide a {
         height: 333px;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .title {
         font-size: 24px;
         line-height: 42px;
    }
     .good-cases .case-container .swiper-button-prev {
         left: 80px;
    }
     .good-cases .case-container .swiper-button-next {
         right: 80px;
    }
}
@media screen and (max-width: 992px) {
     .good-cases {
         padding-bottom: 58px;
    }
     .good-cases .swiper-pagination {
         bottom: 120px;
    }
     .good-cases .case-container .case-wrapper .case-slide a {
         height: 274px;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .title {
         font-size: 20px;
         line-height: 34px;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .line {
         margin: 22px auto;
    }
     .good-cases .case-more {
         margin-top: 72px;
    }
}
@media screen and (max-width: 767px) {
     .good-cases {
         padding-bottom: 48px;
    }
     .good-cases .case-container .swiper-button-next .iconfont,  .good-cases .case-container .swiper-button-prev .iconfont {
         font-size: 16px;
         line-height: 16px;
         width: 36px;
         height: 36px;
         padding: 10px;
    }
     .good-cases .case-container .swiper-button-prev {
         left: 40px;
    }
     .good-cases .case-container .swiper-button-next {
         right: 40px;
    }
     .good-cases .case-container .case-wrapper .case-slide a {
         height: 248px;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content {
         max-width: 72%;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .title {
         font-size: 18px;
         line-height: 22px;
         text-overflow: ellipsis;
         overflow: hidden;
         white-space: nowrap;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .line {
         margin: 12px auto;
    }
     .good-cases .case-container .case-wrapper .case-slide .case-content .desc {
         font-size: 14px;
         line-height: 20px;
    }
     .good-cases .swiper-pagination {
         bottom: 98px;
    }
     .good-cases .swiper-pagination .swiper-pagination-bullet {
         width: 6px;
         height: 6px;
    }
     .good-cases .case-more {
         margin-top: 46px;
    }
}
.home-content {
     background: rgb(248, 248, 248);
}
.machine-content .machine-layout {
     display: flex;
}
.machine-content .machine-layout .machine-left {
     border-radius: 16px;
     position: relative;
     background: rgb(51, 63, 63);
     width: 692px;
     height: 692px;
}
.machine-content .machine-layout .machine-left img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}
.machine-content .machine-layout .machine-left .mask-layout {
     width: 100%;
     height: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
     position: absolute;
     z-index: 10;
     top: 0px;
     left: 0px;
     transition: transform 0.6s;
     cursor: pointer;
}
.machine-content .machine-layout .machine-left .mask-layout .title {
     margin-top: 96px;
     font-size: 32px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 44px;
}
.machine-content .machine-layout .machine-left .mask-layout .desc {
     padding: 0px 10px;
     margin-top: 16px;
     font-size: 16px;
     font-weight: 600;
     color: rgb(255, 255, 255);
     line-height: 24px;
     display: flex;
     align-items: flex-start;
     justify-content: center;
     text-align: center;
}
.machine-content .machine-layout .machine-left .mask-layout .desc .desc-left-icon {
     width: 20px;
     height: 20px;
     margin-right: 8px;
     background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAEJJREFUOE9jZKAyYKSyeQy0N/BtLsN/mKuFJyMshImjiyHzQfowXDhqIDxIRsMQnLJAwTCabEZzChUKR9qXh5Q6EgDx2X4VKsb48QAAAABJRU5ErkJggg==") no-repeat;
}
.machine-content .machine-layout .machine-left .mask-layout .desc .desc-right-icon {
     width: 20px;
     height: 20px;
     margin-left: 8px;
     background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAENJREFUOE9jZKAyYKSyeQy0N/BtLsN/4ckIi0B8kC+wiaGLg/gYLhw1kGE0DMH5ABYMo8kGHByjOYXy0pH25SGlbgQAkgZ+FXB3TWIAAAAASUVORK5CYII=") no-repeat;
}
.machine-content .machine-layout .machine-left .mask-layout .button {
     opacity: 0;
     width: 145px;
     height: 44px;
     background: var(--brand-button-green);
     border-radius: 23px;
     font-size: 14px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 44px;
     text-align: center;
     margin: 32px auto 0px;
     transition: 0.6s;
}
.machine-content .machine-layout .machine-left .mask-layout:hover {
     transform: translateY(-16px);
}
.machine-content .machine-layout .machine-left .mask-layout:hover .button {
     opacity: 1;
}
.machine-content .machine-layout .machine-right {
     flex: 1 1 0%;
     display: flex;
     flex-wrap: wrap;
}
.machine-content .machine-layout .machine-right .right-item {
     width: calc(50% - 24px);
     height: auto;
     margin-left: 24px;
     overflow: hidden;
     border-radius: 16px;
     position: relative;
}
.machine-content .machine-layout .machine-right .right-item img {
     width: 224px;
     object-fit: cover;
     display: block;
     margin: 24px auto 0px;
}
.machine-content .machine-layout .machine-right .right-item .title {
     width: 100%;
     color: rgb(51, 51, 51);
     text-align: center;
     margin-top: 18px;
     font-size: 20px;
     font-weight: 600;
     line-height: 28px;
}
.machine-content .machine-layout .machine-right .right-item .mask-content {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0px;
     left: 0px;
     opacity: 0;
     background: rgba(0, 0, 0, 0.8);
     transition: 0.6s;
}
.machine-content .machine-layout .machine-right .right-item .mask-layout {
     display: block;
     position: absolute;
     width: 100%;
     height: 100%;
     top: 20px;
     left: 0px;
     opacity: 0;
     transition: 0.6s;
}
.machine-content .machine-layout .machine-right .right-item .mask-layout .title {
     margin-top: 67px;
     font-size: 24px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 33px;
}
.machine-content .machine-layout .machine-right .right-item .mask-layout .desc {
     font-size: 16px;
     color: rgb(255, 255, 255);
     line-height: 30px;
     text-align: center;
     width: 100%;
     margin: 16px auto 0px;
}
.machine-content .machine-layout .machine-right .right-item .mask-layout .button {
     width: 145px;
     height: 44px;
     background: var(--brand-button-green);
     border-radius: 23px;
     font-size: 14px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 44px;
     text-align: center;
     margin: 24px auto 0px;
     cursor: pointer;
}
.machine-content .machine-layout .machine-right .right-item:hover .mask-content {
     opacity: 1;
}
.machine-content .machine-layout .machine-right .right-item:hover .mask-layout {
     opacity: 1;
     top: 0px;
}
.machine-content .machine-layout .machine-right .right-item:first-child {
     margin-bottom: 24px;
     background: rgb(240, 239, 242);
}
.machine-content .machine-layout .machine-right .right-item:nth-child(2) {
     margin-bottom: 24px;
     background: rgb(245, 241, 238);
}
.machine-content .machine-layout .machine-right .right-item:nth-child(3) {
     background: rgb(240, 246, 247);
}
.machine-content .machine-layout .machine-right .right-item:nth-child(4) {
     background: rgb(246, 243, 246);
}
@media screen and (max-width:1920) {
     .machine-content .machine-layout {
         display: flex;
    }
     .machine-content .machine-layout .machine-left {
         border-radius: 16px;
         position: relative;
         background: rgb(51, 63, 63);
         width: 692px;
         height: 692px;
    }
     .machine-content .machine-layout .machine-left img {
         width: 100%;
         height: 100%;
         object-fit: cover;
    }
     .machine-content .machine-layout .machine-left .mask-layout {
         width: 100%;
         height: 100%;
         display: flex;
         flex-direction: column;
         align-items: center;
         position: absolute;
         z-index: 10;
         top: 0px;
         left: 0px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .title {
         margin-top: 96px;
         font-size: 32px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 44px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc {
         padding: 0px 10px;
         margin-top: 16px;
         font-size: 16px;
         font-weight: 600;
         color: rgb(255, 255, 255);
         line-height: 24px;
         display: flex;
         align-items: flex-start;
         justify-content: center;
         text-align: center;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-left-icon {
         width: 20px;
         height: 20px;
         margin-right: 8px;
         background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAEJJREFUOE9jZKAyYKSyeQy0N/BtLsN/mKuFJyMshImjiyHzQfowXDhqIDxIRsMQnLJAwTCabEZzChUKR9qXh5Q6EgDx2X4VKsb48QAAAABJRU5ErkJggg==") no-repeat;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-right-icon {
         width: 20px;
         height: 20px;
         margin-left: 8px;
         background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAENJREFUOE9jZKAyYKSyeQy0N/BtLsN/4ckIi0B8kC+wiaGLg/gYLhw1kGE0DMH5ABYMo8kGHByjOYXy0pH25SGlbgQAkgZ+FXB3TWIAAAAASUVORK5CYII=") no-repeat;
    }
     .machine-content .machine-layout .machine-right {
         flex: 1 1 0%;
         display: flex;
         flex-wrap: wrap;
    }
     .machine-content .machine-layout .machine-right .right-item {
         width: 330px;
         height: 334px;
         margin-left: 24px;
         overflow: hidden;
         border-radius: 16px;
         position: relative;
    }
     .machine-content .machine-layout .machine-right .right-item img {
         width: 200px;
         height: 200px;
         object-fit: cover;
         display: block;
         margin: 16px auto 0px;
    }
     .machine-content .machine-layout .machine-right .right-item .title {
         font-size: 24px;
         color: rgb(51, 51, 51);
         line-height: 32px;
         text-align: center;
         margin-top: 6px;
         position: absolute;
         bottom: 40px;
         left: 50%;
         transform: translateX(-50%);
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout {
         display: block;
         position: absolute;
         width: 100%;
         height: 100%;
         left: 0px;
         transition: 0.6s;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .title {
         margin-top: 67px;
         font-size: 24px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 33px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .desc {
         font-size: 16px;
         color: rgb(255, 255, 255);
         line-height: 30px;
         text-align: center;
         width: 100%;
         margin: 16px auto 0px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .button {
         width: 145px;
         height: 44px;
         background: var(--brand-button-green);
         border-radius: 23px;
         font-size: 14px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 44px;
         text-align: center;
         margin: 24px auto 0px;
         cursor: pointer;
    }
     .machine-content .machine-layout .machine-right .right-item:hover .mask-layout {
         background: rgba(0, 0, 0, 0.85);
    }
     .machine-content .machine-layout .machine-right .right-item:first-child {
         margin-bottom: 24px;
         background: rgb(248, 247, 249);
    }
     .machine-content .machine-layout .machine-right .right-item:nth-child(2) {
         margin-bottom: 24px;
         background: rgb(245, 241, 238);
    }
     .machine-content .machine-layout .machine-right .right-item:nth-child(3) {
         background: rgb(240, 246, 247);
    }
     .machine-content .machine-layout .machine-right .right-item:nth-child(4) {
         background: rgb(246, 243, 246);
    }
}
@media screen and (max-width: 1500px) {
     .machine-content .machine-layout {
         display: flex;
    }
     .machine-content .machine-layout .machine-left {
         width: 50%;
         height: 582px;
         border-radius: 14px;
         position: relative;
         background: rgb(51, 63, 63);
    }
     .machine-content .machine-layout .machine-left img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         border-radius: 14px;
    }
     .machine-content .machine-layout .machine-left .mask-layout {
         width: 100%;
         height: 100%;
         display: flex;
         flex-direction: column;
         align-items: center;
         position: absolute;
         z-index: 10;
         top: 0px;
         left: 0px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .title {
         margin-top: 70px;
         font-size: 32px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 44px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc {
         padding: 0px 10px;
         margin-top: 16px;
         font-size: 16px;
         font-weight: 600;
         color: rgb(255, 255, 255);
         line-height: 24px;
         display: flex;
         align-items: flex-start;
         justify-content: center;
         text-align: center;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-left-icon {
         width: 20px;
         height: 20px;
         margin-right: 8px;
         background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAEJJREFUOE9jZKAyYKSyeQy0N/BtLsN/mKuFJyMshImjiyHzQfowXDhqIDxIRsMQnLJAwTCabEZzChUKR9qXh5Q6EgDx2X4VKsb48QAAAABJRU5ErkJggg==") no-repeat;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-right-icon {
         width: 20px;
         height: 20px;
         margin-left: 8px;
         background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAENJREFUOE9jZKAyYKSyeQy0N/BtLsN/4ckIi0B8kC+wiaGLg/gYLhw1kGE0DMH5ABYMo8kGHByjOYXy0pH25SGlbgQAkgZ+FXB3TWIAAAAASUVORK5CYII=") no-repeat;
    }
     .machine-content .machine-layout .machine-right {
         flex: 1 1 0%;
         display: flex;
         flex-wrap: wrap;
    }
     .machine-content .machine-layout .machine-right .right-item {
         width: calc(50% - 24px);
         margin-left: 24px;
         background: rgb(248, 247, 249);
         height: 280px;
         overflow: hidden;
         border-radius: 8px;
         position: relative;
    }
     .machine-content .machine-layout .machine-right .right-item img {
         width: 200px;
         height: 200px;
         object-fit: cover;
         display: block;
         margin: 16px auto 0px;
    }
     .machine-content .machine-layout .machine-right .right-item .title {
         font-size: 24px;
         color: rgb(51, 51, 51);
         line-height: 32px;
         text-align: center;
         margin-top: 6px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout {
         display: block;
         position: absolute;
         width: 100%;
         height: 100%;
         left: 0px;
         transition: 0.6s;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .title {
         margin-top: 67px;
         font-size: 24px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 33px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .desc {
         font-size: 16px;
         color: rgb(255, 255, 255);
         line-height: 30px;
         text-align: center;
         width: 100%;
         margin: 16px auto 0px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .button {
         width: 145px;
         height: 44px;
         background: var(--brand-button-green);
         border-radius: 23px;
         font-size: 14px;
         font-weight: 700;
         color: rgb(255, 255, 255);
         line-height: 44px;
         text-align: center;
         margin: 24px auto 0px;
         cursor: pointer;
    }
}
@media screen and (max-width: 1280px) {
     .machine-content .machine-layout .machine-right .right-item .title {
         font-size: 16px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .desc,  .machine-content .machine-layout .machine-right .right-item .mask-layout .title {
         font-size: 14px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .button {
         font-size: 12px;
    }
}
@media screen and (max-width: 768px) {
     .machine-content .machine-layout .machine-left {
         width: 45%;
         height: 346px;
         border-radius: 7px;
    }
     .machine-content .machine-layout .machine-left img {
         width: 100%;
         height: 100%;
    }
     .machine-content .machine-layout .machine-left .mask-layout .title {
         margin-top: 35px;
         font-size: 21px;
         line-height: 30px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc {
         margin-top: 8px;
         font-size: 12px;
         line-height: 18px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-left-icon {
         width: 18px;
         height: 15px;
         margin-left: 5px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-right-icon {
         width: 18px;
         height: 15px;
         margin-right: 5px;
    }
     .machine-content .machine-layout .machine-right {
         flex: 1 1 0%;
         display: flex;
         flex-wrap: wrap;
    }
     .machine-content .machine-layout .machine-right .right-item {
         width: calc(50% - 16px);
         margin-left: 16px;
         height: 167px;
         border-radius: 5px;
    }
     .machine-content .machine-layout .machine-right .right-item img {
         width: 100px;
         height: 100px;
         margin-top: 12px;
    }
     .machine-content .machine-layout .machine-right .right-item .title {
         font-size: 16px;
         line-height: 21px;
         margin-top: 4px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .title {
         margin-top: 34px;
         font-size: 16px;
         line-height: 21px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .desc {
         font-size: 12px;
         line-height: 20px;
         margin-top: 12px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .button {
         width: 100px;
         height: 31px;
         border-radius: 15px;
         font-size: 12px;
         line-height: 31px;
         margin-top: 6px;
    }
     .machine-content .machine-layout .machine-right .right-item:first-child,  .machine-content .machine-layout .machine-right .right-item:nth-child(2) {
         margin-bottom: 16px;
    }
}
@media screen and (max-width: 400px) {
     .machine-content .machine-layout {
         display: block;
    }
     .machine-content .machine-layout .machine-left {
         width: 100%;
         border-radius: 14px;
    }
     .machine-content .machine-layout .machine-left img {
         width: 100%;
         height: 311px;
    }
     .machine-content .machine-layout .machine-left .mask-layout {
         width: 100%;
         height: 100%;
    }
     .machine-content .machine-layout .machine-left .mask-layout .title {
         margin-top: 35px;
         font-size: 16px;
         line-height: 22px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc {
         padding: 0px 5px;
         margin-top: 16px;
         font-size: 14px;
         line-height: 14px;
         display: flex;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-left-icon {
         width: 18px;
         height: 18px;
         margin-right: 4px;
    }
     .machine-content .machine-layout .machine-left .mask-layout .desc .desc-right-icon {
         width: 18px;
         height: 18px;
         margin-left: 4px;
    }
     .machine-content .machine-layout .machine-right {
         margin-top: 12px;
         width: 100%;
    }
     .machine-content .machine-layout .machine-right .right-item {
         width: calc(50% - 6px);
         margin-right: 12px;
         height: 140px;
         border-radius: 8px;
    }
     .machine-content .machine-layout .machine-right .right-item img {
         width: 100px;
         height: 100px;
         margin-top: 8px;
    }
     .machine-content .machine-layout .machine-right .right-item .title {
         font-size: 14px;
         line-height: 16px;
         margin-top: 3px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .title {
         margin-top: 34px;
         font-size: 14px;
         line-height: 17px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .desc {
         font-size: 12px;
         line-height: 14px;
         margin-top: 8px;
    }
     .machine-content .machine-layout .machine-right .right-item .mask-layout .button {
         width: 73px;
         height: 22px;
         border-radius: 11px;
         font-size: 12px;
         line-height: 22px;
         margin-top: 12px;
    }
     .machine-content .machine-layout .machine-right .right-item:hover .mask-layout {
         background: rgba(0, 0, 0, 0.85);
    }
     .machine-content .machine-layout .machine-right .right-item:nth-child(n) {
         margin-left: 0px;
    }
     .machine-content .machine-layout .machine-right .right-item:nth-child(2n) {
         margin-right: 0px;
    }
}
.mobile-content .mobile-layout {
     width: 100%;
     height: 692px;
     position: relative;
     border-radius: 14px;
}
.mobile-content .mobile-layout img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-radius: 14px;
}
.mobile-content .mobile-layout .mask-layout {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0px;
     left: 0px;
     transition: transform 0.6s;
}
.mobile-content .mobile-layout .mask-layout .title {
     font-size: 32px;
     font-weight: 700;
     color: rgb(51, 51, 51);
     line-height: 44px;
     text-align: center;
     margin-top: 88px;
}
.mobile-content .mobile-layout .mask-layout .desc {
     font-size: 16px;
     font-weight: 600;
     color: rgb(51, 51, 51);
     line-height: 24px;
     margin-top: 16px;
     display: flex;
     align-items: flex-start;
     justify-content: center;
     text-align: center;
     padding: 0px 30px;
}
.mobile-content .mobile-layout .mask-layout .desc .desc-left-icon {
     width: 20px;
     height: 20px;
     margin-right: 8px;
     background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAEJJREFUOE9jZKAyYKSyeQy0N/BtLsN/mKuFJyMshImjiyHzQfowXDhqIDxIRsMQnLJAwTCabEZzChUKR9qXh5Q6EgDx2X4VKsb48QAAAABJRU5ErkJggg==") no-repeat;
}
.mobile-content .mobile-layout .mask-layout .desc .desc-right-icon {
     width: 20px;
     height: 20px;
     margin-left: 8px;
     background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAENJREFUOE9jZKAyYKSyeQy0N/BtLsN/4ckIi0B8kC+wiaGLg/gYLhw1kGE0DMH5ABYMo8kGHByjOYXy0pH25SGlbgQAkgZ+FXB3TWIAAAAASUVORK5CYII=") no-repeat;
}
.mobile-content .mobile-layout .mask-layout .button {
     opacity: 0;
     width: 145px;
     height: 44px;
     background: var(--brand-button-green);
     border-radius: 23px;
     font-size: 14px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 44px;
     text-align: center;
     margin: 32px auto 0px;
     transition: 0.6s;
     cursor: pointer;
}
.mobile-content .mobile-layout .mask-layout:hover {
     transform: translateY(-50px);
}
.mobile-content .mobile-layout .mask-layout:hover .button {
     opacity: 1;
}
@media screen and (max-width: 768px) {
     .mobile-content .mobile-layout {
         height: 460px;
         border-radius: 9px;
    }
     .mobile-content .mobile-layout .mask-layout .title {
         font-size: 21px;
         line-height: 31px;
         margin-top: 58px;
    }
     .mobile-content .mobile-layout .mask-layout .desc {
         font-size: 12px;
         line-height: 16px;
         margin-top: 12px;
         padding: 0px 10px;
    }
     .mobile-content .mobile-layout .mask-layout .desc .desc-left-icon {
         width: 30px;
         height: 14px;
         margin-right: 8px;
    }
     .mobile-content .mobile-layout .mask-layout .desc .desc-right-icon {
         width: 30px;
         height: 14px;
         margin-left: 8px;
    }
}
@media screen and (max-width: 400px) {
     .mobile-content .mobile-layout {
         height: 346px;
         border-radius: 14px;
    }
     .mobile-content .mobile-layout .mask-layout .title {
         font-size: 16px;
         line-height: 22px;
         margin-top: 44px;
    }
     .mobile-content .mobile-layout .mask-layout .desc {
         font-size: 14px;
         line-height: 15px;
         margin-top: 8px;
    }
     .mobile-content .mobile-layout .mask-layout .desc .desc-left-icon {
         width: 70px;
         height: 20px;
         margin-right: 4px;
    }
     .mobile-content .mobile-layout .mask-layout .desc .desc-right-icon {
         width: 70px;
         height: 20px;
         margin-left: 4px;
    }
}
.solution-content .solution-layout .sub-title {
     text-align: center;
     font-size: 18px;
     color: rgb(102, 102, 102);
     line-height: 24px;
}
.solution-content .solution-layout .operate-area {
     margin-top: 32px;
     display: flex;
     justify-content: center;
}
.solution-content .solution-layout .operate-area .operate-btn {
     width: 202px;
     height: 50px;
     line-height: 50px;
     text-align: center;
     border: 1px solid rgb(193, 193, 193);
     font-size: 16px;
     color: rgb(51, 51, 51);
     cursor: pointer;
}
.solution-content .solution-layout .operate-area :nth-child(2n-1) {
     border-radius: 25px 0px 0px 25px;
     border-right-width: medium;
     border-right-style: none;
     border-right-color: currentcolor;
}
.solution-content .solution-layout .operate-area :nth-child(2n) {
     border-radius: 0px 25px 25px 0px;
     border-left-width: medium;
     border-left-style: none;
     border-left-color: currentcolor;
}
.solution-content .solution-layout .operate-area .active-btn {
     color: rgb(255, 255, 255);
     background: rgb(51, 51, 51);
     border: 1px solid rgb(51, 51, 51);
}
.solution-content .solution-layout .solution-list {
     margin-top: 48px;
     margin-bottom: 48px;
     width: 100%;
     display: flex;
     flex-wrap: wrap;
}
.solution-content .solution-layout .solution-list .solution-item {
     position: relative;
     width: calc(33.3333% - 16px);
     margin-right: 24px;
     margin-bottom: 24px;
     height: 320px;
     overflow: hidden;
}
.solution-content .solution-layout .solution-list .solution-item img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}
.solution-content .solution-layout .solution-list .solution-item .first-layer-mask {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0px;
     left: 0px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 0px 30px;
     z-index: 2;
}
.solution-content .solution-layout .solution-list .solution-item .first-layer-mask .iconfont {
     width: 48px;
     height: 48px;
     display: block;
     color: rgb(255, 255, 255);
     font-size: 48px;
     line-height: 1;
}
.solution-content .solution-layout .solution-list .solution-item .first-layer-mask .title {
     text-align: center;
     margin-top: 16px;
     font-size: 24px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 32px;
}
.solution-content .solution-layout .solution-list .solution-item .second-layer-mask {
     opacity: 0;
     position: absolute;
     background: rgba(0, 0, 0, 0.8);
     top: 0px;
     transition: 0.6s;
     width: 100%;
     height: 100%;
     z-index: 5;
}
.solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 30%;
     left: 0px;
     transition: 0.6s;
}
.solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .title {
     text-align: center;
     font-size: 28px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 38px;
}
.solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .desc {
     font-size: 16px;
     color: rgb(255, 255, 255);
     line-height: 30px;
     margin-top: 16px;
     margin-bottom: 24px;
     text-align: center;
}
.solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .more-btn {
     width: 145px;
     height: 44px;
     background: var(--brand-button-green);
     border-radius: 23px;
     font-size: 14px;
     font-weight: 700;
     color: rgb(255, 255, 255);
     line-height: 44px;
     text-align: center;
     cursor: pointer;
     margin: 0px auto;
}
.solution-content .solution-layout .solution-list .solution-item .three-layer-mask {
     position: absolute;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.2);
     top: 0px;
     left: 0px;
     z-index: 1;
}
.solution-content .solution-layout .solution-list .solution-item:hover .first-layer-mask {
     display: none;
}
.solution-content .solution-layout .solution-list .solution-item:hover .second-layer-mask {
     opacity: 1;
}
.solution-content .solution-layout .solution-list .solution-item:hover .second-layer-mask .second-text-box {
     top: 25%;
}
.solution-content .solution-layout .solution-list .solution-item:hover .three-layer-mask {
     opacity: 0.8;
}
.solution-content .solution-layout .solution-list :nth-child(3n) {
     margin-right: 0px;
}
.solution-content .solution-layout .solution-more {
     margin: 40px auto 86px;
     width: 167px;
     height: 46px;
     border-radius: 23px;
     border: 1px solid var(--brand-button-green);
     font-size: 16px;
     font-weight: 600;
     color: var(--brand-button-green);
     line-height: 46px;
     text-align: center;
     cursor: pointer;
}
.solution-content .solution-layout .solution-more a {
     color: var(--brand-button-green);
}
@media screen and (max-width: 1500px) {
     .solution-content .solution-layout .solution-list {
         margin-top: 48px;
         width: 100%;
         display: flex;
         flex-wrap: wrap;
    }
     .solution-content .solution-layout .solution-list .solution-item {
         position: relative;
         width: calc(33.3333% - 16px);
    }
     .solution-content .solution-layout .solution-list :nth-child(3n) {
         margin-right: 0px;
    }
}
@media screen and (max-width: 1200px) {
     .solution-content .solution-layout .sub-title {
         font-size: 13px;
         line-height: 16px;
    }
     .solution-content .solution-layout .operate-area {
         margin-top: 21px;
    }
     .solution-content .solution-layout .operate-area .operate-btn {
         width: 140px;
         height: 33px;
         line-height: 33px;
         font-size: 12px;
    }
     .solution-content .solution-layout .operate-area :nth-child(2n-1) {
         border-radius: 16.5px 0px 0px 16.5px;
    }
     .solution-content .solution-layout .operate-area :nth-child(2n) {
         border-radius: 0px 16.5px 16.5px 0px;
    }
     .solution-content .solution-layout .solution-list {
         margin-top: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item {
         position: relative;
         width: calc(50% - 24px);
         margin-right: 24px;
         margin-bottom: 24px;
         height: 200px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask {
         padding: 0px 20px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask .iconfont {
         width: 32px;
         height: 32px;
         font-size: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask .title {
         margin-top: 12px;
         font-size: 16px;
         line-height: 24px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .title {
         font-size: 18px;
         line-height: 25px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .desc {
         font-size: 12px;
         line-height: 20px;
         margin-top: 12px;
         margin-bottom: 16px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .more-btn {
         width: 100px;
         height: 29px;
         border-radius: 14.5px;
         font-size: 12px;
         line-height: 29px;
    }
     .solution-content .solution-layout .solution-list :nth-child(2n) {
         margin-right: 0px;
    }
}
@media screen and (max-width: 768px) {
     .solution-content .solution-layout .sub-title {
         font-size: 13px;
         line-height: 16px;
    }
     .solution-content .solution-layout .operate-area {
         margin-top: 21px;
    }
     .solution-content .solution-layout .operate-area .operate-btn {
         width: 140px;
         height: 33px;
         line-height: 33px;
         font-size: 12px;
    }
     .solution-content .solution-layout .operate-area :nth-child(2n-1) {
         border-radius: 16.5px 0px 0px 16.5px;
    }
     .solution-content .solution-layout .operate-area :nth-child(2n) {
         border-radius: 0px 16.5px 16.5px 0px;
    }
     .solution-content .solution-layout .solution-list {
         margin-top: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item {
         position: relative;
         width: calc(33.3333% - 16px);
         margin-right: 24px;
         margin-bottom: 24px;
         height: 160px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask {
         padding: 0px 20px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask .iconfont {
         width: 32px;
         height: 32px;
         font-size: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item .first-layer-mask .title {
         margin-top: 12px;
         font-size: 16px;
         line-height: 24px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .title {
         font-size: 18px;
         line-height: 25px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .desc {
         font-size: 12px;
         line-height: 20px;
         margin-top: 12px;
         margin-bottom: 16px;
    }
     .solution-content .solution-layout .solution-list .solution-item .second-layer-mask .second-text-box .more-btn {
         width: 100px;
         height: 29px;
         border-radius: 14.5px;
         font-size: 12px;
         line-height: 29px;
    }
     .solution-content .solution-layout .solution-list :nth-child(3n) {
         margin-right: 0px;
    }
}
@media screen and (max-width: 650px) {
     .solution-content .solution-layout .solution-list {
         margin-top: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item {
         position: relative;
         width: calc(50% - 24px);
         margin-right: 24px;
         margin-bottom: 24px;
         height: 160px;
    }
     .solution-content .solution-layout .solution-list :nth-child(2n) {
         margin-right: 0px;
    }
}
@media screen and (max-width: 400px) {
     .solution-content .solution-layout .solution-list {
         margin-top: 32px;
    }
     .solution-content .solution-layout .solution-list .solution-item {
         position: relative;
         width: 100%;
         margin-right: 0px;
         margin-bottom: 12px;
         height: 240px;
    }
     .solution-content .solution-layout .solution-more {
         margin-top: 20px;
         margin-bottom: 43px;
         width: 160px;
         height: 36px;
         border-radius: 18px;
         font-size: 14px;
         line-height: 36px;
    }
}
.resource-content {
     background: rgb(241, 243, 247);
     padding-bottom: 112px;
}
.resource-content .resource-layout {
     width: 100%;
}
.resource-content .resource-layout .operate-area {
     display: flex;
     justify-content: center;
}
.resource-content .resource-layout .operate-area .opreate-item {
     background: rgb(255, 255, 255);
     font-size: 16px;
     height: 50px;
     color: rgb(51, 51, 51);
     line-height: 50px;
     cursor: pointer;
     padding: 0px 32px;
     border: 1px solid rgb(193, 193, 193);
}
.resource-content .resource-layout .operate-area .active-item {
     background: rgb(51, 51, 51);
     color: rgb(255, 255, 255);
     border-color: rgb(51, 51, 51);
}
.resource-content .resource-layout .operate-area :first-child {
     border-radius: 25px 0px 0px 25px;
}
.resource-content .resource-layout .operate-area :last-child {
     border-radius: 0px 25px 25px 0px;
}
.resource-content .resource-layout .operate-area :nth-child(2n) {
     border-left-width: medium;
     border-left-style: none;
     border-left-color: currentcolor;
     border-right-width: medium;
     border-right-style: none;
     border-right-color: currentcolor;
}
.resource-content .resource-layout .news-content {
     margin-top: 48px;
     display: flex;
}





















.resource-content .resource-layout .news-more {
     margin: 40px auto 0px;
     width: 160px;
     height: 46px;
     border-radius: 23px;
     border: 1px solid var(--brand-button-green);
     font-size: 16px;
     font-weight: 600;
     color: var(--brand-button-green);
     line-height: 46px;
     text-align: center;
     cursor: pointer;
}
@media screen and (max-width: 1500px) {
     .resource-content {
         background: rgb(241, 243, 247);
         padding-bottom: 112px;
    }
     .resource-content .resource-layout {
         width: 100%;
    }
     .resource-content .resource-layout .operate-area {
         display: flex;
         justify-content: center;
    }
     .resource-content .resource-layout .operate-area .opreate-item {
         background: rgb(255, 255, 255);
         font-size: 16px;
         height: 50px;
         color: rgb(51, 51, 51);
         line-height: 50px;
         cursor: pointer;
         padding: 0px 32px;
         border: 1px solid rgb(193, 193, 193);
    }
     .resource-content .resource-layout .operate-area .active-item {
         background: rgb(51, 51, 51);
         color: rgb(255, 255, 255);
         border-color: rgb(51, 51, 51);
    }
     .resource-content .resource-layout .operate-area :first-child {
         border-radius: 25px 0px 0px 25px;
    }
     .resource-content .resource-layout .operate-area :last-child {
         border-radius: 0px 25px 25px 0px;
    }
     .resource-content .resource-layout .operate-area :nth-child(2n) {
         border-left-width: medium;
         border-left-style: none;
         border-left-color: currentcolor;
         border-right-width: medium;
         border-right-style: none;
         border-right-color: currentcolor;
    }
     .resource-content .resource-layout .news-content {
         margin-top: 48px;
         display: flex;
    }



















     .resource-content .resource-layout .news-more {
         margin: 40px auto 0px;
         width: 160px;
         height: 46px;
         border-radius: 23px;
         border: 1px solid var(--brand-button-green);
         font-size: 16px;
         font-weight: 600;
         color: var(--brand-button-green);
         line-height: 46px;
         text-align: center;
         cursor: pointer;
    }
}
@media screen and (max-width: 768px) {
     .resource-content {
         padding-bottom: 75px;
    }
     .resource-content .resource-layout .operate-area .opreate-item {
         font-size: 12px;
         height: 33px;
         line-height: 33px;
         padding: 0px 21px;
    }
     .resource-content .resource-layout .operate-area :first-child {
         border-radius: 16.5px 0px 0px 16.5px;
    }
     .resource-content .resource-layout .operate-area :last-child {
         border-radius: 0px 16.5px 16.5px 0px;
    }
     .resource-content .resource-layout .news-content {
         margin-top: 32px;
    }

















}
@media screen and (max-width: 400px) {
     .resource-content {
         padding-bottom: 56px;
    }
     .resource-content .resource-layout .operate-area {
         display: flex;
         justify-content: center;
    }
     .resource-content .resource-layout .operate-area .opreate-item {
         font-size: 14px;
         height: 33px;
         line-height: 33px;
         padding: 0px 16px;
    }
     .resource-content .resource-layout .operate-area :first-child {
         border-radius: 16.5px 0px 0px 16.5px;
    }
     .resource-content .resource-layout .operate-area :last-child {
         border-radius: 0px 16.5px 16.5px 0px;
    }
     .resource-content .resource-layout .operate-area :nth-child(2n) {
         border-left-width: medium;
         border-left-style: none;
         border-left-color: currentcolor;
         border-right-width: medium;
         border-right-style: none;
         border-right-color: currentcolor;
    }
     .resource-content .resource-layout .news-content {
         margin-top: 24px;
         display: block;
    }


















     .resource-content .resource-layout .news-more {
         margin-top: 20px;
         width: 160px;
         height: 36px;
         border-radius: 18px;
         font-size: 14px;
         line-height: 36px;
    }
}
.home-content {
     background: rgb(255, 255, 255);
     position: relative;
}
.home-content .more-btn {
     color: var(--brand-button-green);
     border-color: var(--brand-button-green);
     font-weight: 700;
     background-color: transparent;
}
.home-banner-box {
     height: 100vh;
}

/* 原生页面：静态模板显示状态与移动导航。 */
[hidden] {
    display: none !important;
}
.mobile-header {
    display: none;
}
.home-banner-box {
    height: 100vh;
}
.case-container {
    touch-action: pan-y;
}
[data-link], .case-pagination .swiper-pagination-bullet {
    cursor: pointer;
}
.footer-sub-links {
    padding: 0 24px 12px;
    line-height: 24px;
}
.footer-sub-links .nav-item {
    margin: 0;
}
.footer-sub-links a {
    display: block;
    padding: 6px 0;
    white-space: normal;
    overflow-wrap: anywhere;
    color: #a0a0a0;
}
@media (max-width: 767px) {
    .desktop-header {
        display: none;
    }
    .mobile-header {
        display: block;
    }
    .home-banner-box {
        height: 56.25vw;
    }
}

/* 文档基础规则（与原首页的字体、行高和默认间距一致）。 */
html {
    font-family: "Open Sans" !important;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    --antd-wave-shadow-color: var(--brand-button-green);
    --scroll-bar: 0;
}
body {
    margin: 0;
    color: #333;
    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";
    font-variant: tabular-nums;
    line-height: 1.5715;
    background-color: #fff;
    font-feature-settings: "tnum", "tnum";
}
@media (max-width: 767px) {
    .side-float {
        display: none;
    }
}
/* 向下滚动隐藏导航，向上滚动恢复，与原首页一致。 */
.header.no-header {
    transform: translateY(-100%);
}
.header-mask {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.6);
    top: 0;
    left: 0;
    z-index: 90 !important;
    user-select: none;
}
.header.no-header {
    height: 0;
    opacity: 0;
    pointer-events: none;
    transform: none;
}

.qr-dialog {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: grid;
    place-items: center;
}
.qr-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}
.qr-panel {
    position: relative;
    padding: 24px;
    background: #fff;
}
.qr-panel img {
    width: 240px;
    max-width: 70vw;
}
.qr-close {
    position: absolute;
    top: 0;
    right: 8px;
    border: 0;
    background: transparent;
    font-size: 26px;
    cursor: pointer;
}


/* DoubleOne Robotics：保持原 Logo 槽位，按 PDF 原始比例显示。 */
.header .logo.cn img {
    width: 128px;
    object-fit: contain;
    object-position: left center;
}
.header-mobile .header-layout .logo.cn img {
    width: 82.2857px;
    object-fit: contain;
    object-position: left center;
}
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .cn img {
    width: 138px;
    object-fit: contain;
    object-position: left center;
}

/* ImageGen 横版 Logo：左图形、右文字，原图为透明 PNG。 */
.brand-logo {
    position: relative;
    display: inline-block;
    width: 192px;
    height: 64px;
    vertical-align: middle;
}
.header .logo.cn .brand-logo img,
.header-mobile .header-layout .logo.cn .brand-logo img,
.footer .footer-content .footer-right .footer-right-top .footer-right-logo .cn .brand-logo img {
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: contain;
    object-position: left center;
}
.header-mobile .brand-logo {
    width: 108px;
    height: 40px;
}
.footer .brand-logo {
    width: 138px;
    height: 58px;
    margin-right: 24px;
}


.header.transparent .brand-logo img,
.footer .brand-logo img {
    filter: url("#logo-on-dark");
}
.brand-logo {
    line-height: 0;
}
.brand-logo img {
    display: block;
}
.brand-logo .brand-logo-light {
    position: absolute;
    top: 0;
    left: 0;
    clip-path: inset(0 0 0 34%);
    display: none;
}
.header.transparent .brand-logo .brand-logo-light,
.footer .brand-logo .brand-logo-light {
    display: block;
    filter: brightness(0) invert(1);
}


/* 较窄桌面保留菜单所需空间。 */
@media (min-width: 768px) and (max-width: 1240px) {
    .header .brand-logo {
        width: 144px;
        height: 56px;
    }
}

/* 新闻区：上排两张、下排三张，兼顾阅读空间和整体高度。 */
.resource-content.news-cards {
    padding-bottom: 44px;
}
.resource-content.news-cards .home-title {
    height: auto;
    padding: 44px 0 26px;
}
.resource-content.news-cards .home-title .title {
    margin: 0;
}
.resource-content.news-cards .resource-layout .operate-area {
    margin: 0 auto 28px;
}
.resource-content.news-cards .resource-layout .news-content {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
    height: auto;
}
.resource-content.news-cards .resource-layout .news-content .news-list {
    display: contents;
}
.resource-content.news-cards .resource-layout .news-content .news-item {
    grid-column: span 2;
    display: flex;
    flex-direction: column;
    width: auto;
    min-width: 0;
    height: auto;
    margin: 0;
    overflow: hidden;
    border: 1px solid #e1e6ec;
    border-radius: 8px;
    background: #fff;
}
.resource-content.news-cards .resource-layout .news-content .news-item .img-box {
    width: 100%;
    height: auto;
    aspect-ratio: auto;
    height: 290px;
    overflow: hidden;
    background: #e9edf2;
}
.resource-content.news-cards .resource-layout .news-content .news-item .img-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.resource-content.news-cards .resource-layout .news-content > .news-item .img-box img {
    object-position: center 42%;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    height: auto;
    padding: 16px;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: auto;
    min-height: 3.1em;
    margin: 0 0 16px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.55;
    color: #252c34;
    word-break: keep-all;
    overflow-wrap: anywhere;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    margin: auto 0 0;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .label {
    height: auto;
    margin: 0;
    font-size: 11px;
    line-height: 1.5;
    color: var(--brand-button-green);
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .time {
    margin: 0;
    font-size: 11px;
    line-height: 1.5;
    color: #7a838d;
    white-space: nowrap;
}
.resource-content.news-cards .resource-layout .news-more {
    margin-top: 28px;
}
@media (max-width: 1200px) {
    .resource-content.news-cards .resource-layout .news-content {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 18px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .img-box {
        aspect-ratio: auto;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
        -webkit-line-clamp: 2;
        min-height: 3.1em;
    }
}
@media (max-width: 767px) {
    .resource-content.news-cards .home-title {
        padding: 32px 0 20px;
    }
    .resource-content.news-cards .resource-layout .operate-area {
        margin-bottom: 20px;
    }
    .resource-content.news-cards .resource-layout .news-content {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content {
        padding: 12px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
        margin-bottom: 12px;
        font-size: 14px;
    }
}
.resource-content.news-cards .resource-layout .news-content > .news-item,
.resource-content.news-cards .resource-layout .news-content .news-list > .news-item:first-child {
    grid-column: span 3;
}
.resource-content.news-cards .resource-layout .news-content > .news-item .img-box img {
    object-position: center 48%;
}
@media (max-width: 767px) {
    .resource-content.news-cards .resource-layout .news-content .news-item,
    .resource-content.news-cards .resource-layout .news-content > .news-item,
    .resource-content.news-cards .resource-layout .news-content .news-list > .news-item:first-child {
        grid-column: span 1;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .img-box {
        height: 132px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
        -webkit-line-clamp: 3;
        min-height: 4.65em;
    }
}

/* 新闻卡片内容区：参考原版的粗体标题、灰底分类与日期。 */
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content {
    padding: 26px;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
    -webkit-line-clamp: 2;
    min-height: 3.2em;
    margin: 0 0 24px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.6;
    color: #333;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time {
    gap: 14px;
    margin: auto 0 0;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .label {
    padding: 2px 9px;
    background: #c1c1c1;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
}
.resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .time {
    color: #333;
    font-size: 14px;
    line-height: 1.5;
}
@media (max-width: 767px) {
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content {
        padding: 14px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .title {
        -webkit-line-clamp: 3;
        min-height: 4.8em;
        margin-bottom: 16px;
        font-size: 15px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time {
        gap: 8px;
    }
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .label,
    .resource-content.news-cards .resource-layout .news-content .news-item .bottom-content .label-time .time {
        font-size: 11px;
    }
}

/* 新闻轮播：一排卡片，左右按钮、圆点及触屏拖动。 */
.resource-content.news-cards .resource-layout .news-content {
    display: block;
}
.news-carousel-viewport {
    overflow: hidden;
    touch-action: pan-y;
}
.resource-content.news-cards .resource-layout .news-content .news-list {
    display: flex;
    gap: 20px;
    transition: transform 320ms ease;
}
.resource-content.news-cards .resource-layout .news-content .news-list .news-item {
    flex: 0 0 auto;
    grid-column: auto;
}
.news-carousel-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin-top: 24px;
}
.news-carousel-controls > button {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid #cbd4dd;
    border-radius: 50%;
    background: transparent;
    color: #536473;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}
.news-carousel-controls > button:hover {
    border-color: var(--brand-button-green);
    color: var(--brand-button-green);
}
.news-dots {
    display: flex;
    gap: 10px;
}
.news-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #c6cfd7;
    cursor: pointer;
}
.news-dots button[aria-current="true"] {
    background: var(--brand-button-green);
}
.news-carousel-controls button:focus-visible {
    outline: 2px solid var(--brand-button-green);
    outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
    .resource-content.news-cards .resource-layout .news-content .news-list {
        transition: none;
    }
}

/* 箭头、圆点和圆形按钮使用同一条水平中心线。 */
.news-carousel-controls > button {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    margin: 0;
    line-height: 0;
}
.news-carousel-controls > button svg {
    display: block;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.news-dots {
    display: flex;
    align-items: center;
    height: 42px;
}
.news-dots button {
    display: block;
    flex: 0 0 8px;
    margin: 0;
    line-height: 0;
}

/* 韩国本社 / 中国工厂：恢复横幅样式，更换为简洁几何背景。 */
.company-locations {
    position: relative;
    padding: 8px 0 64px;
    background: #f0f3f7;
}
.company-locations-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.location-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    padding: 30px 32px;
    border-radius: 14px;
    background-color: #536879;
    background-size: cover;
    background-position: center;
    color: #fff;
}
.location-korea {
    background-image: linear-gradient(90deg, rgba(22, 39, 54, 0.82), rgba(22, 39, 54, 0.42) 62%, rgba(22, 39, 54, 0.08)), url("../imgs/headquarters-office-simple-optimized.webp");
}
.location-china {
    background-image: linear-gradient(90deg, rgba(22, 39, 54, 0.82), rgba(22, 39, 54, 0.42) 62%, rgba(22, 39, 54, 0.08)), url("../imgs/china-factory-simple-optimized.webp");
}



.location-card-content {
    position: relative;
    z-index: 1;
}
.location-eyebrow {
    margin: 0 0 20px;
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
}
.location-details {
    display: grid;
    gap: 8px;
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
}
.location-details > div {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 12px;
}
.location-details dt {
    color: #fff;
    font-weight: 600;
}
.location-details dd {
    margin: 0;
    color: #f1f5f8;
    word-break: keep-all;
    overflow-wrap: anywhere;
}
@media (max-width: 767px) {
    .company-locations {
        padding-bottom: 40px;
    }
    .company-locations-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
    .location-card {
        padding: 24px;
    }
    .location-eyebrow {
        font-size: 20px;
    }
}


/* 产品详情与悬浮咨询按钮：品牌绿色。 */
:root {
    --brand-button-green: #008f45;
    --brand-green-hover: #16a05a;
    --brand-green-active: #006f35;
    --brand-green-soft: #e0f1e7;
}
.machine-content .machine-layout .machine-left .mask-layout .button,
.machine-content .machine-layout .machine-right .right-item .mask-layout .button,
.mobile-content .mobile-layout .mask-layout .button,
.side-float .Inquiry {
    background: var(--brand-button-green);
}

/* 下拉栏目装饰线原为蓝色位图，改用品牌色绘制。 */
.header .second-menu .line .menu-rule {
    display: inline-block;
    vertical-align: middle;
    width: 126px;
    height: 3px;
    background:
        linear-gradient(var(--brand-button-green), var(--brand-button-green)) left center / 41px 3px no-repeat,
        linear-gradient(90deg, rgba(0, 143, 69, 0.35), rgba(0, 143, 69, 0)) left center / 126px 1px no-repeat;
}

/* 产品列表页：大分类图标行当前（父级）只做变色高亮，不填充；隐藏导航行标题变色。 */
.product-type .typeSwiper .active-item .product-type-image .iconfont,
.product-type .typeSwiper .active-item .product-type-title {
    color: var(--brand-button-green) !important;
}
.product-nav-list .active-nav .product-type-title {
    color: var(--brand-button-green) !important;
    font-weight: 700;
}

/* Contact tooltip: keep mailbox on one line and align with the button. */
.side-float .item-wrap[title="이메일"] .detail,.side-float .item-wrap[title="전화"] .detail{width:max-content;max-width:none;white-space:nowrap;top:0;bottom:auto;}
.side-float .item-wrap[title="이메일"] .detail>a,.side-float .item-wrap[title="전화"] .detail>a{display:flex;align-items:center;min-height:56px;padding:0 18px;border-radius:8px;background:#fff;box-shadow:0 3px 14px #0001;color:#333;font-size:15px;line-height:1.5;white-space:nowrap;word-break:normal;overflow-wrap:normal;}
.side-float .item-wrap[title="이메일"] .item>span{color:#a1a4ab;}.side-float .item-wrap[title="이메일"]:hover .item>span,.side-float .item-wrap[title="이메일"]:focus-within .item>span{color:#fff;}
