* {
    padding: 0;
    margin: 0;
    font-family: Microsoft Yahei, "微软雅黑", "Helvetica Neue", Helvetica, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
}

li {
    list-style-type: none;
}

/* 返回顶部按钮样式 */
#backToTop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 70px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #f1404b;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 24px;
    opacity: 0.7;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 9999;
}

#backToTop:hover {
    opacity: 1;
    transform: scale(1.1);
}

/* 滚动条样式 */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-thumb {
    background-color: #c0c7d2;
    border-radius: 7px;
}

::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:active {
    background-color: #f1404b;
}

.fullscreen-img {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-width: 1920px !important;
    max-height: 1080px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    background-color: rgba(0, 0, 0, 1) !important;
    z-index: 99999 !important;
    cursor: zoom-out !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    display: block !important;
}

body {
    overflow-y: scroll;
    height: 100%;
    background: linear-gradient(270deg, #afb7be, #fcd7e6, #ece1dc, #a1d9e7);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

/* 页面背景 */
.banner {
    position: fixed;
    z-index: 99999;
    height: auto;
    width: 100%;
    line-height: 50px;
    font-size: 16px;
    background-color: #fff;
    opacity: 0.77;
    transition: all 0.25s ease;
}

.banner:hover {
    opacity: 0.99;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=99);
    filter: alpha(opacity=99);
}

/* 网站标题 */


/* 仅 Chrome 浏览器支持此效果 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .banner .webTitle {
        background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2), color-stop(0.85, #ff2), color-stop(1, #f22));
        color: transparent;
        -webkit-background-clip: text;
    }
}

#banner {
    float: right;
}

#banner a {
    text-decoration: none;
    color: #000;
}

#banner li {
    height: 100%;
    display: inline-block;
    padding: 0 10px;
    cursor: pointer;
    font-size: 15px;
    list-style-type: none;
}

#banner li:hover,
#banner li:hover a {
    color: #666;
}

/* 标签下拉菜单 */
.tags:hover #tags {
    display: block;
}

#tags {
    z-index: 9999;
    display: none;
    position: absolute;
    width: 210px;
    line-height: 35px;
    background-color: #fff;
    border-top: 2px solid #9EAFFF;
    font-size: 14px;
}

#tags li {
    width: 90px;
    float: left;
    padding: 0 0 0 15px;
    color: #000;
}

#tags li:hover {
    background-color: #eee;
}

body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.xben-container {
    padding-top: 50px;
    position: relative;
    width: 94%;
    height: auto;
    min-height: 500px;
    margin: 0 auto;
    box-sizing: border-box;
    will-change: transform; /* 提升渲染性能 */
}

body[class *=viewing-page] .xben-container {
    padding-top: 0px;
}



/* 拼图容器 */
.jigsaw .item {
    float: left;
    position: relative;
}

.jigsaw img {
    width: 100%;
    height: 100%;
}

/* 四分之一块 */
.jigsaw .quater {
    width: 25%;
    display: inline-block;
    background: #999;
}

/* 一半块 */
.jigsaw .half {
    width: 50%;
}



/* 每张小图片块 */
.oneImg {
    position: relative;
    /*z-index: 2;*/
    overflow: hidden;
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
}

.oneImg:hover {
    z-index: 22;
    -moz-box-shadow: 0px 0px 20px #000000;
    -webkit-box-shadow: 0px 0px 20px #000000;
    box-shadow: 0px 0px 20px #000000;
}

.oneImg:hover .down {
    right: 0;
    display: inline-block;
}


/* 加载更多 */
#loadmore {
    text-align: center;
    line-height: 40px;
    display: none;
    color: #666;
}

/* 底部固定彩色条样式 */
#footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: #000;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999999;
}

#footer a {
    color: white;
    text-decoration: none;
}

#footer a:hover,
#footer a:active {
    color: #f1404b;
}

/* 响应式页面 */
#walBox .section {
    -moz-background-size: cover;
    /* 确保图片填充整个区域 */
    -ms-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
    color: #fff;
    position: relative;
}

#walBox .note {
    font-size: 14px;
    position: absolute;
    left: 10px;
    bottom: 10px;
    text-shadow: 0 0 5px #000000;
    color: #fff;
}

#walBox .xben-note {
    bottom: 60px;
}

/* 右侧翻页小点 */
.onepage-pagination {
    top: 100px !important;
}

