*{
    margin: 0;
    padding: 0;
}
.logo_bar {
    width: 30px;
    height: 30px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 1px solid #aaaaaa;
    margin-top: -5px;
    background-color: #fff;
}

.logo_bar_bottom {
    width: 30px;
    height: 30px;
}

.logo_bar_sm {
    width: 18px;
    height: 18px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 1px solid #aaaaaa;
    margin-top: -2px;
}


.tbtd {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
}

.tbtd > .titlelable {
    width: 100px;
}

#id_category_sub {
    margin-left: 8px;
}

.industry {
    margin-bottom: 10px;
}

.btncard {
    /*padding: 10px;*/
    /*margin: 10px 0;*/

    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.bcard {
    width: 150px;
    height: 250px;
}

.bcard > img {
    width: 100%;
}


.baidumap {
    width: 100%;
    height: 250px;
    margin: 8px 0;
}


/*扫光*/
.ss {
    display: block;
    width: 2000px;
    height: 200px;
    /* width: 100%;
    height: 100%; */
    position: absolute;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, .8), rgba(0, 0, 0, 0));
    left: -1300px;
    top: 0;
    transform: rotate(-45deg) translate(0, 1300px);
    animation: saoguangc 3s linear infinite;
    -webkit-animation: saoguangc 3s linear infinite;
}

@-webkit-keyframes saoguangc {
    0% {
        transform: rotate(-45deg) translate(0, 1300px);
        -webkit-transform: rotate(-45deg) translate(0, 1300px);

    }

    100% {
        transform: rotate(-45deg) translate(0, 1300px);
        -webkit-transform: rotate(-45deg) translate(0, 1300px);
    }
}

@keyframes saoguangc {
    0% {
        transform: rotate(-45deg) translate(0, 100px);
        -webkit-transform: rotate(-45deg) translate(0, 100px);

    }

    100% {
        transform: rotate(-45deg) translate(0, 800px);
        -webkit-transform: rotate(-45deg) translate(0, 800px);
    }
}


/*扫光*/
.sss {
    display: block;
    width: 2000px;
    height: 300px;
    /* width: 100%;
    height: 100%; */
    position: absolute;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, .8), rgba(0, 0, 0, 0));
    left: -1300px;
    top: -500px;
    transform: rotate(-45deg) translate(0, 3300px);
    animation: saoguangcc 3s linear infinite;
    -webkit-animation: saoguangcc 3s linear infinite;
}

@-webkit-keyframes saoguangcc {
    0% {
        transform: rotate(-45deg) translate(0, 3300px);
        -webkit-transform: rotate(-45deg) translate(0, 3300px);

    }

    100% {
        transform: rotate(-45deg) translate(0, 3300px);
        -webkit-transform: rotate(-45deg) translate(0, 3300px);
    }
}

@keyframes saoguangcc {
    0% {
        transform: rotate(-45deg) translate(0, 100px);
        -webkit-transform: rotate(-45deg) translate(0, 100px);

    }

    100% {
        transform: rotate(-45deg) translate(0, 2800px);
        -webkit-transform: rotate(-45deg) translate(0, 2800px);
    }
}


.boli {
    position: relative;
    overflow: hidden;
}


.btn-small {
    padding: 2px;
    width: 20px;
    height: 20px;
    font-size: 12px;
    line-height: 14px;
    border-radius: 50%;
}


/*隐藏小按钮*/
.cell {
    position: relative; /* 使得绝对定位的按钮能够相对于这个单元格定位 */
}

.cell .button {
    display: none; /* 初始隐藏按钮 */
    position: absolute;
    top: 10px; /* 调整按钮的位置 */
    right: 5px; /* 调整按钮的位置 */
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: red;
    color: white;
    text-align: center;
    line-height: 18px;
    cursor: pointer;
    pointer-events: none;
    font-size: 13px;
}

.cell.hover .button {
    display: block; /* 当有hover类时显示按钮 */
}

#id_card_vr, #id_card_plat, #id_cardset, #id_wxchat {
    border: white;
    border-bottom: 1px skyblue solid;
    outline: none;
}

#imagePreview, #imageWxPreview {
    transition: 1s;
    width: 150px;
    height: 248px;
}

#myImage {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100px;
    z-index: 6001;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 50;
}

