/* 公共样式表扩展 - 颜色样式 */

/* 品牌颜色 */
:root { --primary-color: #132e66; /* 主色调 */ --secondary-color: #2b7aff; /* 次要色调 */ --bg-grey-color: #f3f3f4; /*背景*/ --bg-light-color: #f6f9ff; /*次要背景色*/ --bg-dark-color: #001841; /* 暗色调背景色 */ --success-color: #32cd32; /* 成功色调 */ --warning-color: #ff8c00; /* 警告色调 */ --danger-color: #ff6347; /* 危险色调 */ --light-primary-color: #e7eefe; /* 浅色调 */ --white-color: #ffffff; /*白色*/ --text-primary-color: #1d2129; /* 文字主色调 */ --text-secondary-color: #4e5969; /* 文字次要色调 */ --text-three-color: #86909c; /* 文字辅助色调 */ }

/* 文字颜色 */

/* 背景颜色 */
.bg-primary { background-color: var(--bg-grey-color); }

.bg-secondary { background-color: var(--bg-light-color); }
.bg-dark { background-color: var(--bg-dark-color); }

/* 边框颜色 */
.border-primary { border-color: var(--primary-color); }

/* 按钮颜色 */
.button-primary { background: var(--white-color); border: 1px solid var(--primary-color); padding: 8px 8px; font-size: 1em; color: var(--primary-color); }
/* 空心按钮 */
.button-grey { background: var(--bg-grey-color); border: 1px solid #e9e9e9; padding: 8px 8px; font-size: 1em; color: var(--text-secondary-color); }
/* 灰色按钮 */

/* 按钮颜色悬停效果 */

.button-primary:hover { opacity: 0.8; }
/* 按钮样式 */
button { display: inline-block; text-align: center; text-decoration: none; font-size: 1em; border: none; cursor: pointer; transition: background-color 0.3s ease; }
/* 按钮通用样式 */

.try-out-btn { cursor: pointer; padding: 8px 16px; background-color: #2b569e; color: #fff; }
/* 实心主色调按钮 */

/* 链接颜色 */
a.text-primary:hover { color: var(--secondary-color); text-decoration: none; }

.mr8 { margin-right: 8px; }
.mt16 { margin-bottom: 16px; }

/* 公共样式表 */

/* 重置一些基本的HTML元素样式 */
body,
h1,
h2,
h3,
p,
ul,
li,
figure,
figcaption { margin: 0; padding: 0; }

body { font-family: "Arial", sans-serif; line-height: 1.6; color: #333; background-color: #ffffff; font-size: 14px; }



.container { margin: 0 auto; min-height: 70vh; min-width: 1200px; }
.m-p { width: 1200px; margin: 0 auto; }
/* 标题样式 */
h1,
h2,
h3,
h4,
h5,
h6 { font-family: "Helvetica Neue", sans-serif; margin: 0; padding: 0; }
.title { color: var(--primary-color); font-size: 2.5em; text-align: center; margin-bottom: 32px; }

h1 { font-size: 2.5em; /*30px*/ }

h2 { font-size: 1.71em; /*24px*/ }

h3 { font-size: 1.42em; /*20px*/ }

h4 { font-size: 1.28em; /*18px*/ }

h5 { font-size: 1.14em; /*16px*/ }

h6 { font-size: 1em; /*14px*/ }

/* 段落样式 */
p { margin-bottom: 1em; font-size: 1em; }

/* 链接样式 */
a { color: var(--primary-color); text-decoration: none; }

    a:hover { text-decoration: none; }

/* 列表样式 */
ul { list-style: none; }

    ul li { margin-bottom: 0; }

.contact-button { padding: 8px 16px; background-color: #2b569e; color: #fff; font-size: 16px; }
.button:hover { background-color: #00529f; }

/* 容器样式 */
/****************头部样式开始****************/
.header { height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 20px 0px; width: 1200px; margin: 0 auto; }
.header-left { flex: 1; text-align: left;padding-left:10px; }

/*网站logo的样式*/

.logo { width: 186px; height: auto;  }
    .logo a { display: flex; align-items: center; }
.nav-menu { flex: 2; display: flex; align-items: center; justify-content: center; line-height: 56px; }
    .nav-menu li { line-height: 56px; font-size: 16px; padding: 0 30px; white-space: nowrap; }
        .nav-menu li a { color: #333; cursor: pointer; }
            .nav-menu li a:hover { text-decoration: none; text-decoration: none; color: #00529f; font-weight: 700; }
.head-right { flex: 1; text-align: right; padding-right: 16px; }

/****************头部样式结束****************/
.banner { background: url(../images/banner1.png) no-repeat; background-size: cover; height: 460px; }

.banner-1 { background: url(../images/banner-1.png) no-repeat right bottom; height: 460px; display: flex; justify-content: center; flex-direction: column; text-align: center; width: 1200px; margin: 0 auto; }
.banner-txt { width: 600px; }
    .banner-txt h1 { font-size: 56px; margin-bottom: 16px; }
    .banner-txt p { font-size: 1.71em; }

/*优质的服务*/

.box1 { height: 256px; }
.pic-list { display: flex; justify-content: space-between; }
.pic-list-son { width: 176px; text-align: center; color: var(--text-three-color); }

.bold-text { font-weight: bold; color: var(--text-primary-color); font-size: 16px; margin-bottom: 8px; }

.pic-list p { padding-top: 16px; }

/*AI识别*/
.box2 { background: #f3f3f4; height: 675px; }
.ai-container { display: flex; display: -webkit-box; /* 老版本Chrome和Safari */ display: -moz-box; /* 老版本Firefox */ display: -ms-flexbox; /* IE 10 */ display: -webkit-flex; /* 新版本Chrome */ flex-wrap: wrap; gap: 16px 24px; }
.ai-feature { position: relative; background: var(--white-color); flex: 1 1 45%; -ms-flex: 1 1 45%; height: 290px; /* 盒子的高度，可以根据需要调整 */ padding: 24px; box-sizing: border-box; border: 1px solid #ffffff; border-radius: 5px; box-shadow: 0px 5px 20px 0px rgba(58, 160, 228, 0.1); }
    .ai-feature h4 { margin-bottom: 32px; display: flex; align-items: center; line-height: 24px; }
.ai-feature-icon { margin-right: 8px; }
.feature-btn { position: absolute; left: 16px; bottom: 24px; }
.txt-flex { width: 100%; display: flex; align-items: center; flex-wrap: wrap; }
.txt-1 { background-color: var(--light-primary-color); padding: 0px 16px; margin-right: 16px; margin-bottom: 16px; height: 32px; line-height: 32px; font-size: 14px; color: var(--text-secondary-color); display: block; }
.upload-box{
    display:flex;
    flex-direction:column;
    justify-content:center;
}
/*AI应用定制化平台开发服务*/
.box3 { background: #f6f9ff; height: 589px; box-sizing: border-box; background: #f6f9ff url(../images/bg-1.png) no-repeat center; }
.service-wrapper { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.service-left { flex: 1; box-sizing: border-box; text-align: left; color: var(--text-primary-color); }
.service-right { flex: 2; text-align: right; }
.contact-button { display: flex; align-items: center; margin-top: 48px; }

/*服务行业*/
.box4 { height: 196px; }
.service-menu ul { display: flex; justify-content: space-between; }
    .service-menu ul li { text-align: center; font-size: 16px; }
.menu-icon { display: block; text-align: center; height: 56px; margin-bottom: 16px; }
.company { display: flex; justify-content: space-between; flex-wrap: wrap; }
    .company li { background: var(--white-color); display: block; width: 276px; height: 72px; text-align: center; margin-bottom: 16px; }
/*合作伙伴*/
.box5 { height: 263px; }
/*底部信息*/
.box6 { height: 278px; background: #001841; padding: 24px 0; align-items: center; }
.bottom { display: flex; width: 100%; }
.box6-left { flex: 1; box-sizing: border-box; border-right: 1px solid rgba(43, 122, 255, 0.42); height: 230px; color: var(--text-three-color); display: flex; align-items: center; }
.box6-right { flex: 1; color: var(--white-color); height: 230px; display: flex; padding-left: 36px; }
.lxwm-logo { width: 282px; height: 56px; margin-right: 24px; }
.lxwm-txt { font-weight: bold; }
.call-iphone span { display: block; margin-right: 16px; text-align: center; }
.info ul li { line-height: 36px; margin-bottom: 16px; }
.copy-right-box { height: 72px; background: #000f29; color: #fff; }
.call-iphone { display: flex; }
.iphone { margin-left: 24px; }
.footer { text-align: center; }

.box1,
.box2,
.box3,
.box4,
.box5,
.box6,
.copy-right-box,
.us,
.technology,
.advantages,
.hytd,
.fays,
.yycj,
.cptj,
.yyty,
.yycj,
.cpys { width: 100%; padding: 48px 0px; }

/*AI识别页面*/
.AI-box1 { padding: 48px 0; }
.feature1 { background-image: linear-gradient(45deg, #7ca4f4, #88bdff); height: 160px; border: none; }
.feature2 { background-image: linear-gradient(45deg, #7f70dc, #aab2fe); height: 160px; border: none; }
.feature3 { background-image: linear-gradient(45deg, #bcebff, #44d3e4); height: 160px; border: none; }
.feature4 { background-image: linear-gradient(45deg, #75a1fe, #9bbbff); height: 160px; border: none; }
.c-w { color: var(--white-color); }
.AI-delivery { padding: 48px 0; background: var(--bg-grey-color); }
.ai-container-bottom { text-align: center; margin-top: 48px; font-size: 1.42em; }
.process,
.AI-box1 { width: 100%; padding: 48px 0; }
.process-box { display: flex; justify-content: space-between; width: 100%; }
    .process-box li { text-align: center; margin-right: 5px; height: 208px; padding-top: 112px; flex: 5; box-sizing: border-box; background: url(../images/pic-13.png) no-repeat center bottom; }
.f-s { font-size: 1em; }
.f-m { font-size: 1.14em; }
.f-l { font-size: 1.71em; }


/*关于我们*/
.technology { background: var(--bg-light-color); }
.technology-menu { display: flex; flex-wrap: wrap; gap: 0px 24px; }
.technology-info { flex: 3; box-sizing: border-box; background-color: var(--white-color); height: 220px; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15); }
.technology-info-bg { padding: 0px 16px 0px 32px; height: 90px; background-color: var(--light-primary-color); display: flex; justify-content: space-between; align-items: center; }
.technology-info p { padding: 32px; display: block; color: var(--primary-color); }

/*智能文档处理*/
.yycj-menu { display: grid; grid-template-columns: repeat(3, 1fr); /* 创建三列，每列占据相同的空间 */ grid-template-rows: repeat(2, auto); /* 创建两行，高度由内容决定 */ grid-gap: 24px; /* 设置行和列之间的间距为24px */ width: 100%; /* 或者你可以设置一个具体的宽度 */ }
.grid-item { box-sizing: border-box; background-image: linear-gradient(45deg, #e8f4ff, #ffffff); border: 1px solid #cdddff; padding: 32px; height: 200px; color: var(--text-secondary-color); position: relative; }
    .grid-item h4 { color: var(--primary-color); margin-bottom: 24px; }

/*方案优势*/
.fays { background-color: var(--bg-light-color); }
.yycj { background-color: var(--white-color); }
.fays-menu { display: flex; flex-wrap: wrap; justify-content: space-between; /* 水平方向上两端对齐，中间平均分布 */ }
.fays-item { flex: 0 0 49%; margin-bottom: 24px; /* 盒子之间的垂直间距 */ box-sizing: border-box; /* 包含padding和border在宽度和高度内 */ background: var(--white-color); border: 1px solid #cdddff; height: 167px; padding: 24px 32px 24px 32px; color: var(--primary-color); }
    .fays-item h4 { border-bottom: 1px solid var(--light-primary-color); padding: 0px 0px 16px 0px; margin-bottom: 16px; color: var(--primary-color); }
.b-postion { right: 32px; bottom: 24px; position: absolute; }
/* 联系我们，定制专属智能AI解决方案 */
.zn-contact { background: url(../images/bg-2.png) center bottom no-repeat #2b569e; background-size: cover; box-sizing: border-box; }

.contcact-ps { position: relative; height: 176px; padding: 32px; box-sizing: border-box; text-align: center; }
    .contcact-ps h4 { color: var(--white-color); }
    .contcact-ps button { padding: 16px 24px; color: var(--primary-color); font-size: 18px; border: 1px solid var(--primary-color); }
.contact-pic { position: absolute; right: 16px; top: -70px; }

/* AI识别 */
.cptj-box { height: 405px; width: 583px; background-image: linear-gradient(45deg, #e8f4ff, #ffffff); box-sizing: border-box; justify-content: space-between; padding: 32px; display: none; }
    .cptj-box.active { display: block; }
.cptj-tab { width: 602px; }
.cptj-box-pic { width: 200px; height: 200px; margin-right: 24px; }
.cptj-box-info h2 { margin-bottom: 32px; }
.cptj-box-info ul li { margin-bottom: 16px; font-size: 1.14em; padding-left: 24px; background: url(../images/icon-37.png) left center no-repeat; }
.cptj-box-info p { color: var(--text-three-color); }
.cptj-tab ul { display: flex; justify-content: space-between; }
    .cptj-tab ul li { cursor: pointer; height: 405px; width: 190px; color: var(--white-color); padding: 32px; display: flex; flex-direction: column; align-items: center; box-sizing: border-box; background-image: linear-gradient(-45deg, #7298e8, #132e66); }
    .cptj-tab ul li { transition: background-color 0.3s ease; /* Smooth transition for background color */ }
        .cptj-tab ul li img { width: 48px; height: 48px; }
        .cptj-tab ul li a { color: #fff; }
        /* CSS for hover state of li */
        .cptj-tab ul li:hover { background-image: linear-gradient( -45deg, rgba(114, 152, 232, 0.9), rgba(19, 46, 102, 0.9) ); /* Change background color with 10% opacity on hover */ }

        /* CSS for active state of li */
        .cptj-tab ul li.active { background-image: linear-gradient( -45deg, rgba(114, 152, 232, 0.9), rgba(19, 46, 102, 0.9) ); /* Change background color with 20% opacity when active */ }
.postion { display: flex; }
.cptj-tab ul li h5 { margin: 24px 0; }
.yyty { background-color: var(--bg-grey-color); }
.yyty-tab { margin-bottom: 16px; }
    .yyty-tab ul { display: flex; color: var(--text-secondary-color); }
    .yyty-tab a { font-size: 16px; text-decoration: none; padding: 16px 8px; }
    .yyty-tab .active { border-bottom: 3px solid #2b569e; font-weight: bold; color: #2b569e; }
    .yyty-tab ul li { color: #fff; font-size: 16px; cursor: pointer; padding: 16px 8px; margin-right: 32px; }

.yyty-box { background-color: var(--bg-dark-color); border-radius: 5px; display: none; }
    .yyty-box.active { display: block; }

.yyty-box-content { padding: 20px 8px 20px 8px; box-sizing: border-box; overflow: hidden; clear: both; }

.yyty-box1 { width: 50%; background-color: var(--white-color); border-radius: 5px 0px 0px 5px; padding: 32px; float: left; height: 382px; box-sizing: border-box; }

.yyty-box2 { height: 382px; width: 50%; background-color: var(--bg-grey-color); border-radius: 0px 5px 5px 0px; padding: 32px; color: var(--text-primary-color); float: right; box-sizing: border-box; }

    .yyty-box2 h4 { color: var(--primary-color); margin-bottom: 16px; }
.yyty-botom { width: 40%; margin: 0 auto; margin-top: 16px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: var(--text-three-color); clear: both; }
.yyty-bottom-s { color: var(--danger-color); }

.yycy-box { display: flex; justify-content: space-between; height: 260px; width: 100%; }
.yycy-content { flex: 1; background: url(../images/pic-24.png) no-repeat; box-sizing: border-box; margin: 0 12px; position: relative; }
    .yycy-content:first-child { margin-left: 0; }
    .yycy-content:last-child { margin-right: 0; }
.yycy-content-main { position: absolute; left: 0; bottom: 0; height: 132px; background-color: rgba(0, 0, 0, 0.4); width: 100%; color: var(--white-color); padding: 16px; box-sizing: border-box; }
    .yycy-content-main h4 { color: var(--white-color); margin-bottom: 8px; }

.cpys { height: auto; }
.cpys-box ul { display: flex; justify-content: space-between; }
    .cpys-box ul li { justify-content: center; align-items: center; display: flex; flex: 1; margin: 0px 12px; background-color: #000f29; height: 96px; box-sizing: border-box; border: 1px solid rgb(255, 255, 255); border-radius: 5px; box-shadow: 0px 5px 20px 0px rgba(58, 160, 228, 0.1); background: linear-gradient(rgb(230, 235, 239) 58.779%, #ffffff); }
        .cpys-box ul li h2 { color: var(--text-primary-color); margin-left: 8px; }
        .cpys-box ul li:first-child { margin-left: 0px; }
        .cpys-box ul li:last-child { margin-right: 0px; }
/* 响应式设计 */
@media (max-width: 768px) {
    .container { width: 95%; }

    .nav ul { flex-direction: column; }

        .nav ul li { margin-bottom: 10px; }
}



/**头像***/
.avatar-container { white-space: nowrap; position: relative; margin-right: 50px; display: inline-block; }

.avatar { width: 40px; height: 40px; display: block; background: #c0c44c; border-radius: 50%; box-sizing: border-box; cursor: pointer; transition: transform 0.3s ease; }

.dropdown-card { position: absolute; top: 60px; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); opacity: 0; visibility: hidden; transition: all 0.3s ease; }

.avatar:hover { transform: scale(1.1); }

    .avatar:hover + .dropdown-card,
    .dropdown-card:hover { opacity: 1; visibility: visible; top: 55px; }

.user-info { padding: 10px; text-align: left; }
    .user-info a { cursor: pointer; }
.nickname { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 5px; }

.info-item { font-size: 14px; padding: 5px 0 5px 0; color: #666; line-height: 1.6; }

.divider { height: 1px; background: #eee; }

.doc-content { padding: 20px; }