/* 下载对应图片时显示下载图标 */
.downBing {
    background: url("../image/dl-white.png") no-repeat;
}



/* 下载框 */
.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: rgba(0, 0, 0, .7);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;

    &:hover {
        text-decoration: underline;
    }
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;

    &:active {
        background-color: white;
    }
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;

    .navbar-toggler-icon {
        background: url("../image/zd.webp") no-repeat;
        background-size: 100% 100%;
    }
}

.xben-dropdown-menu {
    background-color: rgba(255, 255, 255, 0.95);
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 200px;
    max-height: 300px;
    padding: 8px 0;
    animation: fadeIn 0.3s ease;
    transform-origin: top;
    text-align: center;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
}

.xben-full-img>img {
    position: absolute;
    top: 20%;
    width: 100%;
    height: 220px;
}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    top: 24%;
    width: 150%;
    height: 50%;
}

.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;
}

/* 合并重复媒体查询 */
@media screen and (min-width: 768px) {
    #collapsibleNavbar {
        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {

    .jigsaw .item,
    .jigsaw .item .oneImg,
    .jigsaw .item.oneImg {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
        position: relative;
        margin-top: 20px;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;
    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;
        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 6px 0 0 !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }
}

/* 轮播图样式 */
/* 轮播图图片基础样式 */
.carousel-item {
    position: relative;
    height: 0;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.carousel-item img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
}

/* 最新壁纸区域样式 */
#latestWallpapers {
    margin-bottom: 30px;
    border-radius: 10px;
    overflow: hidden;
    padding: 10px;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    width: 90%;
    margin: 0 auto;
}

/* 拼图展示区域添加样式和圆角 */
.jigsaw {
    border-radius: 10px;
    padding: 10px;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: rgba(0, 0, 0, .7);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;
}

.down a:hover {
    color: #fff;
    text-decoration: underline;
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}

.xben-dropdown-menu {
    background-color: rgba(255, 255, 255, 0.95);
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 200px;
    max-height: 300px;
    padding: 8px 0;
    animation: fadeIn 0.3s ease;
    transform-origin: top;
    text-align: center;
    overflow-y: auto;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.xben-dropdown-menu a.dropdown-item {
    color: #333;
    padding: 10px 20px;
    font-size: 14px;
    transition: all 0.2s ease;
    text-align: center;

    &:hover {
        background-color: #f1404b;
        color: white;
        padding-left: 25px;
    }
}

/* 导航栏下拉菜单悬停效果 */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

/* 导航栏下拉菜单箭头 */
.nav-link.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
    transition: transform 0.2s ease;
}

.nav-item.dropdown:hover .nav-link.dropdown-toggle::after {
    transform: rotate(180deg);
}

#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {
    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.webp");
    background-size: 100% 100%;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }


}

/* 轮播图样式 */
.carousel-item img {
    height: auto;
    /* 响应式高度，继承容器比例 */
    object-fit: cover;
    /* 确保图片填充整个容器 */
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    /* 添加半透明背景 */
    border-radius: 5px;
}

/* 轮播图底部间距和阴影 */
#latestWallpapers {
    margin-bottom: 30px;
    /* 底部间距大小 */
    border-radius: 10px;
    /* 设置圆角 */
    overflow: hidden;
    /* 确保圆角效果 */
    padding: 10px;
    /* 添加内边距 */
    background-color: #fff;
    /* 添加背景色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 添加阴影效果 */
}

/* 拼图展示区域添加样式和圆角 */
.jigsaw {
    border-radius: 10px;
    /* 设置圆角 */
    padding: 0px;
    /* 添加内边距 */
    background-color: #fff;
    /* 添加背景色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 添加阴影效果 */
}
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {

    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.webp");
    background-size: 100% 100%;
}

.xben-dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
    justify-content: center;
    display: none;
    top: 0;
}

.xben-full-img>img {
    width: 100%;
    height: 220px;
    position: absolute;
    top: 20%;

}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    width: 150%;
    height: 50%;
    top: 24%;
}


.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;

}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }


}

/* 轮播图和拼图区域统一样式 */
.carousel-item img {
    height: 100%;
    /* 响应式高度，继承容器比例 */
    object-fit: cover;
    /* 保持图片比例填充 */
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    /* 半透明背景 */
    border-radius: 5px;
}

#latestWallpapers,
.jigsaw {
    margin-bottom: 30px;
    /* 底部间距 */
    border-radius: 10px;
    /* 圆角 */
    overflow: hidden;
    /* 确保圆角效果 */
    padding: 10px;
    /* 内边距 */
    background-color: #fff;
    /* 背景色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 阴影效果 */
}

