/* 广告位总容器（总宽度1200px） */
.ad-total-container {
    width: 1200px; /* 满足总宽度1200像素要求 */
    margin: 30px auto; /* 上下外边距30px，左右自动居中 */
    padding: 0px;
   
    border: 0px solid #ebeef5;
    border-radius: 10px;
    font-family: "Microsoft YaHei", sans-serif;
}

/* 广告位网格布局容器（每行5个广告，共2行） */
.ad-grid {
    display: grid;
    /* 网格布局：每行5个广告位，自动分配宽度，间距20px（宽松美观，适配5列布局） */
    grid-template-columns: repeat(5, 1fr);
    gap: 20px; /* 20px间距，避免广告位拥挤，视觉舒适 */
}

/* 单个图片广告位样式 */
.single-img-ad {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden; /* 隐藏图片超出圆角的部分，保证圆角完整 */
    transition: all 0.3s ease; /* 悬浮过渡效果，更顺滑 */
}

/* 单个图片广告位悬浮交互效果 */
.single-img-ad:hover {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
    border-color: #d93025; /* 悬浮时边框变色，吸引注意力 */
    transform: translateY(-2px); /* 轻微上移，增强交互感 */
}

/* 广告图片样式：保证图片自适应容器，不变形 */
.ad-item-img {
    width: 100%; /* 图片宽度铺满父容器 */
    height: 180px; /* 固定图片高度，保证所有广告位图片统一整齐 */
    object-fit: cover; /* 图片等比例缩放，填充容器，裁剪多余部分（不拉伸变形） */
    display: block; /* 消除图片底部默认留白 */
}

/* 广告图片链接：去除默认样式，保证整个广告位可点击 */
.ad-item-link {
    text-decoration: none; /* 去除链接下划线 */
    display: block; /* 让链接铺满整个广告位，点击图片任意位置均可跳转 */
}