#myImage > img {
    width: 200px;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.category {
    display: flex;
    flex-direction: row;
    padding-left: 20px;
    width: 100%;
    margin-bottom: 80px;
}

.category_span {
    font-size: 24px;
    text-align: center;
    margin: 10px;

    border-radius: 5px;
    color: #333; /* 默认链接颜色 */
    text-decoration: none; /* 移除下划线 */

}

.category_a {
    background-color: #aaa;
    text-align: center;
    margin: 10px;
    padding: 5px;
    border-radius: 5px;
    color: #333; /* 默认链接颜色 */
    text-decoration: none; /* 移除下划线 */
    box-shadow: 5px 5px 5px #666666;
    transition: background-color 0.3s ease; /* 平滑过渡效果 */
}

.category_b {
    line-height: 40px;
}

.category_a:hover {
    color: #fff; /* 鼠标悬停时的颜色 */
    /*text-decoration: underline; !* 鼠标悬停时添加下划线 *!*/
    background-color: black;
    transition: color 0.3s ease; /* 平滑过渡效果 */
}

.shelf_top0 {
    background-image: url("/static/images/shelfbg_top0.jpg");
    background-size: 100% auto; /* 这里的100%将确保背景图片在水平方向上完全填充容器宽度，auto则允许高度自动调整 */
    height: 54px;
    margin-top: 55px;
}

.shelf_top {
    background-image: url("/static/images/shelfbg_top.jpg");
    background-size: 100% auto; /* 这里的100%将确保背景图片在水平方向上完全填充容器宽度，auto则允许高度自动调整 */
    height: 36px;
}

.shelf {
    background-image: url("/static/images/shelfbg.jpg");
    background-size: 100% auto; /* 这里的100%将确保背景图片在水平方向上完全填充容器宽度，auto则允许高度自动调整 */
    background-repeat: repeat-y; /* 这将确保背景图片在垂直方向上重复平铺 */
    padding: 20px;
    padding-top: 30px;
    margin-top: 0;

}

.shelf_bottom {

    /*height: 400px;*/
    width: 100%;
}

.shelf_bottom400 {

    height: 400px;
    width: 100%;
}

.ebookshelf {
    border-bottom: 20px solid #a17a4f;
    margin-bottom: 35px;
    box-sizing: border-box;
    box-shadow: 0 10px 0 #666;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.operation {
    width: 90%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    margin-bottom: 8px;
}

.box {
    width: 70%;
    height: 600px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);
    display: flex;
    /*position: fixed;*/
    /*position: absolute;*/
    /*top: 50%;*/
    /*left: 50%;*/
    /*transform: translate(-50%, -50%);*/

}

.left {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /*background:linear-gradient(to right, #65CBF7, #B3A5FC);*/
    color: white;
    padding: 20px;
    background-image: url("/static/images/box.webp");
    object-fit: cover;
    background-position: center;

}

.left > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.right {
    width: 50%;
    height: 100%;
    background-color: #fff;
    box-sizing: border-box;
    padding: 20px;
    text-align: center;
    position: relative;
}

.right .form-control > select {
    border: 0;
    outline: none;
    border-bottom: 3px solid skyblue;
}

/*pc*/
@media screen and (min-width: 960px) {
    .box {
        max-width: 950px;
        min-width: 750px;
    }
}

/*ipad*/
@media screen and (max-width: 960px) {
    .box {
        display: block;
        height: auto;
    }

    .left, .right {
        width: 100%;
        justify-content: center;
    }

    .right {
        padding: 2vw 2vw;
    }

    .left {
        height: 100px;
    }

    .notice {
        display: none;
    }

    .thumb_maga {
        display: none;
    }
}

/*移动*/
@media screen and (max-width: 750px) {
    .bbox {
        display: flex;
        flex-direction: column;
    }


    .box {
        width: 85%;

        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }


    .ad_zone {
        display: grid;
        grid-template-columns: repeat(4, 1fr); /* 3列，每列宽度相等 */
        grid-gap: 4px 8px; /* 水平和垂直间距 */
    }
    .ad_left{
        top: 80px;
        position: absolute;
        left: 8px!important;
        right: 10px;
        /*left: 50%;*/
        /*transform: translateX(-50%);*/
    }
    .ad_right{
        z-index: 0;
        position: absolute;
        left: 8px;
        right: 10px;
        bottom: 80px;
    }
    .adrow{
        width: 94px;
    }


    .left {
        height: 8px!important;
    }
    .left >h2{
        display: none;
    }
    .notice {
        display: none;
    }

    .thumb_maga {
        display: none;
    }

    .login_hidden {
        display: none;
    }

    .login_ad {
        width: 100% !important;
        /*display: none;*/

    }

    .content_list{
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        opacity: .95;
    }


}

