@charset "utf-8";

@font-face {
    font-family: 'DINRegular';
    src: url('/font/din-regular-webfont.eot');
    src: url('/font/din-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/font/din-regular-webfont.woff') format('woff'),
         url('/font/din-regular-webfont.ttf') format('truetype'),
		 url('/font/din-regular-webfont.otf') format('otf'),
         url('/font/din-regular-webfont.svg#DINRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


body { margin-left: 0px; margin-top: 0px;	margin-right: 0px; margin-bottom: 0px; background-color: #F7F7F7; font-family: 'DINRegular', Arial, Helvetica, sans-serif; }
a:hover { color: #ffffff; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:active { text-decoration: none; }

.all{ margin:0px auto; overflow:hidden; }


.namepc { display: block; }
.namemob { display: none; }


/* 悬浮导航容器 - 固定在右下角 */
.floating-nav { position: fixed; bottom: 50px; right: 20px; z-index: 9999; display: flex; flex-direction: column; align-items: flex-end; transition: all 0.3s ease;
/* 默认隐藏，滚动超过一屏后显示 */
opacity: 0; visibility: hidden; pointer-events: none; }
/* 显示导航的状态 - 滚动超过一屏后添加 */
.floating-nav.show { opacity: 1; visibility: visible; pointer-events: auto; }
/* 导航内容区域 - 默认隐藏 */
.floating-nav__content { margin-bottom: 5px; opacity: 0; visibility: hidden; transform: translateY(20px); transition: all 0.3s ease;
background: transparent; border-radius: 9px; overflow: hidden; min-width: auto;}
/* 展开状态 */
.floating-nav.active .floating-nav__content { opacity: 1; visibility: visible; transform: translateY(0); }
/* 导航列表 */
.floating-nav__list { list-style: none; margin: 0; padding: 0; }
/* 导航项 */
.floating-nav__item { border-bottom: 0px solid #D18E90; }
.floating-nav__item:last-child { border-bottom: none; }
/* 导航链接文字 - 可通过此类修改样式 */
.floating-nav__link { display: block; color: #D18E90; text-decoration: none; font-size: 14px; text-align: right; transition: all 0.2s ease; cursor: pointer; }
.floating-nav__link:hover { color: #bbbbbb; padding-left: 24px; }
/* 中英文切换：默认显示英文，隐藏中文 */
.nav-text-zh { display: none; }
/* 鼠标悬停时显示中文，隐藏英文 */
.floating-nav__link:hover .nav-text-en { display: none; }
.floating-nav__link:hover .nav-text-zh { display: inline; }
/* 悬浮按钮 */
.floating-nav__toggle { width: 24px; height: 24px; border-radius: 9px; background: linear-gradient(#D18E90 0%, #bc7376 100%); color: #fff; 
border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 12px; transition: all 0.3s ease; }
.floating-nav__toggle:hover { transform: scale(1.05); rgba(102, 126, 234, 0.5); background: linear-gradient(#bc7376 0%, #D18E90 100%); }
.floating-nav.active .floating-nav__toggle { transform: rotate(180deg); }

/* ========== 移动端响应式适配 ========== */
@media screen and (max-width: 768px) {
.floating-nav { bottom: 50px; right: 20px; }
.floating-nav__toggle { width: 24px; height: 24px; font-size: 12px; }
.floating-nav__content { min-width: auto; right: 0; }
.floating-nav__link { font-size: 14px; }
/* 移动端防止导航超出屏幕 */
.floating-nav__content { max-height: 70vh; overflow-y: auto; }
}
@media screen and (max-width: 480px) {
.floating-nav { bottom: 50px; right: 20px; }
}




/* ==== customer wall ==== */
.tri_sphere_root {
    display: flex;
    flex-wrap: wrap;
    gap: 40px; /* 加大移动端球体间距，避免重叠 */
    width: 100%;
    padding: 60px 20px;
    background: url("../images/customerwallbg.jpg") center/100% auto no-repeat scroll;
    box-sizing: border-box;
    justify-content: center;
    min-height: auto; /* 高度完全随内容自适应 */
}
/* 标题样式 */
.section_title {
    width: 100%;
    text-align: center;
    font-size: 30px;
    color: #D18E90;
}
.tri_sphere_item {
    position: relative;
    flex: 1 1 calc(33.333% - 80px);
    min-width: 320px;
    height: 420px;
    perspective: 750px;
    overflow: visible; /* 修复球体被裁剪问题 */
}
.sphere_fixed_title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 36px;
    color: #fff;
    z-index: 99;
    white-space: nowrap;
    pointer-events: none;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5); /* 文字阴影提升可读性 */
}
.tri_sphere_wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.tri_sphere_box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform-style: preserve-3d;
}
.tri_sphere_item_text {
    position: absolute;
    top: 0;
    left: 0;
    line-height: 22px;
    white-space: nowrap;
    cursor: default; /* 去除手势光标 */
    transform-origin: center center;
    user-select: none;
    color: rgba(255,255,255,0.85); /* 文字不透明度提升更清晰 */
    font-size: 14px;
    transition: color 0.2s ease;
}
/* 鼠标悬停文字变色 */
.tri_sphere_item_text:hover {
    color: #D18E90; /* 金色悬停效果，可自行修改 */
}

/* 移动端适配：三行垂直排列 */
@media (max-width: 768px) {
    .tri_sphere_root {
        flex-direction: column; /* 强制垂直排列 */
        gap: 60px 0; /* 垂直方向间距60px，完全分开三个球体 */
        padding: 40px 15px;
		background: url("../images/customerwallbg.jpg") center/cover no-repeat scroll;
    }
    .tri_sphere_item {
        flex: 0 0 auto; /* 禁止弹性缩放 */
        width: 100%; /* 每个球体占满100%宽度 */
        min-width: 100%;
        height: 360px; /* 移动端单个球体高度 */
        display: block;
        visibility: visible;
        margin: 0;
    }
	.section_title {
        font-size: 16px; /* 移动端自动缩小标题字号，适配小屏 */
    }
}





/* ===== 案例图片画廊 ===== */
.gallery { display: flex; flex-wrap: wrap; gap: 5px; padding: 5px; }
.image { box-sizing: border-box; overflow: hidden; position: relative; cursor: pointer; }
/* 1:1 正方形图片 - 正好一行4张 */
.image.is-1-1 { flex: 0 0 calc(25% - 3.75px); width: calc(25% - 3.75px); }
/* 2:1 宽比例图片 - 正好一行2张 */
.image.is-2-1 { flex: 0 0 calc(50% - 2.5px); width: calc(50% - 2.5px); }
.image img {
    width: 100%; height: auto; /* 统一固定高度，同行高度一致 */
    object-fit: cover; /* 保持图片比例，裁剪超出部分 */
    display: block; transition: transform 0.3s ease; /* 平滑过渡 */
}
/* ===== 鼠标悬停效果：黑色遮罩 + 白色文字 ===== */
.image .overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); /* 黑色半透明遮罩 */
    color: white; /* 白色文字 */
    display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 10px; box-sizing: border-box; opacity: 0; /* 默认隐藏 */
    transition: opacity 0.3s ease; /* 淡入效果 */
	border-radius: 0px; }
/* 鼠标悬停时显示遮罩和文字 */
.image:hover .overlay { opacity: 1; }
/* 悬停时图片轻微放大，增加交互感 */
.image:hover img { transform: scale(1.05); }
.image .overlays {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); /* 黑色半透明遮罩 */
    color: white; /* 白色文字 */
    display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 10px; box-sizing: border-box; opacity: 1; /* 默认隐藏 */
    transition: opacity 0.3s ease; /* 淡入效果 */
	border-radius: 0px; }
/* 鼠标悬停时隐藏遮罩和文字 */
.image:hover .overlays { opacity: 0; }

/* ===== 案例视频画廊（同图片尺寸比例）===== */
.video { box-sizing: border-box; overflow: hidden; position: relative; cursor: pointer; }
/* 1:1 正方形视频 - 正好一行4张 */
.video.is-1-1 { flex: 0 0 calc(25% - 3.75px); width: calc(25% - 3.75px); }
/* 2:1 宽比例视频 - 正好一行2张 */
.video.is-2-1 { flex: 0 0 calc(50% - 2.5px); width: calc(50% - 2.5px); }
.video video { width: 100%; height: auto; object-fit: cover; /* 保持视频比例，裁剪超出部分 */
    display: block; transition: transform 0.3s ease; /* 平滑过渡 */ }
/* ===== 视频鼠标悬停效果：和图片保持一致 ===== */
.video .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); color: white; display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 10px; box-sizing: border-box; opacity: 0; transition: opacity 0.3s ease; border-radius: 0px; }
.video:hover .overlay { opacity: 1; }
.video:hover video { transform: scale(1.05); }
.video .overlays { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); color: white; display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 10px; box-sizing: border-box; opacity: 1; transition: opacity 0.3s ease; border-radius: 0px; }
.video:hover .overlays { opacity: 0; }
/* ===== 分类按钮 ===== */
.filter-bar { width: 100%; display: flex; flex-wrap: wrap; gap: 5px; padding: 10px 0 10px 0; padding-top: 1px; }
.filter-label { font-size: 14px; line-height: 30px; color: #888888; padding-left: 20px; }
.filter-btn { padding: 4px 8px; border: 1px solid #ddd; border-radius: 3px; background: #fff; color: #888888; cursor: pointer; transition: all 0.2s ease; font-size: 14px;}
.filter-btn:hover, .filter-btn.active { background: #D18E90; color: #fff; border: 1px solid #D18E90;}
/* 给图片和视频项增加过渡动画，筛选切换更顺滑 */
.image, .video { transition: all 0.3s ease; }






.footnotes { font-size: 12px; border-top: 0px solid #0060ff; font-weight: normal; display: inline-block; vertical-align: top; line-height: 1; }
.footnotes a { border-top: 0px solid #0060ff; }
.footnotes a:hover { border-top: 0px solid #D18E90; }
.footnotestext { font-size: 14px; color: #888888; line-height:18px; }
.footnotestext a { color: #888888; }
.footnotestext a:hover { color: #D18E90; }
.footnotestext b { font-weight: bold; }
.footnotestext row { display: flex; position: relative; }
.footnotestext row l { flex-direction: column; }
.footnotestext row r { flex-direction: column; padding-left: 10px; }
.footsign { font-size: 18px; color: #ff0000;}


.tooltip { position: relative; display: inline-block; }
.tooltiptext { visibility: hidden; opacity: 0; position: absolute; bottom: 110%; left: 50%; transform: translateX(-50%); background: #D18E90; color: white; line-height: 14px; padding: 6px 8px; border-radius: 2px; white-space: nowrap; z-index: 10; transition: opacity 0.2s; }
.tooltip:hover .tooltiptext { visibility: visible; opacity: 0.9; }
.tooltippng { visibility: hidden; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: transparent; }
.tooltip:hover .tooltippng { visibility: visible; }
.tooltipname { visibility: hidden; opacity: 0; position: absolute; bottom: 110%; left: 50%; transform: translateX(-20%); background: #D18E90; color: white; line-height: 14px; padding: 6px 8px; border-radius: 2px; white-space: nowrap; z-index: 10; transition: opacity 0.2s; }
.tooltip:hover .tooltipname { visibility: visible; opacity: 0.9; }
.toolfooticon { visibility: hidden; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: transparent; width: 120px; height: 120px; z-index: 99; transition: all 0.2s ease; }
.toolfooticon img { width: 100% !important; height: 100% !important; display: block; }
.tooltip:hover .toolfooticon { visibility: visible; opacity: 1; }



.logo { width: 100%; padding: 70 0 60 0; text-align: center; align-content: center; }
.logo img { width: 245px; height: 45px; }
.logobottom img { width: 120px; height: 52px; padding-bottom: 30px; }

.tag { font-size: 12px; color: #cccccc; line-height:12px; padding-bottom: 20px; }
.gray10 { font-size: 10px; color: #aaaaaa; line-height:12px; padding-bottom: 20px; }
.gray18 { font-size: 18px; color: #888888; line-height:20px; padding-bottom: 20px; }
.gray1288 { font-size: 12px; color: #888888; line-height:16px; padding-bottom: 25px; }
.gray1288 a { color: #888888; }
.gray1288 a:hover { color: #D18E90; }
.gray1488 { font-size: 14px; color: #888888; line-height:24px; }
.gray1888b { font-size: 24px; color: #888888; line-height:30px; font-weight: bold; }
.StandardC10 { font-size: 10px; color: #D18E90; line-height:14px; }
.StandardC14 { font-size: 14px; color: #D18E90; line-height:16px; }
.StandardC15 { font-size: 15px; color: #D18E90; line-height:16px; font-weight: bold; }

.white14 { font-size: 14px; color: #fff; line-height:20px; }
.white14 a { font-size: 14px; color: #fff; line-height:20px; }
.white14 a:hover { font-size: 14px; color: #D18E90; line-height:20px; }

.white30b { font-size: 30px; color: #fff; line-height:48px; font-weight: bold; }
.white30 { font-size: 30px; color: #fff; line-height:36px; }
.white48 { font-size: 48px; color: #fff; line-height:56px; }
.white48 a { color: #fff; }
.white48 a:hover { color: #D18E90; }

.divw { width: 100%; }

.aboutdiv { width: 100%; display: flex; position: relative; padding-bottom: 40px; }
.aboutl { width: 64%; padding-left: 16%; float: left; }
.aboutl article { font-size: 16px; line-height: 24px; color: #888888; }
.aboutl article a { color: #888888; }
.aboutl article a:hover { color: #D18E90; }
.aboutl article b { color: #D18E90; font-weight: bold; }
.aboutl article st { color: #D18E90; font-size: 16px; }
.aboutl article big { font-size: 30px; line-height: 30px; }

.aboutr { width: 33%; font-size: 14px; color: #fff; position: relative; justify-content: center; overflow: hidden; float: right; overflow: visible; z-index: 10; margin-bottom: -120px; }
.about-slider { position: relative; width: 100%; height: 100%; overflow: hidden; }
/* 轮播图片容器 */
.slider-images { position: relative; width: 100%; height: 100%; overflow: hidden; }
/* 幻灯片容器 - 只控制透明度 */
.slide-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.8s ease-in-out; }
.slide-item.active { opacity: 1; }
/* 背景图单独做滑动动画 */
.slide-bg { width: 100%; height: 100%; transform: translateY(30px); transition: transform 2.8s ease-in-out; }
.slide-item.active .slide-bg { transform: translateY(0); }
.slide-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 文字内容 - 独立动画，背景到位后再显现 */
.about-text { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; opacity: 0; transform: translateY(15px); transition: all 0.6s ease-in-out; transition-delay: 0.8s; /* 背景滑到位开始动画 */ }
.about-text a { color: #D18E90; }
.about-text a:hover { color: #fff; }
.about-text f { position: absolute; text-align: center; padding-top: 51px; width: 100%; margin-left: auto; margin-right: auto; }
.about-text f b { font-size: 40px; color: #fff; }
.about-text f m { font-size: 20px; color: #fff; }
.about-text f2 { position: absolute; text-align: center; bottom: 150px; width: 100%; margin-left: auto; margin-right: auto; }
.about-text f3 { position: absolute; text-align: center; padding-top: 120px; width: 100%; margin-left: auto; margin-right: auto; color: #fff; }
.about-text f3 b { font-size: 30px; color: #fff; }
.about-text f3 m { font-size: 30px; color: #fff; }
.about-text f4 { position: absolute; text-align: center; bottom: 200px; width: 100%; margin-left: auto; margin-right: auto; color: #fff; }
.slide-item.active .about-text { opacity: 1; transform: translateY(0); }
/* 圆点指示器 - 中底部 */
.slider-dots { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 15; display: flex; gap: 10px; }
.dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255, 255, 255, 0.5); cursor: pointer; transition: all 0.3s ease; }
.dot.active { background: #aaaaaa; transform: scale(0.8); }
.dot:hover { background: rgba(209, 142, 144, 0.8); }



.service { width: 100%; background-color: #DDDDDD; padding: 60px 0 30px 16%; position: relative; z-index: 1; }
.service a { color: #D18E90; }
.service a:hover { color: #fff; }
.service tit { font-size: 30px; line-height: 36px; color: #D18E90; }
.service t1 { font-size: 16px; line-height: 24px; color: #666666; }
.service t1 st { color: #D18E90; }
.service l { font-size: 13px; line-height: 20px; color: #666666; }
.service l a { color: #666666; }
.service l a:hover { color: #D18E90; }
.servicewhy { width: 100%; font-size: 15px; color: #888888; display: flex; position: relative; flex-direction: column; }
.servicewhy img { width: 100%; object-fit: cover; position: absolute; }
.servicewhy tit { font-size: 30px; line-height: 36px; color: #D18E90; display: flex; position: relative; padding: 40px 0 30px 16%; }
.servicewhy tit s { font-size: 14px; text-decoration: none; }
.servicewhy con { display: flex; position: relative; }
.servicewhy con figure { flex-direction: column; background-color: #fff; border-radius: 4px; opacity: 0.9; width: 30%; margin-left: 2.5%; padding: 20px; }
.servicewhy con figure a { color: #666666; }
.servicewhy con figure a:hover { color: #D18E90; }
.servicewhy con figure tit { font-size: 20px; line-height: 24px; color: #D18E90; display: flex; position: relative; padding: 0 0 15px 0; }
.servicewhy con figure st { color: #D18E90; }

.servicediv { width: 100%; background-color: #DDDDDD; }
.servicea { padding-left: 16%; padding-top: 60px; }
.servicea tit { font-size: 30px; line-height: 36px; color: #D18E90; }
.servicea t1 { display: flex; position: relative; padding-top: 20px; }
.servicea t1 t2 { padding-right: 20px; width: 21%; }
.servicea t1 t2 t3 { font-size: 16px; line-height: 30px; color: #D18E90; font-weight: bold; }
.servicea t1 t2 t4 { font-size: 14px; line-height: 20px; color: #555555; font-weight: bold; }
.servicea t1 t2 t5 { font-size: 14px; line-height: 14px; color: #D18E90; font-weight: normal; }
.servicea t1 t2 t6 { font-size: 12px; line-height: 14px; color: #999999; font-weight: normal; }
.servicea t1 t2 t6 a { color: #D18E90; }
.servicea t1 t2 t6 a:hover { color: #fff; }
.servicea t1 st { color: #D18E90; }
.serviceb { padding-left: 16%; padding-top: 40px; padding-bottom: 100px; }
.serviceb t1 { display: flex; position: relative; }
.serviceb t1 t2 { padding-right: 60px; }
.serviceb t1 t2 t3 { font-size: 16px; line-height: 30px; color: #D18E90; font-weight: bold; }
.serviceb t1 t2 t4 { font-size: 14px; line-height: 24px; color: #555555; font-weight: normal; }
.serviceb t1 t2 t5 { font-size: 24px; line-height: 36px; color: #D18E90; font-weight: normal; }
.serviceb t1 t2 t6 { font-size: 14px; line-height: 24px; color: #555555; font-weight: normal; }
.serviceb t1 t2 t7 { font-size: 14px; line-height: 18px; color: #555555; font-weight: bold; }
.servicec { width: 100%; display: flex; position: relative; font-size: 14px; color: #fff; justify-content: center; padding-bottom: 25%; }
.servicec img { width: 100%; object-fit: cover; position: absolute; text-align: center; justify-content: center; }
.servicec figure { background-color: #D18E90; opacity: 0.75; width: 30%; left: 16%; justify-content: center; position: absolute; text-align: center; margin-left: auto; margin-right: auto; margin-top: -50px; align-items: center; }
.servicec figure f { font-size: 24px; letter-spacing: 6px; color: #fff; display: flex; text-align: center; justify-content: center; margin-left: auto; margin-right: auto; padding-top: 30px; }
.servicec figure f1 { display: flex; position: relative; text-align: center; justify-content: center; margin-left: auto; margin-right: auto; }
.servicec figure f1 f2 { font-size: 16px; color: #fff; line-height: 30px; padding: 20 15 30 15; }



.partner { width: 100%; padding-bottom: 40px; }	
/* 图片切换容器 */
.img-switch { display: flex; position: relative; width: 68%; cursor: pointer; text-align: center; justify-content: center; margin-left: auto; margin-right: auto; }
/* 两张图片都充满容器，保持比例 */
.img-switch img { width: 100%; height: auto; display: block; transition: opacity 0.3s ease; padding: 60 0 0 0; }
/* 第二张图片默认隐藏 */
.img-switch .img2 { position: absolute; top: 0; left: 0; opacity: 0; }
/* 悬停时切换显示 */
.img-switch:hover .img2 { opacity: 1; }
.img-switch:hover .img1 { opacity: 0; }


.whyxi { width: 100%; padding: 30 0 40 0; }
.whyxi article { padding-left: 16%; font-size: 16px; color: #888888; line-height: 24px; }
.whyxi article a { color: #888888; }
.whyxi article a:hover { color: #D18E90; }
.whyxi article t { font-size: 30px; color: #D18E90; line-height: 36px; }
.whyxi article st { color: #D18E90;}
.whyxi figure { height: 30px; }
.line { border-bottom: 1px dashed #BBBBBB; }

.bottomtable { width: 68%; text-align: center; border: 0; align-content: center; padding: 0; margin-left: auto; margin-right: auto; padding-top: 20px; border-bottom: 1px dashed #BBBBBB; }

.foot { width: 100%; display: flex; position: relative; padding-top: 30px; }
.foot article { padding-left: 16%; width: 60%; font-size: 14px; color: #888888; line-height:18px; }
.foot article t { font-size: 24px; color: #888888; line-height: 36px; font-weight: bold; }
.foot figure { width: 24%; display: flex; align-items: flex-end; justify-content: flex-end; }
.foot figure row { position: relative; display: flex; }
.foot figure row t { font-size: 14px; color: #888888; line-height: 24px; text-align: right; width: 110px; }
.foot figure row t img { width: 90px; float: right; margin-left: 20px; }
.footicon { width: 84%; display: flex; justify-content: flex-end; align-items: flex-end; }
.footicon img { width: 50px; height: auto; margin: 18px 0 2px 10px; }
.footiconlink { transition: filter 0.3s ease; }
.footiconlink:hover { filter: invert(100%); }
.footcity { width: 84%; display: flex; justify-content: flex-end; align-items: flex-end; font-size: 16px; color: #D18E90; line-height: 30px; padding-bottom: 20px; }


.footbottom { width: 100%; display: flex; position: relative; padding: 5px 0 20px 0; }
.footbottom a { color: #888888; }
.footbottom a:hover { color: #D18E90; }
.footbottom article { padding-left: 16%; width: 26%; font-size: 12px; color: #888888; line-height:16px; }
.footbottom figure { width: 28%; display: flex; align-items: flex-end; justify-content: flex-end; }
.footbottom figure img { width: 120px; height: 22px; }
.footbottom contact { width: 30%; font-size: 18px; color: #888888; line-height: 20px; text-align: right; display: flex; align-items: flex-end; justify-content: flex-end; }



/* 声明模态框的基本样式 */
.modal {
  display: none; /* 默认隐藏 */
  position: fixed; /* 固定定位 */
  z-index: 1; /* 置于顶层 */
  left: 0; top: 0; width: 100%; /* 宽度100% */
  height: 100%; /* 高度100% */
  overflow: auto; /* 启用滚动条 */
  background-color: rgb(0,0,0); /* 背景颜色 */
  background-color: rgba(0,0,0,0.4); /* 背景颜色带透明度 */
}
/* 声明模态内容框样式 */
.modal-content {
  background-color: #fefefe; margin: 15% auto; /* 15% 从顶部和自动水平居中 */
  padding: 12 20 20 20; border: 1px solid #dddddd; border-radius: 4px; width: 86%; /* 可调整宽度 */
}
/* 声明关闭按钮样式 */
.close { color: #D18E90; float: right; font-size: 24px; }
.close:hover, .close:focus { color: black; text-decoration: none; cursor: pointer; }


/* 返回顶部按钮 */
#backToTop { position: fixed; bottom: 20px; right: 20px; width: 24px; height: 24px; border: 1px; border-radius: 9px; font-size: 16px; color: #999; display: none; /* 初始不显示 */ }
#backToTop:hover { background-color: #D18E90; color: #fff; }












@media (max-width: 800px) {
.namepc { display: none; }
.namemob { display: block; }
.bannericon img { width: 96%; }
.white30b { font-size: 24px; color: #fff; line-height:36px; font-weight: bold; }
.white30 { font-size: 24px; color: #fff; line-height:30px; }
	
.aboutdiv { width: 100%; flex-direction: column; }
.aboutl { width: 97%; padding-left: 15px; }
.aboutr { width: 100%; height: 600px; margin-bottom: -60px; }


.service { width: 100%; padding: 80px 10px 30px 20px; }
.servicewhy tit { padding: 20px 0 20px 0; justify-content: center; text-align: center; }
.servicewhy con { flex-direction: column; }
.servicewhy con figure { width: 89%; opacity: 1; margin: 0 20px 0 20px; padding: 5px 15px 15px 15px; }
.servicewhy con figure tit { color: #555555; justify-content: center; text-align: center; padding-top: 20px; }

.servicea { padding: 30px 0 20px 15px; }
.servicea t1 { padding-top: 5px; }
.servicea t1 t2 { padding-right: 10px; width: 25%; }
.serviceb { padding-left: 15px; padding-bottom: 80px; }
.serviceb t1 { flex-direction: column; }
.serviceb t1 t2 { padding-right: 0px; padding-bottom: 20px; }
.serviceb t1 t2 t3 { font-size: 14px; line-height: 24px; }
.serviceb t1 t2 t4 { font-size: 12px; }
.servicec { padding-bottom: 20%; }
.servicec img { width: 100%; height: 24vh; }
.servicec figure { width: 90%; left: 0px; position: relative; justify-content: center; text-align: center; }
.servicec figure f { font-size: 20px; }
.servicec figure f1 f2 { font-size: 14px; line-height: 20px; padding: 20 5 20 5; }


.tablepartner { padding-bottom: 20px; }	
/* 图片切换容器 */
.img-switch { width: 96%; }
/* 两张图片都充满容器，保持比例 */
.img-switch img { padding: 30 0 0 0; }
/* 第二张图片默认隐藏 */
.img-switch .img2 { position: absolute; top: 0; left: 0; opacity: 0; }
/* 悬停时切换显示 */
.img-switch:hover .img2 { opacity: 1; }
.img-switch:hover .img1 { opacity: 0; }
	

	
.footnotes { font-size: 10px; border-top: 0px solid #fff; font-weight: normal; display: inline-block; vertical-align: top; }
.footnotes a { border-top: 0px solid #fff; }
.footnotes a:hover { border-top: 0px solid #D18E90; }
.footnotestext { font-size: 11px; color: #888888; line-height:14px; }
.footsign { font-size: 14px; color: #ff0000;}

.tag { display: none; }
.gray1488 { font-size: 13px; color: #888888; line-height:18px; }
.gray1888b { font-size: 18px; color: #D18E90; line-height:24px; font-weight: bold; }

.StandardC14 { font-size: 11px; color: #D18E90; line-height:14px; }


.whyxi { padding: 0 20 40 20; }
.whyxi article { padding-left: 0; }
	
.bottomtable { width: 90%; padding-top: 0; }

.foot { display: inherit; position: relative; }
.foot article { width: 95%; padding-left: 20px; font-size: 14px; line-height: 18px; text-align: center; }
.foot article t { font-size: 22px; color: #D18E90; line-height: 30px; }
.foot figure { width: 95%; padding-left: 10px; padding: 30px 0 0 10px; display: flex; align-items: center; justify-content: center; }
.foot figure row t { text-align: center; justify-content: center; align-items: center; margin: 0 0 0 5px; }
.foot figure row t img { float: center; margin: 0 10px 0 0; }
.footicon { width: 100%; display: flex; justify-content: center; align-items: center; }
.footicon img { width: 40px; margin: 20px 5px 10px 5px; }
.footcity { width: 100%; display: flex; justify-content: center; align-items: center; font-size: 14px; }

.footbottom { padding: 10px 0 20px 0; }
.footbottom article { width: 30%; padding: 0 5px 0 20px; font-size: 10px; line-height:14px; }
.footbottom figure { width: 36%; display: flex; align-items: flex-end; justify-content: center; }
.footbottom contact { width: 34%; font-size: 12px; line-height: 14px; padding-right: 20px; }


	

/* 1:1 正方形图片 - 正好一行4张 */
.image.is-1-1 { flex: 0 0 calc(50% - 3.75px); width: calc(25% - 3.75px); }
/* 2:1 宽比例图片 - 正好一行2张 */
.image.is-2-1 { flex: 0 0 calc(100% - 2.5px); width: calc(50% - 2.5px); }
/* 1:1 正方形视频 - 正好一行4张 */
.video.is-1-1 { flex: 0 0 calc(50% - 3.75px); width: calc(50% - 3.75px); }
/* 2:1 宽比例视频 - 正好一行2张 */
.video.is-2-1 { flex: 0 0 calc(100% - 2.5px); width: calc(100% - 2.5px); }
	
}