.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: #000;
    background: rgba(0, 0, 0, .7);
    filter: alpha(opacity=70);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;
}

.down a:hover {
    color: #fff;
    text-decoration: underline;
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {

    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.webp");
    background-size: 100% 100%;
}

.xben-dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
    justify-content: center;
    display: none;
    top: 0;
}

.xben-full-img>img {
    width: 100%;
    height: 220px;
    position: absolute;
    top: 20%;

}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    width: 150%;
    height: 50%;
    top: 24%;
}


.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;

}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }


}

/* ??????? */
.carousel-item img {
    height: 100%;
    /* 响应式高度，继承容器比例 */
    object-fit: cover;
    /* ????????????????? */
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    /* ???????????? */
    border-radius: 5px;
}

/* ??????????·??????????? */
#latestWallpapers {
    margin-bottom: 30px;
    /* ????????С */
    border-radius: 10px;
    /* ??????? */
    overflow: hidden;
    /* ????????Ч */
    padding: 10px;
    /* ???????? */
    background-color: #fff;
    /* ???????? */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* ???????Ч?? */
}

/* ???????????????????????? */
.jigsaw {
    border-radius: 10px;
    /* ??????? */
    padding: 10px;
    /* ???????? */
    background-color: #fff;
    /* ???????? */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* ???????Ч?? */
}

.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: #000;
    background: rgba(0, 0, 0, .7);
    filter: alpha(opacity=70);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;
}

.down a:hover {
    color: #fff;
    text-decoration: underline;
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {

    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.webp");
    background-size: 100% 100%;
}

.xben-dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
    justify-content: center;
    display: none;
    top: 0;
}

.xben-full-img>img {
    width: 100%;
    height: 220px;
    position: absolute;
    top: 20%;

}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    width: 150%;
    height: 50%;
    top: 24%;
}


.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;

}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }


}

/* 局部图样式 */
.carousel-item img {
    height: 400px;
    /* 可根据需要调整局部图高度 */
    object-fit: cover;
    /* 保持图片比例填充 */
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    /* 添加半透明背景 */
    border-radius: 5px;
}

/* 局部图底部添加间距和阴影 */
#latestWallpapers {
    margin-bottom: 30px;
    /* 底部间距大小 */
    border-radius: 10px;
    /* 圆角大小 */
    overflow: hidden;
    /* 确保圆角效果 */
    padding: 10px;
    /* 内边距 */
    background-color: #fff;
    /* 背景颜色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 添加阴影效果 */
}

/* 拼图展示区域添加样式和圆角 */
.jigsaw {
    border-radius: 10px;
    /* 圆角大小 */
    padding: 0px;
    /* 内边距 */
    background-color: #fff;
    /* 背景颜色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 添加阴影效果 */
}

.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: #000;
    background: rgba(0, 0, 0, .7);
    filter: alpha(opacity=70);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;
}

.down a:hover {
    color: #fff;
    text-decoration: underline;
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {

    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.png");
    background-size: 100% 100%;
}

.xben-dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
    justify-content: center;
    display: none;
    top: 0;
}

.xben-full-img>img {
    width: 100%;
    height: 220px;
    position: absolute;
    top: 20%;

}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    width: 150%;
    height: 50%;
    top: 24%;
}


.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;

}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }


}

/* 轮播图样式 */
.carousel-inner {
    overflow: hidden;
    /* 移除固定高度，让轮播图容器自适应 */
}

.carousel-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* 继承容器高度 */
    opacity: 0;
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

.carousel-item.active {
    position: relative;
    opacity: 1;
}

.carousel-item-next:not(.carousel-item-left),
.active.carousel-item-right {
    transform: translateX(100%);
}

.carousel-item-prev:not(.carousel-item-right),
.active.carousel-item-left {
    transform: translateX(-100%);
}

.carousel-item img {
    width: 100%;
    height: 100%; /* 填充容器 */
    object-fit: cover;
}

.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    /* 添加半透明背景 */
    border-radius: 5px;
}
/* 局部图底部添加间距和阴影 */
#latestWallpapers {
    width: 50%;
    /* 保持之前设置的宽度 */
    margin: 0 auto 30px;
    /* 使用margin: 0 auto实现水平居中，保留底部30px边距 */
    border-radius: 10px;
    overflow: hidden;
    padding: 0px;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* 拼图展示区域添加样式和圆角 */