.welcome {
    display: none;
}

.card {
    border: 0;
    border-radius: 0;
}

.card-body {
    text-align: center;

}

.card_nav {
    position: absolute;
    top: 60px;

    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    /*width: 80%;*/
    /*height: 80px;*/

}

.no-bullets {
    list-style-type: none;

}

.no-bullets > li {

    background-color: rgba(255, 255, 255, 0.5);
    margin: 6px;
    padding: 0 6px;
    border-radius: 5px
}


.bounce-button {
    cursor: pointer;
    /* 添加弹跳动画，动画执行一次（1次迭代） */
    animation: bounce 1s ease-out forwards;
}

@keyframes bounce {
    0% {
        transform: translateY(0);
        /* 起始时按钮无位移 */
    }
    50% {
        transform: translateY(-10px);
        /* 按钮在动画中间时向下移动10px */
    }
    100% {
        transform: translateY(0);
        /* 动画结束时按钮回到原位 */
    }
}

.thumb_maga {
    position: fixed;
    display: flex;
    align-items: center;
    /*justify-content: space-around;*/
    /*justify-content: center;*/
    width: 50%;
    overflow: auto;
    bottom: 70px;
    left: 50%;
    transform: translate(-50%);
    z-index: 2000;
}

.magazinepre {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 120px;
    padding: 2px;
    margin: 2px;

    left: 50%;
    transform: translate(-50%);


}

.slider {
    position: absolute;
    display: flex;
    /*justify-content: start;*/
    width: 100%;
    transition: transform 0.5s ease; /* 平滑过渡效果 */
    padding: 2px;
    margin: 2px;
    list-style: none;
    left: 50%;
    transform: translate(-50%);
}

.magazinepre > ul {
    display: flex;
    flex-direction: row;
    list-style: none;
}

.magazinepre > ul > li {

}


.thumbpre {
    cursor: pointer;
    /*border: none; !* 初始状态没有边框 *!*/
    /*padding: 1px;*/
    display: flex;
    flex-direction: row;
    margin-right: 10px;
    position: relative;
}


.thumbpre > img {
    cursor: pointer;
    border: none; /* 初始状态没有边框 */
    height: 100px;
}

.thumbpre.active {
    box-shadow: 0 0 4px 1px red;
    z-index: 100;
}

.thumbpre:hover {
    box-shadow: 0 0 4px 1px red;
    z-index: 100;
    opacity: 30%;
}

.thumb_page {
    position: absolute;
    color: white;
    left: 50%;
    font-size: 20px;
    top: 50%;
    opacity: 0.5;
    transform: translate(-50%, -50%);
    text-shadow: -1px -1px 0 black, /* 左上角边框 */ 1px -1px 0 black, /* 右上角边框 */ -1px 1px 0 black, /* 左下角边框 */ 1px 1px 0 black; /* 右下角边框 */
}
.text_stroke {
    color: white;
    text-shadow: -1px -1px 0 black, /* 左上角边框 */ 1px -1px 0 black, /* 右上角边框 */ -1px 1px 0 black, /* 左下角边框 */ 1px 1px 0 black; /* 右下角边框 */
}



/* 隐藏第一个和最后一个按钮外的多余内容（可选） */
#thumbpreList::before, #thumbpreList::after {
    content: "";
    flex: 0 0 auto;
    width: 50px; /* 类似于margin或padding */
}

#prevBtn {

    z-index: 200;
}

#nextBtn {
    z-index: 3000;
}


.btn_hidden_thumb {
    position: fixed;
    bottom: 80px;
    right: 25px;
    z-index: 2001;

}


.btn_hidden_content {
    position: fixed;
    bottom: 80px;
    left: 25px;
    z-index: 2001;

}

