/* 主要样式文件 */
/* 重置样式 */
body,html{height:100%;width:100%}
input::-ms-clear,input::-ms-reveal{display:none}
*,:after,:before{box-sizing:border-box}
html{font-family:sans-serif;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)}
body{margin:0}
[tabindex="-1"]:focus{outline:none}
hr{box-sizing:content-box;height:0;overflow:visible}
h1,h2,h3,h4,h5,h6{font-weight:500;margin-bottom:.5em;margin-top:0}
p{margin-bottom:1em;margin-top:0}
/* 基础样式 */
body{margin:0;padding:0!important}
a{text-decoration:none}
:root{--primary-color:#08c18a}
.details p,h2{line-height:1.6}
.images img{border-radius:8px;display:block;height:auto;margin:10px 0;max-width:100%}
#nuxt-devtools-container{display:none}
/* 全局图片响应式 */
img {
max-width: 100%;
height: auto;
display: block;
}
/* 头部导航样式 */
.my-agent-layout-header{background-color:#fff;box-shadow:0 1px 4px #0000001a;height:86px;left:0;min-width:1200px;position:fixed;top:0;width:100%;z-index:1000}
.my-agent-layout-header .my-agent-layout-header-box{align-items:center;display:flex;height:100%;justify-content:space-between;margin:0 auto;padding:0 34px}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left{display:flex}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .logo-area{align-items:center;display:flex;margin-right:60px}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .logo-area .logo-image{height:auto;width:150px}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content{color:#333;display:flex;flex-grow:1;justify-content:center}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list{display:flex;list-style:none;margin:0;padding:0}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item{color:#333;cursor:pointer;font-size:16px;height:60px;line-height:60px;padding:0 20px;position:relative}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item a{color:#4b5563}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item:hover,.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item:hover a{color:var(--primary-color)}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item.active{color:var(--primary-color);font-weight:500}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item.active a{color:var(--primary-color)}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item.active:after{background-color:var(--primary-color);bottom:0;content:"";height:2px;left:20px;position:absolute;right:20px}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-right{align-items:center;display:flex}
.my-agent-layout-header.transparent-header{background:transparent!important;box-shadow:none!important;transition:background .3s,box-shadow .3s}
/* 详情页面样式 */
.agent-detail-page{min-width:1480px;width:100%}
.agent-detail-page .agent-detail{margin:0 auto}
/* 用户统计区域 */
.agent-detail-page .agent-detail .agent-use-user{align-items:center;background:#fff;display:flex;height:113px;width:100%}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-left{align-items:center;box-sizing:border-box;display:flex;flex:0 0 340px;justify-content:center;min-width:340px;width:340px}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-left span{color:#000;font-size:24px;font-weight:500;line-height:50px}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right{flex:1;min-width:0;position:relative}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right:after{background:linear-gradient(90deg,#fff,#fff0 10% 90%,#fff);content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list{display:flex}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item{align-items:center;display:flex;margin-right:48px}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .img{border-radius:50%;height:51px;margin-right:12px;overflow:hidden;width:51px}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .info .user{color:#3d3d3d;font-size:16px;font-weight:500;line-height:24px}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .info .text{color:#3d3d3dcc;font-size:14px;font-weight:400;line-height:24px}
/* Banner样式 */
.agent-banner{background:url(bg.Bzm9NpI_.webp) no-repeat;background-size:cover;height:650px}
.agent-banner .agent-banner-content{padding-top:86px}
.agent-banner .agent-banner-content .agent-banner-mian{display:flex;justify-content:center;margin:63px auto 0}
.agent-banner .agent-banner-content .agent-banner-mian .main-left{margin-right:80px}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-title{background:linear-gradient(54.16990086deg,#daebff,#fefaff 50%,#bef8ff);border:1px solid #fff;border-radius:32px;height:43px;line-height:43px;margin-bottom:18px;padding:0 12px;text-align:center;width:-moz-max-content;width:max-content}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-title .agent-banner-tag{background:linear-gradient(54.17deg,#1c82ff,#01d6a8);background-clip:text;-webkit-background-clip:text;border-radius:4px;color:transparent;font-size:20px;font-weight:500;letter-spacing:1px;-webkit-text-fill-color:transparent;text-align:center}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-headline{color:#222;font-size:45px;font-weight:700;margin-bottom:16px}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-desc{color:#333333e6;display:-webkit-box;font-size:16px;height:52px;line-height:26px;margin-bottom:24px;overflow:hidden;width:450px;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry{color:#333;font-size:15px;margin-bottom:66px}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry .agent-banner-industry-title{color:#000;font-size:16px}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry .agent-banner-industry-tags{align-items:center;display:flex}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry .agent-banner-industry-tags .industry-tag{align-items:center;border-radius:16px;color:#000;display:flex;font-size:14px;margin-right:16px;margin-top:12px;vertical-align:middle}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-btn{align-items:center;background:linear-gradient(146deg,#00a8df,#00c995);border:none;border-radius:24px;box-shadow:0 2px 8px #1abc9c14;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:500;padding:12px 40px;transition:background .2s}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .min-agent-banner-btn{font-size:14px;padding:10px 32px}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs{position:relative}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_1{height:388px;width:662px}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_1 img{height:100%;width:100%}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_2{height:63px;left:-24px;position:absolute;top:97px;width:150px}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_2 img{height:100%;width:100%}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_3{bottom:-59px;height:192px;left:203px;position:absolute;width:150px}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_3 img{height:100%;width:100%}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_4{height:206px;position:absolute;right:-124px;top:128px;width:325px}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_4 img{height:100%;width:100%}
/* 无限滚动组件 */
.infinite-scroll-box{height:100%;margin:auto;overflow:hidden;position:relative;width:100%}
.infinite-scroll-box .scroll-content{align-items:center;display:flex;width:-moz-max-content;width:max-content}
.infinite-scroll-box .scroll-content:hover{animation-play-state:paused}
/* 核心功能区域 - 支持10个功能的5x2布局 */
.core-fn-section{background:linear-gradient(180deg,#e9f1f8,#edf8f5);box-sizing:border-box;min-height:695px;padding:76px 0 80px;width:100%}
.core-fn-title{color:#222;display:inline-block;font-size:44px;font-weight:700;left:50%;letter-spacing:2px;margin-bottom:48px;position:relative;text-align:center;transform:translate(-50%);z-index:1}
.core-fn-title .core-fn-title-highlight{background:#d0fc39;border-radius:8px;bottom:0;height:18px;left:50%;opacity:.5;pointer-events:none;position:absolute;transform:translate(-50%);width:180px;z-index:-1}
.core-fn-list{display:grid;gap:24px;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,1fr);margin:0 auto;max-width:1200px}
.core-fn-item{align-items:center;background:#f6f9ff66;border:1px solid #fff;border-radius:12px;box-shadow:0 0 0 1px #f2f6fa,0 8px 32px #0000000f;display:flex;min-height:170px;height:auto;justify-content:center;transition:box-shadow .2s;width:100%}
.core-fn-item:hover{box-shadow:0 4px 24px #1c82ff1f}
.core-fn-item .core-fn-item-content{align-items:center;background:#fff;border-radius:12px;display:flex;min-height:150px;height:auto;padding:20px 28px;width:calc(100% - 20px)}
.core-fn-item .core-fn-item-content .core-fn-item-info{flex:1}
.core-fn-item .core-fn-item-content .core-fn-item-info .core-fn-item-title{color:#333;font-size:20px;font-weight:600;line-height:28px;margin-bottom:12px}
.core-fn-item .core-fn-item-content .core-fn-item-info .core-fn-item-desc{color:#636c78;font-size:13px;font-weight:400;line-height:20px}
.core-fn-item .core-fn-item-content .core-fn-item-icon{height:70px;margin-left:24px;-o-object-fit:contain;object-fit:contain;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:70px;flex-shrink:0}
/* 产品选择区域 */
.product-selection-section{background:#fff;box-sizing:border-box;height:678px;padding:76px 0 0;width:100%}
.product-selection-title{color:#222;display:inline-block;font-size:44px;font-weight:700;left:50%;letter-spacing:2px;margin-bottom:63px;position:relative;text-align:center;transform:translate(-50%);z-index:1}
.product-selection-title .product-selection-title-highlight{background:#d0fc39;border-radius:8px;bottom:0;height:14px;left:50%;opacity:.5;pointer-events:none;position:absolute;transform:translate(-50%);width:100%;z-index:-1}
.product-selection-list{display:flex;gap:32px;justify-content:center;margin:0 auto;max-width:1200px}
.product-selection-item{align-items:center;background:#fff;border-radius:16px;box-shadow:0 0 0 1px #f2f6fa,0 8px 32px #00000014;display:flex;flex:1;flex-direction:column;height:393px;padding:45px 30px 0;transition:box-shadow .2s;width:277px}
.product-selection-item:hover{box-shadow:0 4px 24px #1c82ff1f}
.product-selection-item .product-selection-icon{height:116px;margin-bottom:34px;-o-object-fit:contain;object-fit:contain;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:116px}
.product-selection-item .product-selection-item-title{color:#333;font-size:24px;font-weight:500;line-height:26px;margin-bottom:20px;text-align:center}
.product-selection-item .product-selection-item-desc{color:#636c78;font-size:16px;font-weight:400;line-height:26px;text-align:center}
/* 优势展示区域 */
.agent-strength-section{background:url(strength_bg.jl2GB__S.webp) no-repeat;background-size:cover;box-sizing:border-box;height:554px;padding:48px 0 0;width:100%}
.agent-strength-content{align-items:center;display:flex;justify-content:center;width:100%}
.agent-strength-left{flex:1.2;max-width:520px;padding-right:32px}
.agent-strength-left .agent-strength-title{color:#333;display:inline-block;font-size:44px;font-weight:700;letter-spacing:2px;margin-bottom:22px;position:relative}
.agent-strength-left .agent-strength-title .agent-strength-title-highlight{background:#d0fc39;border-radius:8px;bottom:4px;height:14px;left:0;opacity:.5;pointer-events:none;position:absolute;width:140px;z-index:-1}
.agent-strength-left .agent-strength-desc{color:#444;font-size:16px;line-height:1.7;margin-bottom:32px;max-width:520px}
.agent-strength-left .agent-strength-data{display:flex;gap:48px}
.agent-strength-left .agent-strength-data .data-item{text-align:left}
.agent-strength-left .agent-strength-data .data-item .data-value{color:#01d6a8;font-size:28px;font-weight:600;margin-bottom:6px}
.agent-strength-left .agent-strength-data .data-item .data-label{color:#222;font-size:15px;opacity:.85}
.agent-strength-right{margin-left:58px}
.agent-strength-right img{height:438px;width:438px}
/* 解决方案区域 */
.agent-solution-section{background:linear-gradient(120deg,#eaf8ff,#f7fcfa);box-sizing:border-box;padding:96px 0 80px;width:100%}
.agent-solution-title{color:#000;display:inline-block;font-size:44px;font-weight:600;left:50%;letter-spacing:2px;margin-bottom:80px;position:relative;text-align:center;transform:translate(-50%);z-index:1}
.agent-solution-title .agent-solution-title-highlight{background:#d0fc39;border-radius:8px;bottom:0;height:14px;left:50%;opacity:.5;pointer-events:none;position:absolute;transform:translate(-50%);width:320px;z-index:-1}
.agent-solution-tabs{background:#fff;border-radius:496px;display:flex;gap:18px;height:76px;justify-content:center;margin:auto;width:1200px}
.agent-solution-tabs .agent-solution-tab{border-radius:496px;color:#3d3d3d;cursor:pointer;flex:1;font-size:20px;font-weight:400;line-height:76px;text-align:center;transition:background .2s,color .2s}
.agent-solution-tabs .agent-solution-tab.active{background:#08c18a;box-shadow:0 4px 16px #1c82ff1f;color:#fff}
.agent-solution-content{align-items:center;display:flex;justify-content:center;margin:71px auto 0;min-height:320px;width:1200px}
.agent-solution-panel{align-items:center;background:none;display:flex;justify-content:space-between;width:100%}
.agent-solution-panel-left{flex:1.1;padding-right:32px}
.agent-solution-panel-left .agent-solution-panel-title{color:#222;font-size:24px;font-weight:700;margin-bottom:18px}
.agent-solution-panel-left .agent-solution-panel-desc{color:#444;font-size:16px;line-height:1.7;margin-bottom:32px;max-width:340px}
.agent-solution-panel-left .agent-solution-btn{align-items:center;background:linear-gradient(90deg,#1c82ff,#01d6a8);border:none;border-radius:24px;box-shadow:0 2px 8px #1c82ff14;color:#fff;cursor:pointer;display:flex;font-size:24px;font-weight:500;height:52px;justify-content:center;transition:background .2s;width:176px}
.agent-solution-panel-left .agent-solution-btn:hover{background:linear-gradient(90deg,#01d6a8,#1c82ff)}
.agent-solution-panel-right{align-items:center;display:flex;flex:1;justify-content:center}
.agent-solution-panel-right .agent-solution-img-placeholder{height:506px;width:776px}
/* 用户评价区域 */
.agent-comment{background:url(comment_bg.DYjwVrhc.webp) no-repeat 50%;background-size:cover;height:791px;padding:0;position:relative;width:100%}
.comment-title{color:#222;font-size:36px;font-weight:700;letter-spacing:2px;margin-bottom:80px;padding-top:94px;position:relative;text-align:center;z-index:1}
.comment-title .highlight{background:#d0fc39;border-radius:8px;bottom:0;height:14px;left:50%;opacity:.5;pointer-events:none;position:absolute;transform:translate(-50%);width:470px;z-index:-1}
.comment-layout{align-items:flex-start;display:flex;gap:30px;justify-content:center;margin:0 auto}
.comment-card-main{background:url(img_1.DrkzCsaz.webp) no-repeat 50%;border-radius:16px;box-sizing:border-box;display:flex;flex-direction:column;height:446px;justify-content:space-between;padding:38px 38px 30px;width:585px}
.comment-card-main .comment-main-title{color:#222;font-size:28px;font-weight:700;line-height:1.5;margin-bottom:18px}
.comment-card-main .comment-main-desc{color:#000c;font-size:18px;line-height:1.7;margin-bottom:32px}
.comment-card-side-group{display:flex;flex-direction:column;gap:24px;width:586px}
.comment-card-side-group .comment-card-side{background:#fff;border:1px solid #f2f2f2;border-radius:16px;box-shadow:0 4px 24px #1c82ff0f;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:28px}
.comment-card-side-group .comment-side-desc{color:#333;display:-webkit-box;font-size:18px;line-height:1.3;margin-bottom:27px;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
.comment-user{align-items:center;display:flex;justify-content:end;margin-top:auto}
.comment-user .user-avatar{background:#eee;border-radius:50%;height:56px;margin-left:16px;-o-object-fit:cover;object-fit:cover;width:56px}
.comment-user .user-name{color:#86909c;font-size:14px}
/* 试用区域 */
.trial-section{background:url(trial_bg.CmLz1B1h.webp) no-repeat 50%;background-size:cover;height:202px;width:100%}
.trial-content{align-items:center;display:flex;height:100%;justify-content:space-between;margin:auto;width:1200px}
.trial-title{color:#000;flex:1;font-size:38px;font-weight:500;margin-left:48px}
.trial-btn{background:linear-gradient(149deg,#00abf7,#00d492);border:none;border-radius:4px;box-shadow:none;color:#fff;cursor:pointer;font-size:22px;font-weight:600;height:54px;margin-left:0;margin-right:7px;width:144px}
.trial-btn:hover{background:linear-gradient(90deg,#00c2ff,#19e2b4)}
/* 页脚样式 */
.fl-footer{background:#0b272e;padding:80px 0 20px}
.fl-footer .footer-container{align-items:flex-start;display:flex;justify-content:space-between;margin:0 auto;max-width:1200px}
.fl-footer .footer-container .footer-section{flex:1}
.fl-footer .footer-container .footer-section.logo-section{align-items:center;display:flex;flex-direction:column;gap:10px}
.fl-footer .footer-container .footer-section .logo-area{align-items:center;display:flex}
.fl-footer .footer-container .footer-section .logo-area .logo-image{height:auto;width:150px}
.fl-footer .footer-container .footer-section .section-title{color:#fff;font-size:18px;font-weight:700;margin-bottom:40px}
.fl-footer .footer-container .footer-section .section-list{list-style:none;padding:0}
.fl-footer .footer-container .footer-section .section-list li{cursor:pointer;font-size:14px;margin-bottom:30px}
.fl-footer .footer-container .footer-section .section-list li a{align-items:center;color:#7f888b;display:flex}
.fl-footer .copyright{align-items:center;border-top:1px solid #113a45;color:#86909c;display:flex;font-size:14px;font-weight:400;justify-content:center;line-height:22px;padding-top:20px;text-align:center}
.fl-footer .copyright a{color:#86909c}
.fl-footer .copyright a:hover{color:#4e5969}
.fl-footer .copyright img{width:18px}
/* 动画效果 */
.aos-animate{opacity:0}
@keyframes fadeLeft{0%{opacity:0;transform:translate(-30%)}to{opacity:1;transform:translate(0)}}
@keyframes fadeRight{0%{opacity:0;transform:translate(30%)}to{opacity:1;transform:translate(0)}}
@keyframes fadeUp{0%{opacity:0;transform:translateY(30%)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeDown{0%{opacity:0;transform:translateY(-30%)}to{opacity:1;transform:translateY(0)}}
@keyframes zoomInOut{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1;transform:scale3d(1.1,1.1,1.1)}to{opacity:1;transform:scaleX(1)}}
@keyframes zoomIn{0%{opacity:0;transform:scale3d(.6,.6,.6)}to{opacity:1;transform:scaleX(1)}}
@keyframes zoomOut{0%{opacity:0;transform:scale(1.5)}to{opacity:1;transform:scale(1)}}
.aos-active.aos-fade-left{animation:fadeLeft forwards}
.aos-active.aos-fade-right{animation:fadeRight forwards}
.aos-active.aos-fade-up{animation:fadeUp forwards}
.aos-active.aos-fade-down{animation:fadeDown forwards}
.aos-active.aos-zoom-in{animation:zoomIn forwards}
.aos-active.aos-zoom-out{animation:zoomOut forwards}
.aos-active.aos-zoom-in-out{animation:zoomInOut forwards}
/* 按钮样式 */
.ant-btn{outline:none;position:relative;display:inline-block;font-weight:400;white-space:nowrap;text-align:center;background-image:none;background-color:transparent;border:1px solid transparent;cursor:pointer;transition:all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);user-select:none;touch-action:manipulation;line-height:1.5714285714285714;color:rgba(0, 0, 0, 0.88);font-size:14px;height:32px;padding:4px 15px;border-radius:6px}
.ant-btn-primary{color:#fff;background-color:#08c18a;box-shadow:0 2px 0 rgba(5, 255, 135, 0.1)}
.ant-btn-primary:not(:disabled):hover{color:#fff;background-color:#29cf97}
.ant-btn-primary:not(:disabled):active{color:#fff;background-color:#009c72}
/* ==================== 响应式样式 - 移动端适配 ==================== */
/* 平板设备 (768px - 1024px) */
@media (max-width: 1024px) {
.agent-detail-page {
min-width: 100% !important;
}
.agent-banner .agent-banner-content .agent-banner-mian {
flex-direction: column;
align-items: center;
padding: 0 20px;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left {
margin-right: 0;
margin-bottom: 40px;
text-align: center;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-right {
width: 100%;
max-width: 600px;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs .img_1 {
width: 100%;
height: auto;
}
.agent-solution-tabs {
width: 95% !important;
flex-wrap: wrap;
height: auto !important;
padding: 10px;
}
.agent-solution-tabs .agent-solution-tab {
line-height: 40px !important;
font-size: 16px !important;
margin: 5px;
flex: 1 1 calc(50% - 10px);
}
.agent-solution-content {
width: 95% !important;
}
.comment-layout {
flex-direction: column;
align-items: center;
}
.comment-card-main,
.comment-card-side-group {
width: 100% !important;
max-width: 100% !important;
}
}
/* 手机设备 (小于768px) */
@media (max-width: 768px) {
/* 导航栏 */
.my-agent-layout-header {
min-width: 100% !important;
height: 60px !important;
}
.my-agent-layout-header .my-agent-layout-header-box {
padding: 0 15px !important;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .logo-area {
margin-right: 10px !important;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .logo-area .logo-image {
width: 100px !important;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list {
display: none; /* 默认隐藏，通过JS控制显示 */
}
/* 移动端菜单按钮 */
.mobile-menu-toggle {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
font-size: 24px;
cursor: pointer;
color: #333;
margin-right: 10px;
}
/* 移动端菜单展开样式 */
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list {
position: absolute;
top: 100%;
left: 0;
right: 0;
background: #fff;
flex-direction: column;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
padding: 20px 0;
z-index: 1001;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item {
width: 100%;
height: auto !important;
line-height: 45px !important;
padding: 0 20px !important;
border-bottom: 1px solid #f0f0f0;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item:last-child {
border-bottom: none;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-left .layout-header-content .menu-list .menu-item.active:after {
display: none;
}
.my-agent-layout-header .my-agent-layout-header-box .my-agent-layout-header-right .ant-btn {
font-size: 12px !important;
padding: 4px 10px !important;
height: 28px !important;
}
/* 页面容器 */
.agent-detail-page {
min-width: 100% !important;
}
/* Banner区域 */
.agent-banner {
height: auto !important;
padding-bottom: 40px;
}
.agent-banner .agent-banner-content {
padding-top: 70px !important;
}
.agent-banner .agent-banner-content .agent-banner-mian {
flex-direction: column;
margin: 20px auto 0 !important;
padding: 0 15px;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left {
margin-right: 0 !important;
margin-bottom: 30px;
width: 100%;
text-align: center;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-title {
margin: 0 auto 15px auto !important;
display: flex;
justify-content: center;
align-items: center;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-title .agent-banner-tag {
font-size: 14px !important;
text-align: center !important;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-headline {
font-size: 32px !important;
margin-bottom: 12px;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-desc {
font-size: 14px !important;
width: 100% !important;
height: auto !important;
margin-bottom: 20px;
-webkit-line-clamp: 3;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry {
margin-bottom: 30px !important;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry .agent-banner-industry-tags {
flex-wrap: wrap;
justify-content: center;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-industry .agent-banner-industry-tags .industry-tag {
font-size: 12px !important;
margin-right: 8px !important;
margin-top: 8px !important;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-btn {
flex-direction: column;
gap: 10px;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .min-agent-banner-btn {
width: 100%;
max-width: 200px;
font-size: 13px !important;
padding: 10px 20px !important;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-right {
width: 100%;
}
.agent-banner .agent-banner-content .agent-banner-mian .main-right .main-right-imgs {
display: none; /* 移动端隐藏右侧装饰图片 */
}
/* 用户统计区域 */
.agent-detail-page .agent-detail .agent-use-user {
flex-direction: column;
height: auto !important;
padding: 20px 15px;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-left {
flex: none !important;
width: 100% !important;
min-width: 100% !important;
margin-bottom: 15px;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-left span {
font-size: 18px !important;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right {
width: 100%;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item {
margin-right: 20px !important;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .img {
height: 40px !important;
width: 40px !important;
margin-right: 8px !important;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .info .user {
font-size: 14px !important;
}
.agent-detail-page .agent-detail .agent-use-user .agent-use-user-right .agent-use-user-list .item .info .text {
font-size: 12px !important;
}
/* 核心功能区域 */
.core-fn-section {
padding: 40px 15px 40px !important;
}
.core-fn-title {
font-size: 28px !important;
margin-bottom: 30px !important;
padding: 0 15px;
}
.core-fn-list {
grid-template-columns: 1fr !important;
grid-template-rows: auto !important;
gap: 16px !important;
padding: 0 15px;
}
.core-fn-item {
width: 100% !important;
min-height: auto !important;
}
.core-fn-item .core-fn-item-content {
flex-direction: column;
padding: 20px !important;
width: 100% !important;
text-align: center;
}
.core-fn-item .core-fn-item-content .core-fn-item-icon {
margin: 15px 0 0 0 !important;
height: 60px !important;
width: 60px !important;
}
.core-fn-item .core-fn-item-content .core-fn-item-info .core-fn-item-title {
font-size: 18px !important;
margin-bottom: 10px;
}
.core-fn-item .core-fn-item-content .core-fn-item-info .core-fn-item-desc {
font-size: 13px !important;
line-height: 20px;
}
/* 产品痛点区域 */
.product-selection-section {
height: auto !important;
padding: 40px 15px !important;
}
.product-selection-title {
font-size: 28px !important;
margin-bottom: 30px !important;
padding: 0 15px;
}
.product-selection-list {
flex-direction: column !important;
gap: 20px !important;
padding: 0 15px;
}
.product-selection-item {
width: 100% !important;
max-width: 100% !important;
height: auto !important;
padding: 30px 20px !important;
}
.product-selection-item .product-selection-icon {
height: 80px !important;
width: 80px !important;
margin-bottom: 20px !important;
}
.product-selection-item .product-selection-item-title {
font-size: 20px !important;
margin-bottom: 15px;
}
.product-selection-item .product-selection-item-desc {
font-size: 14px !important;
line-height: 24px;
}
/* 优势展示区域 */
.agent-strength-section {
height: auto !important;
padding: 40px 15px !important;
background-size: cover !important;
}
.agent-strength-content {
flex-direction: column;
}
.agent-strength-left {
flex: none !important;
max-width: 100% !important;
padding-right: 0 !important;
margin-bottom: 30px;
}
.agent-strength-left .agent-strength-title {
font-size: 28px !important;
text-align: center;
width: 100%;
}
.agent-strength-left .agent-strength-desc {
font-size: 14px !important;
max-width: 100% !important;
text-align: center;
}
.agent-strength-left .agent-strength-data {
justify-content: center;
flex-wrap: wrap;
gap: 30px !important;
}
.agent-strength-left .agent-strength-data .data-item {
text-align: center;
flex: 1 1 calc(50% - 15px);
min-width: 120px;
}
.agent-strength-left .agent-strength-data .data-item .data-value {
font-size: 24px !important;
}
.agent-strength-left .agent-strength-data .data-item .data-label {
font-size: 13px !important;
}
.agent-strength-right {
margin-left: 0 !important;
width: 100%;
text-align: center;
}
.agent-strength-right img {
height: auto !important;
width: 100% !important;
max-width: 300px;
}
/* 解决方案区域 */
.agent-solution-section {
padding: 40px 15px !important;
}
.agent-solution-title {
font-size: 28px !important;
margin-bottom: 30px !important;
padding: 0 15px;
}
.agent-solution-tabs {
width: 100% !important;
flex-wrap: wrap !important;
height: auto !important;
padding: 10px !important;
border-radius: 16px !important;
}
.agent-solution-tabs .agent-solution-tab {
flex: 1 1 calc(50% - 10px) !important;
line-height: 45px !important;
font-size: 14px !important;
margin: 5px;
min-width: calc(50% - 10px);
}
.agent-solution-content {
width: 100% !important;
margin-top: 30px !important;
padding: 0 15px;
}
.agent-solution-panel {
flex-direction: column;
}
.agent-solution-panel-left {
padding-right: 0 !important;
margin-bottom: 30px;
text-align: center;
}
.agent-solution-panel-left .agent-solution-panel-title {
font-size: 20px !important;
margin-bottom: 15px;
}
.agent-solution-panel-left .agent-solution-panel-desc {
font-size: 14px !important;
max-width: 100% !important;
margin-bottom: 20px;
}
.agent-solution-panel-left .agent-solution-btn {
width: 100% !important;
max-width: 200px;
margin: 0 auto;
font-size: 18px !important;
height: 48px !important;
}
.agent-solution-panel-right {
width: 100%;
}
.agent-solution-panel-right .agent-solution-img-placeholder {
width: 100% !important;
height: auto !important;
max-width: 100%;
}
/* 用户评价区域 */
.agent-comment {
height: auto !important;
padding: 40px 15px !important;
}
.comment-title {
font-size: 24px !important;
padding-top: 40px !important;
margin-bottom: 30px !important;
padding: 0 15px;
}
.comment-layout {
flex-direction: column !important;
gap: 20px !important;
padding: 0 15px;
}
.comment-card-main {
width: 100% !important;
height: auto !important;
padding: 25px 20px !important;
margin-bottom: 0;
}
.comment-card-main .comment-main-title {
font-size: 20px !important;
margin-bottom: 15px;
}
.comment-card-main .comment-main-desc {
font-size: 14px !important;
margin-bottom: 20px;
}
.comment-card-side-group {
width: 100% !important;
gap: 15px !important;
}
.comment-card-side-group .comment-card-side {
padding: 20px !important;
}
.comment-card-side-group .comment-side-desc {
font-size: 14px !important;
margin-bottom: 20px;
}
.comment-user {
justify-content: flex-start !important;
}
.comment-user .user-avatar {
height: 45px !important;
width: 45px !important;
margin-left: 0 !important;
margin-right: 10px;
}
.comment-user .user-name {
font-size: 12px !important;
}
/* 试用区域 */
.trial-section {
height: auto !important;
padding: 40px 15px !important;
}
.trial-content {
flex-direction: column !important;
width: 100% !important;
text-align: center;
}
.trial-title {
font-size: 24px !important;
margin-left: 0 !important;
margin-bottom: 20px;
}
.trial-btn {
width: 100% !important;
max-width: 200px;
margin: 0 !important;
font-size: 18px !important;
height: 50px !important;
}
/* 页脚 */
.fl-footer {
padding: 40px 15px 20px !important;
}
.fl-footer .footer-container {
flex-direction: column !important;
gap: 30px;
}
.fl-footer .footer-container .footer-section {
width: 100% !important;
text-align: center;
}
.fl-footer .footer-container .footer-section .section-title {
font-size: 16px !important;
margin-bottom: 20px;
}
.fl-footer .footer-container .footer-section .section-list li {
margin-bottom: 15px;
font-size: 13px;
}
.fl-footer .copyright {
flex-direction: column !important;
font-size: 12px !important;
gap: 10px;
padding-top: 15px;
}
.fl-footer .copyright img {
width: 16px !important;
}
}
/* 小屏手机 (小于480px) */
@media (max-width: 480px) {
.agent-banner .agent-banner-content .agent-banner-mian .main-left .agent-banner-main .agent-banner-headline {
font-size: 26px !important;
}
.core-fn-title,
.product-selection-title,
.agent-solution-title,
.comment-title {
font-size: 24px !important;
}
.agent-strength-left .agent-strength-title {
font-size: 24px !important;
}
.agent-solution-tabs .agent-solution-tab {
font-size: 12px !important;
line-height: 40px !important;
padding: 0 8px;
}
.trial-title {
font-size: 20px !important;
}
}