.jigsaw {
    border-radius: 10px;
    /* 圆角大小 */
    background-color: #fff;
    /* 背景颜色 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* 添加阴影效果 */
}

.down {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    height: auto;
    background: #000;
    background: rgba(0, 0, 0, .7);
    filter: alpha(opacity=70);
    font-size: 13px;
    padding: 10px;
    line-height: 22px;
    right: -130px;
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    overflow-y: auto;
}

.down li {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAADe3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t7e3t4RmXU5AAAACnRSTlMAsKAQW6Z5c2lOCqK00wAAAEJJREFUCNdjwAaYVq1SIMAwNl21KtgYyMhaBQTLgAx2EKMAJNe1atUKsGKWVascICZ6LYEazTkB1SpBMAAyVoEBAwBXFRj52xzkuAAAAABJRU5ErkJggg==) no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

.down a {
    color: #fff;
    text-decoration: none;
}

.down a:hover {
    color: #fff;
    text-decoration: underline;
}

/* 每日英语英文原文 */
.ciba-eng {
    cursor: pointer;
}

.ciba-eng:hover {
    text-decoration: underline;
}

/* 每日英语喜欢 */
.ciba-love {
    moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}



/* 全屏显示的图片 */
#full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
}

#xbenSearchBtn {
    margin-left: 10px;
}

.xben-day-img {
    width: 100%;
    height: 100%;
    position: fixed;

}

.xben-day-img>img {
    width: 100%;
    height: 100%;
}



#walBox .note>span {
    display: block;
}

.xben-nav {
    background-color: rgb(0 0 0) !important;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}

.xben-nav a {
    color: white !important;
}

.xben-nav .dropdown-item {
    color: #333 !important;
}

.xben-nav .dropdown-item:active {

    background-color: white;
}

.xben-nav .xben-toggler {
    border-color: #f2f3f4 !important;
    outline: none !important;
}

.xben-nav .xben-toggler .navbar-toggler-icon {
    background: url("../image/zd.png");
    background-size: 100% 100%;
}

.xben-dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}



.xben-love {
    color: tomato;
    font-size: 14px;
}

.love-count {
    font-size: 14px;
    color: #999;
}

.xben-full-img {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 99999999;
    justify-content: center;
    display: none;
    top: 0;
}

.xben-full-img>img {
    width: 100%;
    height: 220px;
    position: absolute;
    top: 20%;

}

.xben-full-img>img.horizontal {
    transform: rotate(90deg);
    width: 150%;
    height: 50%;
    top: 24%;
}


.xben-full-img .horizontal-btn {
    position: absolute;
    top: 65%;

}

@media screen and (min-width: 768px) {
    #collapsibleNavbar {

        display: flex;
        justify-content: flex-end;
    }
}

@media screen and (max-width: 768px) {
    .jigsaw .item {
        width: 100%;
        height: auto !important;
    }

    #walBox .note {
        bottom: 60px;
    }


    .jigsaw .item .oneImg {
        height: auto !important;
    }

    .jigsaw .item.oneImg {
        height: auto !important;
    }

    .jigsaw.onepage-wrapper {
        margin-top: 56px;
    }

    .onepage-wrapper .section {
        height: 50% !important;
    }

    .xben-day-img {
        height: auto;

    }

    .xben-from {
        margin-top: 10px;
    }

    .text-360 {
        width: 68% !important;
    }

    #walBox .note {
        position: relative;
        margin-top: 20px;
        bottom: 0;
        left: 0;
        text-shadow: none;
        color: #191919;
        padding: 10px;
        font-size: 20px;
    }

    #walBox .note>span:nth-of-type(1) {
        margin-bottom: 10px;
    }

    .xben-by-img {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 30px 0;
        flex-direction: column;

        padding: 0 5%;
    }

    .xben-by-img>img {
        width: 100%;
        border-radius: 16px;
        margin: 6px 0;
    }

    .xben-by-img>p {
        font-size: 14px;
        margin: 0 !important;
        margin-top: 6px !important;
        padding: 0 6px;
    }

    .xben-by-img>p:nth-of-type(2) {
        margin-top: 3px !important;
    }
}

/* 局部图样式 */
.carousel-item img {
    height: 100%;
    /* 可根据需要调整局部图高度 */
    object-fit: cover;
    /* 保持图片比例填充 */
}