/* 大屏幕下导航栏样式（水平排列） */
@media screen and (min-width: 769px) {
  .container {
    /* background-image: url("http://192.168.1.23:8012/static/freemarker/template/1/1121260742838849536/images/culture/组 25.png"); */
    background-image: url("/static/freemarker/template/1/1121260742838849536/images/culture/组/ 1.png");
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    background-size: auto;
    background-position: 2% 30%;
    padding-top: calc(134/1920*100vw);
    padding-left: calc(134.4 / 1920 * 100vw);
  }

  .yd {
    display: none !important;
  }

  .img-jt {
    display: none;
    width: calc(48 / 1920* 100vw);
    height: calc(30 / 1920* 100vw);
    margin-left: calc(590 / 1920* 100vw);
    margin-top: calc(-15 / 1920* 100vw);
  }

  .img-disn {
    display: none;
  }

  .img-disb {
    display: block;
  }

  .yas {
    margin-left: calc(30 / 1920 * 100vw);
    margin-top: calc(10 / 1920 * 100vw);
    background-color: white;
    height: 1px;
    width: calc(120 / 1920 * 100vw);
  }

  .yas-red {
    background-color: red;
    /* border-block-color: red; */
    height: 2px;
    width: calc(40 / 1920 * 100vw);
    margin-top: calc(10 / 1920 * 100vw);
    margin-left: calc(30 / 1920 * 100vw);
  }

  .container-yd-img1 {
    display: none;
  }

  .container-yd {
    display: none;
  }

  .item {
    transition: transform 0.3s ease;
    cursor: pointer;
    margin-top: calc(100 / 1920 * 100vw);
    margin-left: calc(10 / 1920 * 100vw);
    width: calc(192 / 1920 * 100vw);
    height: calc(700 / 1920 * 100vw);
    background-size: cover;
    background-position: center;
    position: relative;
  }

  .item_dis {
    margin-top: calc(450 / 1920 * 100vw);
  }

  .item_dis_1 {
    color: white;
    font-size: calc(30 / 1920 * 100vw);
    font-weight: bold;
    margin-top: calc(10 / 1920 * 100vw);
    margin-left: calc(30 / 1920 * 100vw);
  }

  .item_dis_2 {
    color: white;
    font-size: calc(20 / 1920 * 100vw);
    margin-top: calc(10 / 1920 * 100vw);
    margin-left: calc(20 / 1920 * 100vw);
  }

  .item_dis_3 {
    color: white;
    font-size: calc(15 / 1920 * 100vw);
    margin-top: calc(10 / 1920 * 100vw);
    margin-left: calc(20 / 1920 * 100vw);
  }

  .item:hover,
  .item:focus {
    width: calc(776 / 1920 * 100vw);
    height: calc(700 / 1920 * 100vw);
  }

  .active2 {
    width: calc(776 / 1920 * 100vw);
    height: calc(700 / 1920 * 100vw);
  }

  .active2_dis {
    margin-top: calc(550 / 1920 * 100vw);
    border-radius: 30px 0 0 0;
    margin-left: calc(96 / 1920 * 100vw);
    height: calc(150 / 1920 * 100vw);
    background-size: cover;
    background-position: right;
    background-image: url("/static/freemarker/template/1/1121260742838849536/images/culture/组 3.png");
  }

  .active2_dis_flex {
    margin-left: calc(20 / 1920* 100vw);
    height: calc(110 / 1920* 100vw);
    /* height: calc(50 / 1920 * 100vw);
    display: flex;
    align-items: flex-end;
    justify-content: left; */
  }

  .item_text {
    position: absolute;
    color: white;
    font-size: calc(15 / 1920 * 100vw);
    margin-top: calc(30 / 1920 * 100vw);
    margin-left: calc(30 / 1920 * 100vw);
    margin-bottom: calc(10 / 1920 * 100vw);
    display: none;
  }

  .div_dis {
    margin-top: calc(550 / 1920 * 100vw);
  }

  .active2,
  .active2_item-text {
    display: block;
  }
}

/* 小屏幕下导航栏样式（水平滑动） */
@media screen and (max-width: 768px) {
  .container-yd {}

  .container {
    display: none;
  }

  .container-yd-img1 {
    margin-left: calc(292 / 768 * 100vw);
    margin-top: calc(50 / 768 * 100vw);
    margin-bottom: calc(50 / 768 * 100vw);
    width: calc(192 / 768 * 100vw);
  }

  /* 按钮容器样式，使其内部元素水平居中且有距离排列 */
  .button-container {
    position: relative;
    top: calc(900 / 768 * 100vw);
    z-index: 2;
    display: flex;
    justify-content: space-evenly;
    gap: calc(10 / 768 * 100vw);
    margin-bottom: calc(20 / 768 * 100vw);
    align-items: flex-end;
    width: 100vw;
  }

  .content-container {
    position: relative;
    top: 0;
  }

  /* 模拟按钮的基本样式，去除边框、、、配景透明，利便展示图片样式 */
  .nav-button {
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
  }

  /* 给元素内图片添加过渡动画效果，用于图片切换时的平滑过渡 */
  .img1 {

    width: calc(118 / 768* 100vw) !important;
    height: calc(64 / 768* 100vw) !important;
  }

  .nav-button img {
    width: calc(40 / 768 * 100vw);
    height: calc(40 / 768 * 100vw);
    transition: all 0.3s ease;
  }

  /* 选中元素（active类）时，元素内图片添加蓝色边框效果，可凭证喜欢调解样式 */
  .nav-button.active img {}

  /* 初始隐藏所有内容页 */
  .content-page-yd {
    display: none;
  }

  .content-page-yd>div {
    height: 100%;
  }

  /* 让第一个内容页默认显示 */
  .content-page-yd:first-child {
    height: calc(1200 / 768 * 100vw);
    display: block;
  }

  .container-img {
    object-fit: cover;
    border-radius: 0 calc(100 / 768 * 100vw) 0 0;
    width: 100vw;
    height: calc(1190 / 768 * 100vw);
  }

  .container-img1 {
    width: 100vw;
    position: relative;
    height: calc(222 / 768* 100vw);
    bottom: calc(222 / 768* 100vw);
    background-color: #d70e18;
    opacity: 0.8;
    border-radius: calc(40 / 768* 100vw) 0 0 0;
  }

  .item_dis {
    position: absolute;
    left: calc(40 / 768 * 100vw);
    top: calc(20 / 768 * 100vw);
  }

  .item_dis_1 {
    color: #ffffff;
        font-size: calc(34 / 768* 100vw);
        font-weight: bold;
        margin-top: calc(10 / 768* 100vw);
        margin-left: calc(20 / 768* 100vw);
  }

  .item_dis_2 {
    color: #ffffff;
    font-weight: bolder;
    font-size: calc(40 / 768 * 100vw);
    margin-top: calc(10 / 768 * 100vw);
    margin-left: calc(20 / 768 * 100vw);
  }

  .item_dis_3 {
    display: flex;
        color: #ffffff;
        letter-spacing: calc(10 / 768* 100vw);
        font-size: calc(30 / 768* 100vw);
        margin-top: calc(10 / 768* 100vw);
        margin-left: calc(20 / 768* 100vw);
        justify-content: space-between;
  }

  .item_text {
    position: absolute;
    left: calc(50 / 768 * 100vw);
    font-size: calc(25 / 768 * 100vw);
    letter-spacing: calc(5 / 768 * 100vw);
    width: calc(690 / 768 * 100vw);
    top: calc(1000 / 768 * 100vw);
    color: white;
  }
}<!--耗时1767350377.7058秒-->