.header { border-bottom: 2px dashed #ECECEC; }

.main { width: 100%; position: relative; margin-top: 128px; }

.main .main-in { width: 100%; max-width: 1200px; margin: 0 auto; overflow: hidden; }

.main .main-in .main-in-link { margin-top: 13px; }

.main .main-in .main-in-link a { color: #666666; font-size: 12px; }

.main .main-in .main-videos { width: 100%; margin: 55px auto 0; }

.main .main-in .main-videos .main-videos-top { max-width: 600px; margin: 0 auto; display: flex; justify-content: space-between; margin-bottom: 33px; }

.main .main-in .main-videos .main-videos-top > p { font-size: 30px; font-weight: bold; }

.main .main-in .main-videos .main-videos-top .main-videos-top-classification { display: flex; }

.main .main-in .main-videos .main-videos-top .main-videos-top-classification div { width: 104px; height: 32px; background: white; border: 1px solid #999; }

.main .main-in .main-videos .main-videos-top .main-videos-top-classification div p { color: #666; text-align: center; line-height: 32px; }

.main .main-in .main-videos .main-videos-top .main-videos-top-classification div:first-child { margin-right: 16px; }

.main .main-in .main-videos .main-videos-middle { width: 100%; position: relative; }

.main .main-in .main-videos .main-videos-middle > div:first-child { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }

.main .main-in .main-videos .main-videos-middle > div:first-child .main-videos-mImg { transition: all 0.5s linear; width: 100%; max-width: 1000px; display: flex; justify-content: center; }

.main .main-in .main-videos .main-videos-middle > div:first-child .main-videos-mImg img { width: 100%; height: 100%; object-fit: cover; }

.main .main-in .main-videos  .main-detail-img {
  display: flex; justify-content: flex-start; margin-bottom: 24px; flex-wrap: wrap;
}

 .main .main-in .main-videos  .main-detail-img p{
  width: 100%; 
  
}

 .main .main-in .main-videos  .main-detail-img p img{
   display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.main .main-in .main-videos .main-videos-bottom {  margin-top: 57px; display: flex; justify-content: space-between; margin-bottom: 81px; align-items: center; }

.main .main-in .main-videos .main-videos-bottom > div{
  width: 70%;
}

.main .main-in .main-videos .main-videos-bottom > div:first-child{
  width: 20%;
}

.main .main-in .main-videos .main-videos-bottom  div img{
  width: 100%;
}

.main .main-in .main-videos .main-videos-bottom > div:first-child > p { color: #666666; font-size: 18px; font-weight: bold; margin-bottom: 20px; }

.main .main-in .main-videos .main-videos-bottom > div:first-child > div { display: flex; }

.main .main-in .main-videos .main-videos-bottom > div:first-child > div > div { display: flex; align-items: center; color: #666666; }

.main .main-in .main-videos .main-videos-bottom > div:first-child > div > div p { color: #666666; margin-left: 11px; }

/* .main .main-in .main-videos .main-videos-bottom > div:first-child > div > div:last-child { margin-left: 30px; } */

.main .main-in .main-videos .main-videos-bottom > div:last-child { font-size: 14px; color: #999999;  }

.main .main-in .main-bottom > p { font-weight: bold; color: #666666; }

.main .main-in .main-bottom .main-bottom-ul { margin-top: 24px; display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; }

.main .main-in .main-bottom .main-bottom-ul li { background: white; box-shadow: 8px 8px 20px rgba(0, 0, 0, 0.05); margin-bottom: 38px; margin-right: 2%; flex: 0 0 23%; float: none; cursor: pointer; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-topImg {width: 100%;height: 155px;object-fit: cover; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText { padding: 16px 12px 0 15px; box-sizing: border-box; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText > p { color: #333333; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details { color: #999999; font-size: 14px; margin-top: 13px; display: flex; justify-content: space-between; margin-bottom: 10px; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details div { display: flex; justify-content: space-between; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details div p { white-space: nowrap; color: #999999; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details div p:nth-child(1) { margin-right: 5px; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details div { float: right; display: flex; flex-direction: row; justify-content: center; align-items: center; height: 100%; }

.main .main-in .main-bottom .main-bottom-ul li .videos-main-btmText .btmText-details div img { height: 100%; margin-right: 3px; }

.main .main-in .main-bottom .main-bottom-ul li:nth-child(4n) { margin-right: 0; }

@media screen and (max-width: 768px) { .header .header-address { display: none; }
  .header .header-in { margin-top: 17px !important; }
  .main { margin-top: 68px; }
  .main .main-in .main-videos { margin: 20px auto 0; }
  .main .main-in .main-videos .main-videos-top { width: 90%; flex-direction: column; align-items: center; }
  .main .main-in .main-videos .main-videos-top p { margin-bottom: 10px; }
  .main .main-in .main-videos .main-videos-middle { height: auto; }
  .main .main-in .main-videos .main-videos-middle > div:first-child .main-videos-mImgOne, .main .main-in .main-videos .main-videos-middle > div:first-child .main-videos-mImgThr { display: none; }
  .main .main-in .main-videos .main-videos-middle > div:first-child .main-videos-mImg { width: 100%; height: auto; position: relative; }
  .main .main-in .main-videos .main-videos-middle .main-videos-direction { z-index: 2; }
  .main .main-in .main-videos .main-videos-bottom {  width: 90%;  flex-wrap: wrap; justify-content: center; margin: 30px auto;}
  .main .main-in .main-videos .main-videos-bottom > div { text-align: center; width: 100%;margin-bottom: 30px;}
  .main .main-in .main-in-link { width: 90%; margin: 13px auto 0; }
  .main .main-in .main-bottom { width: 90%; margin: 0 auto; }
  .main .main-in .main-bottom .main-bottom-ul { justify-content: center; }
  .main .main-in .main-bottom .main-bottom-ul li { flex: 0 0 100%; margin-right: 0; } 
  .main .main-in .main-videos  .main-detail-img {
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
   .main .main-in .main-videos  .main-detail-img div{
    width: 90%;
    margin: 0 auto; 
    /* margin-bottom: 38px; */
  }
}
