.dynamics-div .dynamics-titles,
.page-div,
.detail-list-div,
.content-title-phone,
.detail-viedo-phone,
.header-banner,
.beautiful-div-phone,
.school-detail-div-phone {
  display: none;
}

.list-div,
.beautiful-div,
.div-view-viedo,
.school-detail-div-pc,
.detail-school .content-title,
.title-address,
.professional {
  display: block;
}

.carousel-inner .carousel-item {
  height: 330px;
}

.carousel-inner .carousel-item img {
  height: 100%;
}

.content {position: relative;}
.dynamics-div {margin-top: 40px;}
.dynamics .dynamics-title  {    
    width: 240px;
    height: 105px;
    padding-left: 20px;
    background-image: url("../newimage/university/title-bg.png");
    background-repeat: no-repeat;
    font-weight: bold;
    font-size: 30px;
    line-height: 87px;
    color: #fff;
}
.dynamics{ display: flex; align-items: flex-start; position: relative; }
.dynamics .child:first-child{ flex: 0 0 275px; margin-right: 40px; }
.dynamics .child:last-child{ flex: 1; min-width: 0; }

.detail{ position: relative;  margin-top: 20px; }
.menus{ position: relative; width: 240px; }

.menus-list .menus-item span::after{
    position: absolute; display: inline-block; top: 19px; right: 12px; content: " "; 
    background-image: url('../newimage/enrollmentGuide/san-slecet.png'); background-repeat: no-repeat; width: 14px; 
    height: 14px; vertical-align: middle; transition: all .2s; 
    transform: rotate(270deg);
}

