/*下面是我们xx自定义的样式*/
.xx2_scale_8{
    transform: scale(0.8);
}
.text-hui{
    color:#797777 !important;
}
.text-shenhui{
    color: #3c3b3b !important;
}
.xxcontent_mb,.xxcontent_pc{
    margin-top:50px;
}
.mobile-menu{
    z-index: 11 !important;
}
.xx_xiangdui{
    position: relative;
}
.xx_juedui_10{
    position: absolute;
    top:10%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.xx_juedui_15{
    position: absolute;
    top:15%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.xx_juedui_20{
    position: absolute;
    top:20%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.xx_juedui_40{
    position: absolute;
    top:40%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.xx_juedui_20_right{
    position: absolute;
    top:12%;
    right: 0%;
    transform: translate(-50%,-50%);
}

.xx_juedui_0_center{
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translate(-50%, 0px);
}
.xx_juedui_0_bottom{
    position: absolute;
    bottom:6%;
    left: 35%;
    transform: translate(-50%,-50%);
}

.xx_juedui_10_bottom{
    position: absolute;
    bottom:10%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.xx_juedui_15_bottom{
    position: absolute;
    bottom:15%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.xx_juedui_20_bottom{
    position: absolute;
    bottom:20%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.xx_juedui_20_right_bottom{
    position: absolute;
    bottom:12%;
    right: 0%;
    transform: translate(-50%,-50%);
}

.xx_juedui_30_bottom{
    position: absolute;
    bottom:28%;
    left: 65%;
    transform: translate(-50%,-50%);
}

.xx_juedui_30_right_bottom{
    position: absolute;
    bottom:30%;
    right: 0%;
    transform: translate(-50%,-50%);
}

.dongtai_wenzi0{
    opacity: 0;
    transform: translate(-50%, -180%);
}
.xxshow_block{
    display: block !important;
}
.xxshow{
    transition: all 1.5s;
    opacity: 1;
    transform: translate(-50%, -50%);
}

.xxshow_bottom{
    transition: all 1.5s;
    opacity: 1;
    transform: translate(-50%, 0%);
}

.dongtai_wenzi1{
    opacity: 1;
    transform: translate(-50%, -50%);
}
.xxhide{
    transition: all 1.5s;
    opacity: 0;
    transform: translate(-50%, -180%);
}

.icons{
	display: block;
	width: 56px;
	height: 56px;
	background: red;
	border-radius: 50%;
	}
.svg-icon {
    display: none; /* 默认隐藏所有图标 */
	width: 56px;
	
}

.svg-icon.active {
    display: block; /* 仅显示活动图标 */
	width: 56px;
	animation: ballBounce2 0.7s ease forwards;
}

.xx2_apps{
    width: 30px;
    height: 30px;
    display: block;
}
.xx2_apps_1{
    background: url(/xximgs/yingyong/yy/WhatsApp.png) no-repeat 100% / 100%;
}
.xx2_apps_2{
    background: url(/xximgs/yingyong/yy/lanyaphone.png) no-repeat 100% / 100%;
}
.xx2_apps_3{
    background: url(/xximgs/yingyong/yy/zaoyin.png) no-repeat 100% / 100%;
}
.xx2_apps_4{
    background: url(/xximgs/yingyong/yy/chazhao.png) no-repeat 100% / 100%;
}
.xx2_apps_5{
    background: url(/xximgs/yingyong/yy/pay.png) no-repeat 100% / 100%;
}
.xx2_apps_6{
    background: url(/xximgs/yingyong/yy/gupiao.png) no-repeat 100% / 100%;
}
.xx2_apps_7{
    background: url(/xximgs/yingyong/yy/AI.png) no-repeat 100% / 100%;
}
.xx2_apps_8{
    background: url(/xximgs/yingyong/yy/helps.png) no-repeat 100% / 100%;
}
.xx2_apps_9{
    background: url(/xximgs/yingyong/yy/luyin.png) no-repeat 100% / 100%;
}
.xx2_apps_10{
    background: url(/xximgs/yingyong/yy/game.png) no-repeat 100% / 100%;
}
.xx2_apps_11{
    background: url(/xximgs/yingyong/yy/ebook.png) no-repeat 100% / 100%;
}
.xx2_apps_12{
    background: url(/xximgs/yingyong/yy/miusc.png) no-repeat 100% / 100%;
}
.xx2_apps_13{
    background: url(/xximgs/yingyong/yy/photos.png) no-repeat 100% / 100%;
}

#xxdivs_act{
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.container {
    position: relative;
}


.rectangle {
    width: 300px;
    height: 60px;
    position: relative;
    animation: bounce_hide 1s ease forwards;
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content: space-around;
}

.active .rectangle  {
    width: 300px;
    height: 60px;
    position: relative;
    animation: bounce 1s ease forwards;
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content: space-around;
}
.balls{
	width: 204px;
    height: 56px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    background: rgba(232,232,237,0.7);
    border-radius: 25px;
	
}
.ball {
    width: 10px;
    height: 10px;
    background-color:rgba(29,29,31,0.6);
    border-radius: 50%;
	animation: ballBounce 0.8s ease forwards;
	transition: 0.8s all;
}

.ball.act {
    width: 50px;
    border-radius: 5px;
    position: relative; /* 添加这一行 */
    overflow: hidden;;
}

.ball.act::after {
    content: "";
    position: absolute; /* 添加这一行 */
    top: 0; /* 确保定位在父元素内 */
    left: 0; 
    background: #ff0808;
    width: 0%;
    height: 100%; /* 确保高度设置 */
    animation: huadong 5s ease forwards;
}


.rectangle:hover .ball {
    animation: ballBounce .7s ease forwards;
}

.xxbtn_group{
    position: fixed;
    bottom: 5vh;
    width:100vw;
}
.xinxin {
    transition: 1s all;
}
.xinvideo{
    width:85vw;
    margin-right: 20px; /* 根据需要调整间距 */
    transition: 1s all;
}
.xinvideo:last-child {
    margin-right: 0; /* 最后一个视频不需要右边距 */
}


.duibi {
            position: relative;
            width: 100%;
            margin: 0px auto;
        }
        .duibi_img_kuang {
            background: #f5f5f5;			
        }
        .duibi_img {
            position: relative;
            overflow: hidden;
            border-radius: 10px;
            height: 379px;
            max-width: 1336px;
            margin: 0 auto;
        }
        .duibi_img .image {
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: cover;
            top:0px;
            left:0px;
            transition: 0.8s all;
        }        
        .slider-container {
            width: 178px;
            height: 5px;
            background: gray;
            position: relative;
            border-radius: 10px;
            margin: 20px auto;
        }
        .slider {
            width: 36px;
            height: 36px;
            background: url(http://v.pavainnov.com/v/fx.png);
            background-size: contain;
            border-radius: 50%;
            position: absolute;
            top: 50%;
            cursor: pointer;
            transform: translate(-50%, -50%);
            z-index: 3;
        }
        .fill {
            position: absolute;
            height: 100%;
            background: #0071e3;
            top: 0;
            left: 0;
            transition: width 0.1s ease;
            z-index: 0;
        }
        .slider_bg {
            background: rgba(0, 0, 0, 0.11);
            width: 200px;
            margin: 10px auto;
            height: 45px;
            align-items: center;
            display: flex;
            justify-content: center;
            border-radius: 20px;
			padding:0px 15px;
        }
        .border {
            position: absolute;
            top: 0;
            left: 100vw;
            height: 100%;
            background: white;
            transition: 0.8s all;
            z-index: 4;
            pointer-events: none; /* 使其不影响其他元素的交互 */
        }
		
		.duibi_top{
			display: flex;
			justify-content: space-between;
			max-width: 1336px;
			margin: 0px auto 50px auto;
			padding: 30px 30px 80px 30px;
			background: #f5f5f5;
			font-size: 30px;
			color: #1d1d1f;
		}
		
        .pb-150{
            padding-bottom:150px;
        }
        .pb-200{
            padding-bottom:200px;
        }
        .pb-250{
            padding-bottom:250px;
        }
        .xxkd_200{
            width:200px;
            text-align: justify;
        }
        .xxkd_300{
            width:300px;
            text-align: justify;
        }
        .xxkd_400{
            width:400px;
            text-align: justify;
        }
        .xxkd_500{
            width:500px;
            text-align: justify;
        }
        .xxkd_600{
            width:600px;
            text-align: justify;
        }
        .circle_group{
            background: rgba(66, 66, 69, 0.7);
            padding: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-around;
            width: 130px;
            border-radius: 30px;
            margin: 0px auto;
        }
        .circle {
            display: inline-block;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            background-color: #c2a080; /* 选中状态时的颜色 */
            position: relative;
        }

        .circle.selected {
            background-color: transparent; /* 选中时的背景变透明 */
            border: 1px solid blue; /* 蓝色边框 */
            width:36px;
            height:36px;
        }

        .circle.selected::before {
            content: '';
            display: block;
            width: 30px; /* 中间圆的宽度 */
            height: 30px; /* 中间圆的高度 */
            border-radius: 50%;
            background-color: #c2a080; /* 中间圆的颜色 */
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); /* 居中对齐 */
        }
        
        .image-container {
            transition: opacity 1s ease;
        }
        
        .image-container img {
            object-fit: cover;
            border-radius: 40px;
        }
        .xxsection_dark{
                background-color: #1d1d1f;
                
        }
        .xxsection{
            
        }
        .xxsection50{
            padding-bottom: 50px;
        }
        .xx_float{
            padding-bottom:50px;
        }
        .xx_juedui_0{
            position: absolute;
            top:0px;
            left:0px;
        }
        
        .pt-100{
            padding-top:150px !important;
        }
        .pb-100{
            padding-bottom:150px !important;
        }
        .p-100{
            padding-top:100px !important;
            padding-bottom:100px !important;
        }
        
        .mt-100{
            margin-top:150px !important;
        }
        .mb-100{
            margin-bottom:150px !important;
        }
        .m-100{
            margin-top:100px !important;
            margin-bottom:100px !important;
        }
        .w-80{
            width:80%;
        }
        .w-90{
            width:90%;
        }
        .ff-hosb{
            font-family: 'HarmonyOS_Sans_SC_Bold' !important;
        }
        .ff-hosr{
            font-family: 'HarmonyOS_Sans_SC_Regular' !important;
        }
        .ff-cu{
            font-family: 'HarmonyOS_Sans_SC_Bold' !important;
        }
        .ff-xi{
            font-family: 'HarmonyOS_Sans_SC_Regular' !important;
        }
        .fs-6{
            font-size: 1rem !important;
        }
        .kd-380{
            width:380px !important;
        }
        .bg-f5f5f7{
            background: #f5f5f7;
        }
        .xxindex-0{
            z-index: 0;
        }
        .xxindex-1{
            z-index: 1;
        }
        .xxindex-2{
            z-index: 2;
        }
        .xxindex-3{
            z-index: 3;
        }
        .xxindex-4{
            z-index: 4;
        }
        .xxindex-5{
            z-index: 5;
        }
@keyframes bounce {
  0% {  
    transform: translateY(100px); /* 在动画的开始、中间几个点以及结束时，圆形都在顶部 */ 	
	opacity:0;
	width:0px;
  }  
  50% {  
    transform: translateY(-18px); /* 圆形在40%的时间点向下移动30px，模拟弹跳效果 */  
	opacity:1;
  }  
  100% {  
    transform: translateY(-12px); /* 圆形在60%的时间点再次向下移动，但距离减小，模拟弹跳的衰减 */  
	opacity:1;
	width:300px;
  }  
}

@keyframes bounce_hide{
    0% {  
    transform: translateY(0px); /* 在动画的开始、中间几个点以及结束时，圆形都在顶部 */ 	
	opacity:1;
	width:300px;
  }  
  100% {  
    transform: translateY(100px); /* 圆形在60%的时间点再次向下移动，但距离减小，模拟弹跳的衰减 */  
	opacity:0;
	width:0px;
  }  
}

@keyframes ballBounce {
  0% {  
    transform: translateY(0); /* 在动画的开始、中间几个点以及结束时，圆形都在顶部 */  
  }  
  50% {  
    transform: translateY(-15px); /* 圆形在40%的时间点向下移动30px，模拟弹跳效果 */  
  }  
  100% {  
    transform: translateY(0px); /* 圆形在60%的时间点再次向下移动，但距离减小，模拟弹跳的衰减 */  
  }  
}

@keyframes ballBounce2 {
  0% {  
    transform: translateY(0); /* 在动画的开始、中间几个点以及结束时，圆形都在顶部 */  
  }  
  50% {  
    transform: translateY(-6px); /* 圆形在40%的时间点向下移动30px，模拟弹跳效果 */  
  }  
  100% {  
    transform: translateY(0px); /* 圆形在60%的时间点再次向下移动，但距离减小，模拟弹跳的衰减 */  
  }  
}

@keyframes huadong{
    0%{
        width: 0%;
    }
    100%{
        width:100%;
    }
}
.text-hui{
    color:#a09fa1;
}
.xx2_play_btn,.xx2_play_btn2,.xx2_play_btn3{
    width:50px;
    height:50px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position:absolute;
    z-index: 100;
    filter: grayscale(1);
    mix-blend-mode: screen;
    -webkit-mix-blend-mode: screen;
}

.xx2_play_btn2,.xx2_play_btn3{
    display: none !important;
}
.xx2_video_kuang{
    position: relative;
    width: 100%;
    height: auto;
    margin-top: -1px;
}
/*.xx2_video_kuang img{*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*}*/
.xx2_manping{
    width:100vw !important;
    height: auto !important;
    object-fit: cover !important;
    max-height: 100% !important;
    display: block;
}
.xx2_manping70{
    width:70vw !important;
    height: auto !important;
    object-fit: cover !important;
    
}
.xx2_apps_item {
    text-align: left;
    line-height: 1vw;
    height: 7vw;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    justify-content: start;
}
.xx2_apps_item_title {
    padding-bottom: 0.5vw;
    font-size: 0.9vw !important;
    font-weight: 500;
}
.xx2_apps_item_cont{
    line-height: 1 !important;
    font-family: 'HarmonyOS_Sans_SC_Regular' !important;
}

.xx2_text_hui{
    color:#a09fa1;
}
.xx2_dengfen_2{
    width:50%;
    float:left;
}
.xx2_dengfen_3{
    width:33.3%;
    float:left;
}
.xx2_dengfen_4{
    width:25%;
    float:left;
}
.xx2_dengfen_5{
    width:20%;
    float:left;
}
.xx2_dengfen_6{
    width:16.6%;
    float:left;
}
.xx2_ssss_ziti{
        font-size: 0.5vw !important;
        font-weight: 500 !important;
    }
.xx2_sss_ziti{
        font-size: 0.9vw !important;
        font-weight: 500 !important;
    }    
.xx2_ss_ziti{
    font-size: 1.1vw !important;
    font-weight: 500 !important;
}

.xx2_sm_ziti{
    font-size: 1.3vw !important;
}

.xx2_mdl_ziti{
    font-size: 3.1vw !important;
}

.xx2_md_ziti{
    font-size: 2.8vw !important;
}
.xx2_mdm_ziti{
    font-size: 2.1vw !important;
    }
.xx2_mds_ziti{
        font-size: 1.7vw !important;
    }
.xx2_mdss_ziti{
        font-size: 1.4vw !important;
    }
.xx2_mdsss_ziti{
        font-size: 1.2vw !important;
    }      
.xx2_xl_ziti{
   font-size: 4.5vw !important; 
}
.xx2_xlm_ziti{
   font-size: 4.8vw !important; 
}
.xx2_xll_ziti{
   font-size: 5.1vw !important; 
}
/*xx2_cd_ziti   超大字体*/
.xx2_cd_ziti{
   font-size: 12vw !important; 
}

.xx2_abs_top{
    top:11%;
    position: absolute;
}
.xx2_abs_center{
    top:30%;  
    position:absolute;
}
.xx2_abs_left{
    left: 12%;
    position: absolute;
}
.xx2_abs_middle{
    left: 50% !important;
    transform: translate(-50%,50px) !important;
    position: absolute;
}
.xx2_abs_right{
    left: 66%;
    position: absolute;
}
.xx2_abs_bottom_0{
        bottom: 0%;
        position: absolute;
    }
.xx2_abs_bottom{
    bottom: 10%;
    position: absolute;
}
.xx2cuowei{
    opacity: 0;
    transform: translateY(50px);
    z-index: 10;
}
.xx2show{
    opacity: 1;
    transform: translateY(0);
    transition: all 0.6s;
}
.xx2show_middle{
    opacity: 1;
    transform: translate(-50%,0) !important;
    transition: all 0.6s;
}
.xx2line_height_80{
    line-height: 5vw !important;
}

.xx2line_height_60{
    line-height: 3.8vw !important;
}

.xx2line_height_50{
    line-height: 3vw !important;
}

.xx2line_height_40{
    line-height: 2.5vw !important;
}
.xx2line_height_30{
    line-height: 2vw !important;
}
.xx2line_height_25{
    line-height: 1.5vw !important;
}
.xx2line_height_23{
    line-height: 1.3vw !important;
}
.xx2line_height_20{
    line-height: 1.2vw !important;
}
.xx2line_height_10{
    line-height: 0.8rem !important;
    }
.xx2line_height{
    line-height: 1 !important;
}
.xx2text_left{
    text-align:left;
}

.xx2font_weight_700{
    font-weight: 700 !important;
}
.xx2font_fc_f56a01{
        color:#f56a01 !important;
    }
.xx2_sm_item{
    font-size:10px !important;
}    
/* 容器样式，让内部内容居中显示，并设置网格布局 */
.xx2top_bu {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 三列等宽布局 */
    gap: 20px; /* 列之间的间距 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中（对于网格容器，这通常用于内容块在容器中的垂直位置，但在这里可能不起作用，因为内容块本身有高度） */
    padding: 20px; /* 内边距，用于避免内容紧贴边缘 */
    box-sizing: border-box; /* 包括内边距和边框在内计算元素总宽度和高度 */
}

/* 内部元素样式，使用网格项默认样式，并设置一些基本属性 */
.xx2top_bu_item {
    display: flex; /* 使用flex布局来垂直对齐内部元素 */
    flex-direction: column; /* 垂直方向排列子元素 */
    align-items: center; /* 子元素在垂直方向上居中对齐 */
    justify-content: center; /* 子元素在水平方向上居中对齐（虽然这里可能不需要，因为内容本身会占据全部宽度） */
    padding: 20px; /* 内边距，用于增加内部元素与边框之间的距离 */
    border-radius: 10px; /* 可选：为网格项添加圆角 */
}

/* 头部样式，包含数字和PPI */
.xx2top_bu_item_head {
    display: flex; /* 使用flex布局来水平对齐内部元素 */
    justify-content: center; /* 数字和PPI之间留出空间 */
    width: 100%; /* 确保头部宽度占满父容器 */
}

/* 渐变背景，右上角白色，左下角蓝色，文字镂空显示 */
.xx2white_blue {
    font-size: 4vw; /* 字体大小 */
    color: transparent; /* 文字颜色透明以实现镂空效果 */
    background: linear-gradient(to top left, #0000ff,#01ffff); /* 渐变背景 */
    -webkit-background-clip: text; /* 背景裁剪为文字 */
    background-clip: text; /* 背景裁剪为文字（标准属性） */
}

/* 白色字体，字体大小2.5rem */
.xx2white_white {
    font-size: 1.8vw; /* 字体大小 */
    color: white; /* 白色字体 */
    padding-left: 10px; /* 与前一个元素留出空间 */
}

/* 描述文字居中显示，位于下一行 */
.xx2top_bu_item_desc {
    margin-top: 10px; /* 与头部留出空间 */
    font-size: 1.3vw; /* 可选：设置描述文字的字体大小 */
    color: #fff; /* 可选：设置描述文字的颜色 */
    text-align: center; /* 文本居中 */
    width: 100%; /* 确保描述宽度占满父容器 */
    margin-top: -1.5vw;
}
.xx2inner{
    width:65vw !important;
}
.xx2inner_55{
    width:55vw !important; 
}
.xx2inner_60{
        width:60vw !important;
    }
.xx2inner_70{
        width:70vw !important;
    }
.xx2inner_80{
    width:80vw !important;
}
.xx2inner_75{
    width:75vw !important;
}
.xx2inner_90{
    width:90vw !important;
}
.xx2inner_100{
    width:100vw !important;
}
.xx2_width_28{
    width:28vw !important;
}
.xx2_width_40{
    width:40vw !important;
}
.xx2_p_te{
    color: #f56a01 !important;
    text-align: center;
    font-size: 1.6vw;
    line-height: 4;
    font-weight: 700;
}
.xxsec1,.xxsec2,.xxsec3{
    color:#1d1d1f;
}
@media screen and (max-width:768px){
    .xx2_ssss_ziti{
        font-size: 0.5rem !important;
        font-weight: 500 !important;
    }
    .xx2_sss_ziti{
        font-size: 0.9rem !important;
        font-weight: 500 !important;
    }
    .xx2_ss_ziti{
        font-size: 0.87rem !important;
        font-weight: 500 !important;
    }
    
    .xx2_sm_ziti{
        font-size: 1rem !important;
    }
    
    .xx2_mdm_ziti{
        font-size: 1.85rem !important;
    }
    .xx2_mds_ziti{
        font-size: 1.7rem !important;
    }
    .xx2_mdss_ziti{
        font-size: 1.4rem !important;
    }
    .xx2_mdsss_ziti{
        font-size: 1.2rem !important;
    }
    .xx2_mdl_ziti{
        font-size: 2.3rem !important;
    }
    .xx2_md_ziti{
        font-size: 2rem !important;
    }
    
    .xx2_xl_ziti{
       font-size: 3rem !important; 
    }
    .xx2_xlm_ziti{
       font-size: 3.4rem !important; 
    }
    .xx2_xll_ziti{
       font-size: 3.8rem !important; 
    }
    /*xx2_cd_ziti   超大字体*/
    .xx2_cd_ziti{
       font-size: 7rem !important; 
    }
    
    .xx2_abs_top{
        top:16%;
        position: absolute;
    }
    .xx2_abs_center{
        top:30%;  
        position:absolute;
    }
    .xx2_abs_left{
        left: 6%;
        position: absolute;
    }
    .xx2_abs_middle{
        left: 50% !important;
        transform: translate(-50%,50px) !important;
        position: absolute;
    }
    .xx2_abs_right{
        left: 66%;
        position: absolute;
    }
    .xx2_abs_bottom_0{
        bottom: 0%;
        position: absolute;
    }
    .xx2_abs_bottom{
        bottom: 10%;
        position: absolute;
    }
    .xx2cuowei{
        opacity: 0;
        transform: translateY(50px);
        z-index: 10;
    }
    .xx2show{
        opacity: 1;
        transform: translateY(0);
        transition: all 0.6s;
    }
    .xx2show_middle{
        opacity: 1;
        transform: translate(-50%,0) !important;
        transition: all 0.6s;
    }
    .xx2line_height_80{
        line-height: 5rem !important;
    }
    
    .xx2line_height_60{
        line-height: 3.8rem !important;
    }
    
    .xx2line_height_50{
        line-height: 3rem !important;
    }
    
    .xx2line_height_40{
        line-height: 2.5rem !important;
    }
    .xx2line_height_30{
        line-height: 2rem !important;
    }
    .xx2line_height_25{
        line-height: 1.5rem !important;
    }
    .xx2line_height_23{
        line-height: 1.3rem !important;
    }
    .xx2line_height_20{
        line-height: 1.2rem !important;
    }
    .xx2line_height_10{
        line-height: 0.8rem !important;
    }
    .xx2line_height{
        line-height: 1 !important;
    }
    .xx2text_left{
        text-align:left;
    }
    
    .xx2font_weight_700{
        font-weight: 700 !important;
    }
    .xx2font_fc_f56a01{
        color:#f56a01 !important;
    }
    /* 容器样式，让内部内容居中显示，并设置网格布局 */
    .xx2top_bu {
        grid-template-columns: 1fr; /* 单列布局 */
    }
 
    /* 可选：调整小屏幕下的字体大小或间距，以优化显示效果 */
    .xx2white_blue {
        font-size: 2.3rem; /* 示例调整 */
    }
 
    .xx2white_white {
        font-size: 1.3rem; /* 示例调整 */
    }
    .xx2top_bu_item {
        display: flex; /* 使用flex布局来垂直对齐内部元素 */
        flex-direction: column; /* 垂直方向排列子元素 */
        align-items: center; /* 子元素在垂直方向上居中对齐 */
        justify-content: center; /* 子元素在水平方向上居中对齐（虽然这里可能不需要，因为内容本身会占据全部宽度） */
        padding: 0px; /* 内边距，用于增加内部元素与边框之间的距离 */
        border-radius: 10px; /* 可选：为网格项添加圆角 */
    }
    .xx2top_bu_item_desc {
        font-size: 1rem; /* 示例调整 */
    }
    
    .xx2inner{
        width:65vw !important;
    }
    .xx2inner_55{
        width:55vw !important; 
    }
    .xx2inner_60{
        width:60vw !important;
    }
    .xx2inner_70{
        width:70vw !important;
    }
    .xx2inner_80{
        width:80vw !important;
    }
    .xx2inner_75{
        width:75vw !important;
    }
    .xx2inner_90{
        width:90vw !important;
    }
    .xx2inner_100{
        width:100vw !important;
    }
    .xx2_width_28{
        width:28vw !important;
    }
    .xx2_width_40{
        width:40vw !important;
    }
    .xxsec1,.xxsec2,.xxsec3{
        color:#1d1d1f;
    }
}
@media screen and (min-width:1024px){
    .xx_wenzi_1{
        font-family: "HarmonyOS_Sans_SC_Regular" !important;
        font-size: 1.5rem;
    }
    .xx_wenzi_2{
        font-family: "HarmonyOS_Sans_SC_Bold";
        font-size: 2.5rem;
    }
}

@media screen and (min-width:1920px){
    .xx_wenzi_1{
        font-family: "HarmonyOS_Sans_SC_Regular" !important;
        font-size: 2.5rem;
    }
    .xx_wenzi_2{
        font-family: "HarmonyOS_Sans_SC_Bold";
        font-size: 3.5rem;
    }
}

@media screen and (min-width:2500px){
    .xx_wenzi_1{
        font-family: "HarmonyOS_Sans_SC_Regular" !important;
        font-size: 3rem;
    }
    .xx_wenzi_2{
        font-family: "HarmonyOS_Sans_SC_Bold";
        font-size: 5rem;
    }
}