.btn_hidden {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #8cadd0;
    box-shadow: 0 0 2px #ffffff;

    display: flex;
    justify-content: center;
    align-items: center;
}

.next_card {
    position: fixed;
    bottom: 80px;
    left: 25px;
    z-index: 2002;

    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #8cadd0;
    box-shadow: 0 0 2px #ffffff;

    display: flex;
    justify-content: center;
    align-items: center;
}

.five {
    position: fixed;
    bottom: 80px;
    left: 65px;
    z-index: 2003;

    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #8cadd0;
    box-shadow: 0 0 2px #ffffff;

    display: flex;
    justify-content: center;
    align-items: center;
}

.ad_left {
    left: 0;
}

.ad_right {
    right: 0;
}

.ad_zone {
    width: 170px;
    /*background-color: #ddd;*/
    /*border: 1px solid #cccccc;*/
}

.login_adzone {
    position: absolute;
    width: 100%;

    right: 0;
    bottom: 0;
    overflow: hidden;
    background-color: #ddd;
}

.adrow{
    margin-bottom: 7px;
}

.adrow:last-child {
    margin-bottom: 0; /* 为.adrow内部的最后一个.chi元素设置margin-bottom为0 */
}

/*企业解说音乐*/
.voice_over{
    position: absolute;
    left: 35px;
    top: 60px;
    width: 30px;
    height: 30px;
    background-color: skyblue;
    border-radius: 50%;
    z-index: 1000;
    box-shadow: 0 0 2px #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: .5;
}

/*agent认证发布*/
.agent{
    position: absolute;
    right: 35px;
    top: 20px;
    width: 30px;
    height: 30px;
    /*background-color: skyblue;*/
    /*border-radius: 50%;*/
    z-index: 1000;
    /*box-shadow: 0 0 2px #ffffff;*/
    display: flex;
    justify-content: center;
    align-items: center;
    /*opacity: .5;*/
}





/* 针对现代浏览器（Chrome, Firefox, Safari, Opera等） */
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #cccccc;
}
:-moz-placeholder { /* Firefox 18- */
    color: #cccccc;
    opacity: 1; /* Firefox 需要 opacity: 1 来覆盖颜色 */
}
::-moz-placeholder { /* Firefox 19+ */
    color: #cccccc;
    opacity: 1; /* Firefox 需要 opacity: 1 来覆盖颜色 */
}
:-ms-input-placeholder { /* IE 10+ */
    color: #cccccc;
}

/* 针对你的特定input元素 */
.to_content::-webkit-input-placeholder {
    color: #cccccc;
}
.to_content:-moz-placeholder {
    color: #cccccc;
    opacity: 1;
}
.to_content::-moz-placeholder {
    color: #cccccc;
    opacity: 1;
}
.to_content:-ms-input-placeholder {
    color: #cccccc;
}



.bottom_arc{
    z-index: 100;
    position: relative;
    /*width: 100vw;*/
    /*height: 600px;*/
    /*overflow-x: hidden;*/
}

.bottom_big_arc{
    position: absolute;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);

    bottom: -45vh;

    width: 500px;
    height: 66vh;
    background: #000;
    opacity: .4;
    border-radius: 50%;
}

.bottom_little_arc{
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: -42vh;
    background: #2b4470;
    transform: translateX(-50%);
    width: 400px;
    height: 58vh;
    opacity: .8;
    border-radius: 50%;
}
.bottom_logo{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    right: 0;
    bottom: 2vh;
    width: 100px;
    height: 10vh;
    /*background: red;*/
}
.bottom_logo_bar{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #ffffff;
}
.bottom_card3d{
    position: absolute;
    left: 37%;
    transform: translateX(-50%);
    rotate: -45deg;
    right: 0;
    bottom: 12vh;
    width: 60px;
    color: white;
}
.bottom_ebook{
    position: absolute;
    left: 63%;
    transform: translateX(-50%);
    rotate: 45deg;
    right: 0;
    bottom: 7vh;
    width: 60px;
    color: white;
}
.bottom_vr{
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 50%);
    right: 0;
    bottom: 12vh;
    width: 60px;
    color: white;
    /*background: red;*/
    text-align: center;
}

.vr_active{
    border: 1px solid white;
    box-shadow: 0 0 10px 5px rgba(255, 0, 0, 0.8);
}


.vrnav {


}