.menus-list{ 
    display: block; width: 100%; background-repeat: no-repeat;background-size: cover; 
    padding: 0; background-position: center bottom; overflow-y: auto;
}
.menus-list .flex-block{ padding: 10px; }
.menus-list::-webkit-scrollbar { width: 6px; }
.menus-list::-webkit-scrollbar-thumb{ background-color: #c1c1c1; border-radius: 4px; }
.menus-list .menus-item{ 
    position: relative; display: block; border-bottom-width: 0;  height: 50px; line-height: 50px; 
    color: #333333; cursor: pointer; transition: all .2s;text-align: left; 
     padding-left: 8px;
     border-bottom: 3px solid #eee;
}
.menus-item span{ font-size: 18px; }

.menus-list .menus-item.actived,
.menus-list .menus-item:hover{ 
    border-bottom: 3px solid #9d1d22;
 }

.menu-sub-list .menu-sub-item:hover,
.menu-sub-list .menu-sub-item.actived span{ color: #9d1d22;  }


.menus-list .menus-item.actived span::after{ transform: rotate(-3deg); }

.menu-sub-list{ display: none; padding: 15px 0; }
.menu-sub-list .menu-sub-item{ 
    padding-left: 25px;  cursor: pointer; display: block; color: #7a7a7a; line-height: 2; 
    transition: all .2s; position: relative;
}
.menu-sub-list .menu-sub-item span{ font-size: 15px; }
.menu-sub-list .menu-sub-item span::before{ 
    content: ""; 
    display: inline-block;
    width: 23px;
    height: 17px;
}
.menu-sub-list .menu-sub-item:hover span::before,
.menu-sub-list .menu-sub-item.actived span::before{ 
    content: ""; 
    display: inline-block;
    width: 23px;
    height: 17px; vertical-align: middle;
    background-image: url('../newimage/enrollmentGuide/radio.png');
    background-repeat: no-repeat;
    position: relative;
    top: 0; right: 0;
}

.content-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 5px;    border-bottom: 3px solid #9d1d22; }
.content-title .title-text{ color: #9c1e22; font-size: 30px; font-weight: bold; }


.article-list{ padding: 20px 0; }
.article-list .article-item{ 
    display: block; line-height: 4; transition: color .2s; width: 100%;
    border-bottom: 1px solid #e7e7e7; position: relative;
}
.article-list .article-item::after{ content: " "; display: block; clear: both; }
.article-list .article-item  .article-title{ float: left; width: calc(100% - 100px); color: #666666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; font-weight: normal; }
.article-list .article-item  .article-date{ float: right; width: 90px; font-size: 18px; color: #666666; font-weight: normal; font-size: 14px; text-align: right; }
.article-list .article-item:hover span:last-child,
.article-list .article-item:hover span{ color: #9d1d22;}


/* 最美校园 */
.detail{  height: 100%; width:100%; padding: 0 0 20px; }

.detail-con-div {
    height: 511px;
    display: flex;
}

.detail-con--div-2 img,
.detail-con-div img{
    width: 100%;
    height: 100%;
}


.detail-right-div {
    margin-left: 20px;
}


.detail-con-div .img-right-div  {
    margin-top: 20px;
    display: flex;
}

.img-right-div .img-chamber,
.detail-left-div .img-yuelu-div {
    margin-left: 20px;
}

.detail-con--div-2 .detail-left-div,
.detail-con--div-2 {
    /* height: 500px; */
    margin-top: 20px;
}

.detail-con--div-2 .detail-left-div {
    display: flex;
}

.detail-left-div .img-takers {
    margin-top: 20px;
}


.detail-con--div-2 .detail-high,
.detail-con-div .detail-high{
    display: block;
    overflow: hidden;
    cursor: pointer;
    position:relative;
}




.detail-high span{display:none; text-decoration:none}

.detail-high:hover span{ 
    display:block;
    position:absolute; 
    bottom:0; 
    left:0;
    padding-left: 20px;
    color:#FFF;
    width:100%; 
    z-index:10;
    height:36px;
    font-size: 14px; 
    overflow: hidden; 
    text-overflow:ellipsis; 
    white-space: nowrap;
    font-weight: normal;
    line-height:36px; 
    background:url('../newimage/university/bg-high.png');
}


.detail-high img{
    width: 100%;
    height: 100%;
    transition: all 0.5s;
}

.detail-high img:hover{transform: scale(1.1);}

/* 学府印象 */
.details{ position: relative; margin-top: 50px; height: 100%; padding: 0 0 20px; }
.details .detail-cons{ 
    width: 100%;
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.detail-cons .detail-con-divs {
    width: 49%;
    cursor: pointer;
}

.detail-cons .detail-con-divs:nth-child(n+1) {
    margin-top: 15px;
}
.type-Menus .type-MenuItem:nth-child(2n){margin-right: 0; }

.detail-con-imgs {width: 100%; height: 275px; overflow: hidden;  }
.detail-con-imgs img {width: 100%; height: 100%; border-radius: 5px; transition: all 0.5s;}
.detail-con-imgs img:hover {transform: scale(1.1);}

.detail-con-divs .title-div { background: #eee;padding: 0 25px;line-height: 2.4;color: #333333;cursor: pointer;}


.title-div .title-div-title {  font-size: 18px; font-weight: bold;  color: #333333; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; border-radius: 0 0 5px 5px;}

.title-div .title-div-date { font-weight: normal; font-size: 14px; color: #333333; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}

.title-div .title-div-title:hover {color: #9d1d22}
.title-div .title-div-date:hover {color: #9d1d22}



/* 视频校园 */
.detail-viedo{ position: relative; margin-top: 50px; height: 100%; padding: 0 0 20px; }
.detail-viedo .detail-con-viedo{ 
    width: 100%;
    height: 1040px;
}

.detail-div {
  width: 100%;

  margin-bottom: 30px;
  overflow: hidden;
  cursor: pointer;
  position:relative;
}
.detail-div .detail-title { display:none; text-decoration:none;}





.detail-div:hover .detail-title { 
  display:block;
  position:absolute; 
  bottom:0; 
  left:0;
  padding-left: 20px;
  width:100%; 
  z-index:10;
  height:36px;
  overflow: hidden; 
  text-overflow:ellipsis; 
  white-space: nowrap;
  font-weight: bold; 
  font-size: 18px;
   color: #fff;
  line-height:36px; 
  background:url('../newimage/university/video-bg.png');
}

.detail-bg1 {
  width: 90px;
  height: 92px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url('../newimage/university/viedo-1-view.png');
}

.video-url{
  display: none;
}

.detail-div img {
  width: 100%;
  height: 100%;
  transition: all 0.5s;
}

.detail-div  img:hover {transform: scale(1.1);}



.detail-card {
  width: 100%;
  height: 220px;
  display: flex;
  flex-wrap: wrap;
}

.detail-card-div {
  width: 50%;
  display: flex;
  height: 100%;
  position: relative;
  cursor: pointer;
}

.detail-card .bg-title-div{
  width: 50%;
  height: 100%;
  background: #f8f8f8;
}


.detail-card .bg-title-div:hover {
  background: #9d1d22;
}

.detail-card-div img {
  width: 100%;
  height: 100%;
}

.card-div {
  overflow: hidden;
}

.detail-card-div .card-div img {
  width: 100%;
  height: 100%;
  transition: all 0.5s;
}

.detail-card-div .card-div img:hover {transform: scale(1.1);}

.detail-card-div .card-div {
  position: relative;
  width: 222px;
}


.detail-bg {
  width: 60px;
  height: 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url('../newimage/university/viedo-1-view.png') no-repeat;
  background-size: 80%;
}

.detail-card-div:nth-child(1) .bg-title-div .bg-div,
.detail-card-div:nth-child(2) .bg-title-div .bg-div{
    position: relative;
    top: 0;
    width: 100%;
    height: 100%;
    right: 9px;
    z-index: 1;
    background-image: url(../newimage/university/view-left.png);
    background-repeat: no-repeat;
}

.detail-card-div:nth-child(3) .bg-title-div .bg-div,
.detail-card-div:nth-child(4) .bg-title-div .bg-div{
    position: absolute;
    top: 0;
    width: 235px;
    height: 100%;
    left: 0;
    z-index: 4;
    background-image: url(../newimage/university/view-right.png);
    background-repeat: no-repeat;
}

.bg-title-div .bg-div-title {
  padding: 26px 20px 10px 20px;
  width: 100%;
  height: 100%;
}

.bg-title-div .bg-title {
  color: #9d1d22;
  display: block;
  margin-bottom: 15px;
  font-weight: bold;
  font-size: 18px;
}

 .bg-title-div .bg-title-cn {
  line-height: 2;
  color: #555555;
  font-size: 14px;
  display: block;
  font-weight: lighter;
}

.detail-card-div:nth-child(1) .bg-title-div:hover .bg-div,
.detail-card-div:nth-child(2) .bg-title-div:hover .bg-div {
  background-image: url('../newimage/university/view-left-select.png');
}

.detail-card-div:nth-child(3) .bg-title-div:hover .bg-div,
  .detail-card-div:nth-child(4) .bg-title-div:hover .bg-div {
  background-image: url('../newimage/university/view-right-select.png');
}

.detail-card-div .bg-title-div:hover .bg-title {
  color: #fff;
}

.detail-card-div .bg-title-div:hover .bg-title-cn {
  color: #fff;
}

.is-modal {display: none;}

.embed-responsive-16by9 {height: 200px; width: 200px;}

.modal-backdrops { position: fixed; top: 0; left: 0; padding-top: 72px; z-index: 50; width: 100vw; height: 100vh; background-color: #000; opacity: .5; }
.views { height: 100%; width:  100%; position: fixed; top: 0; left: 0; z-index: 60; display: flex; align-items: center; justify-content: center; transition: all .5s;}

.vido-position { position: relative;  width: 750px; }

.closes { cursor: pointer; font-size: 1.5rem; font-weight: 700; color: #000; text-shadow: 0 1px 0 #fff; opacity: .5; position: absolute; right: -43px; top: -10px; font-size: 35px;} 
.vido-position video{ object-fit: fill !important; }

.vido-position video:focus { outline: -webkit-focus-ring-color auto 0px;}



/* 优质生源第中学 */

.detail-school {
  position: relative;
  width: 100%;
}

.title-div-school {
  margin: 50px 0 0 0;
}

.title-div-school .menus-search {
  display: flex;
  height: 355px;
  cursor: pointer;
}

.menus-search .menus-list-search {
  width: 100%;
  padding: 0;
  color: #333333;
}

.title-div-school .title-address,
.searchs {
  color: #333333;
  font-weight: bold;
  font-size: 20px;
  width: 83px;
  height: 47px;
  line-height: 75px;
}

/**
* 专业介绍
**/
.table {
  border-radius: 5px 5px 0 0;
  text-align: center;
}

.table-title .table-left,
.table-title .table-right {
  width: 50%;
  text-align: center;
}

.table-bordered tr:nth-child(2) td {

}

.table-bordered th {
  border: none;
}

.table-bg {
  background: #eee;
}

.table .table-title {
  background: #9e1d22;
  font-weight: bold;
  font-size: 16px;
  color: #fff;
}

.table .table-content td {
  font-weight: normal;
  font-size: 18px;
  color: #333333;
}

.table td {
  vertical-align: inherit;
  padding: 0.4rem;
}

/* 通知公告 */
.article-list {
  padding: 20px 0;
}
.article-list .article-item {
  display: block;
  line-height: 4;
  transition: color 0.2s;
  width: 100%;
  border-bottom: 1px solid #e7e7e7;
  position: relative;
}
.article-list .article-item::after {
  content: " ";
  display: block;
  clear: both;
}
.article-list .article-item  .article-title {
  float: left;
  width: 80%;
  white-space: nowrap;
  color: #666666;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 18px;
  font-weight: normal;
}
.article-list .article-item  .article-date {
  float: right;
  width: 20%;
  font-size: 18px;
  font-weight: normal;
  font-size: 14px;
  color: #666666;
  text-align: right;
}
.article-list .article-item:hover span:last-child,
.article-list .article-item:hover span {
  color: #9d1d22;
}

.detail-list .detail-list-text-div {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.detail-list-text-div .list-text {
  margin-top: 1vw;
  font-size: 3.6vw;
  width: 80%;
}

.detail-list-text-div .list-img {
  width: 15vw;
  height: 15vw;
}

.detail-list-text-div .list-img img {
  width: 100%;
  height: 100%;
}

.pagination {
  text-align: center;
  align-items: center;
  justify-content: center;
  margin: 25px 0px 40px 0;
}
.pagination table {
  margin: 0 auto;
}
.pagination .item {
  display: inline-block;
  margin-right: 5px;
  font-size: 22px;
  font-weight: normal;
}
.pagination .item span {
  font-size: 22px;
  font-weight: normal;
}
.pagination .item.input input,
.pagination .item {
  color: #666 !important;
  font-weight: normal;
  width: 50px;
  height: 50px;
  line-height: 50px;
  min-width: 30px;
  transition: all 0.2s;
  padding: 0;
  border-radius: 0;
}
.pagination .item.input input {
  margin-right: 5px;
  box-sizing: border-box;
  text-align: center;
}

.pagination .items span {
  font-size: 16px;
  font-weight: normal;
  color: #888888;
}

.pagination .items span:last-child {
  font-weight: 800;
  margin-left: 30px;
}

.pagination .items span:nth-child(2) input {
  display: inline-block;
  border-radius: 0;
  width: 60px;
}

.pagination a:nth-child(9) {
  display: inline-block;
  background-image: url("../newimage/university/right.png");
  background-repeat: no-repeat;
  background-position: center center;
}

.pagination a:nth-child(9):hover {
  background-image: url("../newimage/university/right-select.png");
}

.pagination .items {
  margin-left: 60px;
}

.pagination .items span:last-child:hover {
  color: #9c1e22;
  cursor: pointer;
  font-weight: 800;
}

.pagination .item:hover {
  color: #9d1d22 !important;
}
.pagination .item:active {
  color: #9d1d22 !important;
}

.footer-botton-bg {
  display: block;
  position: absolute;
  bottom: 65px;
  right: 73px;
  width: 73px;
  height: 73px;
  background-image: url("../newimage/footer/footer-botton-bg.png");
  background-repeat: no-repeat;
}
.footer-botton-bg::after {
  content: " ";
  background-image: url("../newimage/footer/footer-top.png");
  width: 60px;
  height: 41px;
  display: inline-block;
  background-repeat: no-repeat;
  position: relative;
  top: 25px;
  left: 14px;
}

.detail-con {
margin-top:20px
}

.detail-con a:hover
{
color:#9e1d22 !important;
}
@media (max-width: 576px) {
  body {
    background: #f7f7f7;
  }
  .professional,
  .detail,
.beautiful-div,
  .list-div,

  .school-detail-div-pc .details,
  .title-address,
  .div-view-viedo,
  .detail-school .content-title,
  .footer-botton-bg {
    display: none;
  }

  .page-div,
  .school-detail-div-phone,
  .detail-list-div,
  .detail-viedo-phone,
.header-banner,
.beautiful-div-phone,
  .dynamics-div .dynamics-titles {
    display: block;
  }

  #carouselExampleFade {
    animation: none;
  }

  .carousel-inner .carousel-item {
    height: 40vw;
  }

  .dynamics-div {
    margin-top: 0;
    padding: 0 5vw 6vw 5vw;
    background: #f7f7f7;
    position: relative;
    top: -6vw;
    z-index: 1;
    border-radius: 7vw 7vw 0 0;
  }

  .table {
    background: #fff;
  }

  .table-title th {
    font-size: 13px;
  }

  .table .table-content td {
    font-size: 12px;
  }

  .dynamics-div .dynamics-titles {
    font-size: 5.5vw;
    font-weight: 800;
    padding: 2.5vw 0;
  }




  .page-div {
    height: 10vw;
    position: relative;
  }
  .detail-list-div {
    width: 100%;
  }

  .detail-list-div .detail-list {
    padding: 4vw;
    margin-bottom: 5vw;
    background: #fff;
    border-radius: 2.5vw;
  }

  .detail-list .detail-list-date {
    margin-right: 1.6vw;
    width: 3.3vw;
    height: 3.3vw;
  }

  .detail-list .detail-list-title div {
    font-size: 3.4vw;
    color: #888888;
  }

  .detail-list-date img {
    height: 100%;
    width: 100%;
    vertical-align: middle;
  }

  .detail-list .detail-list-text {
    margin-top: 1vw;
    font-size: 3.6vw;
  }

  .detail-list .list-text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 11vw;
    overflow: hidden;
  }

  .detail-list .detail-list-text span {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    height: 11vw;
    overflow: hidden;
  }

  .detail-list-div .detail-list-title {
    display: flex;
    align-items: baseline;
  }

  .detail-footer {
    text-align: right;
  }


  .title-div-school {
    margin-top: 5vw;
  }


  .content-title-phone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 3vw;
    border-bottom: 0.1vw solid #DCDCDC;
  }
  .content-title-phone .title-text-phone {
    color: #9c1e22;
    font-size: 5vw;
    font-weight: bold;
  }


  .header-div-img .detail-div {
    height: 54vw;
    margin-bottom: 3vw;
  }

  .header-div-img .detail-bg1 {
    background-repeat: no-repeat;
  }




  .div-phone {
    margin-top: 4vw;
    width: 100%;
    display:  flex;
    flex-wrap: wrap;
    position: relative;
  }


  .div-phone .div-img-div-phone {
    width: calc(100%/ 2);
  }


  .div-phone .card-div-phone {
    margin-bottom: 5vw;
  }


  .div-img-div-phone:nth-child(4) .card-div-phone .card-img-phone,
.div-img-div-phone:nth-child(2) .card-div-phone .card-img-phone {
  margin-left: 2.2vw;
}

.div-img-div-phone:nth-child(4) .card-div-phone  .title-text,
.div-img-div-phone:nth-child(2) .card-div-phone  .title-text {
  padding: 0 3vw;
}


  .card-div-phone .card-img-phone {
    width: 43vw;
    height: 44vw;
    position: relative;
  }


  .title-text .title-phone {
     display: inherit;
    font-size: 4vw;
    font-weight: 800;
    margin: 1.5vw 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }


  .title-text .title-text2-phone {
    font-size: 2vw;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

  .div-img-div-phone img {
  border-radius: 3vw;
  width: 100%;
  height: 100%;
  }


  
  #view-modal-phone .views {
    top: 56vw;
    left: 7vw;
  }

  #view-modal-phone  .closes  {
    right: 14vw;
    top: -10vw;
  }

  #view-modal-phone .vido-position video {
    width: 85%;
    height: 60vw;
  }



  .beautiful-div-phone div {
    font-size: 3vw;
  }


  .beautiful-div-img1 {
    display: flex;
    width: 100%;
  }



  .beautiful-img1-left {
    width: 50%;
    height:  100%;
  }

  .beautiful-img1-east {
    height: 70.5vw;
  }


  .beautiful-div-phone img {
    width: 100%;
    height: 100%;
  } 

  .beautiful-img1-left .beautiful-img1-courtyard {
    height: 30vw;
  }

  .beautiful-img1-right {
    margin-left: 2vw;
  }

  .beautiful-img1-left .beautiful-img1-high {
    height: 30vw;
  }

  .beautiful-img1-left .beautiful-img1-div {
    margin-top: 3.5vw;
  }

  .beautiful-img2-div {
    margin-top: 3vw;
  }

  .beautiful-img2-div .beautiful-img2-gakkai  {
    height: 38vw;
  }


/*移动端图片、视频、表格宽高度限制*/

.detail-con img
{
width:100% !important;
height:100% !important;
}

.detail-con video
{
width:100% !important;
height:100% !important;
}

.detail-con table {
            table-layout: fixed !important;
            width: 100% !important;
            border-collapse:collapse;
            border:none;
            font-size:0.23rem;
        }
 
.detail-con td,th {
            width:1px;
            white-space:nowrap; /* 自适应宽度*/
            word-break:keep-all; /* 避免长单词截断，保持全部 */
            border:solid #676767 1px;
            text-align:center;
            white-space:pre-line;
            word-break:break-all !important;
            word-wrap:break-word !important;
            display:table-cell;
            vertical-align:middle !important;
            white-space: normal !important;
            height:auto;
            vertical-align:text-top;
            padding:2px 2px 0 2px;
            display: table-cell;
        }

  /* 分页 */
  .pagination {
    margin: 16px 0;
    width: 95vw;
    position: absolute;
    bottom: -11vw;
    left: 0vw;
  }
  .pagination .item:nth-child(1) {
    width: 25vw;
  }

  .pagination .item,
  .pagination .item span {
    font-size: 14px;
  }
}