.arshine-about {
  padding: 75px 0 0;
}
.arshine-about h2 {
  font-size: 50px;
  color: var(--color-primary);
  line-height: 1;
  text-align: center;
}
.arshine-about h2::after {
  content: "";
  background: var(--color-primary);
  width: 40px;
  height: 4px;
  margin: 11px auto 0;
  display: block;
}

.arshine-about .txt {
  margin: 50px 0 0;
  line-height: 24px;
  font-size: 16px;
  color: #666666;
  overflow: hidden;
}
.arshine-about .txt p ~ p {
  margin-top: 15px;
}
.arshine-about .v {
  width: 44.5%;
  position: relative;
  display: block;
  overflow: hidden;
  float: right;
  margin: 0 0 20px 30px;
}
.arshine-about .v img {
  width: 100%;
  display: block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.arshine-about .v .play{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.arshine-about .v:hover img {
  transform: scale(1.05);
  -webkit-transform: scale(1.05);
}

@media screen and (max-width: 1441px) {
  .arshine-about h2 {
    font-size: 48px;
  }
}

@media screen and (max-width: 1367px) {
  .arshine-about h2 {
    font-size: 44px;
  }
  .arshine-about {
    padding: 60px 0 0;
  }
}

@media screen and (max-width: 1281px) {
  .arshine-about h2 {
    font-size: 40px;
  }
}

@media screen and (max-width: 1171px) {
  .arshine-about h2 {
    font-size: 36px;
  }
}

@media screen and (max-width: 992px) {
  .arshine-about h2 {
    font-size: 32px;
  }
}

@media screen and (max-width: 768px) {
  .arshine-about h2 {
    font-size: 28px;
  }

  .arshine-about {
    padding: 30px 0 0;
  }
  .arshine-about .txt {
    margin: 20px 0;
  }
  .arshine-about .txt p ~ p {
    margin-top: 10px;
  }
  .arshine-about .v {
    width: 100%;
    float: none;
    margin: 0 0 20px;
  }
}

@media screen and (max-width: 600px) {
  .arshine-about h2 {
    font-size: 26px;
  }
}

@media screen and (max-width: 480px) {
  .arshine-about h2 {
    font-size: 24px;
  }
}


/*上部分菜单*/
.menu-tab {background: rgba(49,49,49,.4);position: absolute;top: 66px;left: 0;width: 100%;z-index: 10;}
.menu-tab ul {display: flex;align-items: center;justify-content: center;}
.menu-tab ul li {position: relative;text-align: center;padding: 0 55px;box-sizing: border-box;font-size: 18px;color: #fff;font-weight: 500;transition: all .5s ease;overflow: hidden;}
.menu-tab ul li .btns {display: block;color: inherit;line-height: 85px;text-decoration: none;overflow: hidden;height: 85px;}
.menu-tab ul li+li::before {content: '';width: 1px;height: 16px;background: #CBCBCB;position: absolute;top: calc(50% - 8px);left: 0;}
.menu-tab ul li:last-child::after {content: '';width: 0px;height: 16px;background: #CBCBCB;position: absolute;top: calc(50% - 8px);right: 0;}

.menu-tab ul li .btns:hover::before,.menu-tab ul li .btns.active::before{content:attr(data-text);display: flex;justify-content: center;align-items: center;position: absolute;width: 100%;height: 100%;left: 0;top: 0;color: #fff;background: var(--color-primary);animation: animation_btn1 .4s ease-in-out;}
@keyframes animation_btn1{
  0% {width: 100%;height: 100%;transform: translate(0%, 100%);}
  30% {width: 100%;height: 100%;}
  100% {width: 100%;height: 100%;transform: translate(0%, 0%);}
}

@media screen and (max-width: 1550px) {
.menu-tab ul li {padding: 0 45px;font-size: 17px;}
.menu-tab ul li .btns {line-height: 75px;height: 75px;}
}
 
@media screen and (max-width: 1440px) {
}
                                          
@media screen and (max-width: 1367px) {
.menu-tab ul li {padding: 0 35px;font-size: 16px;}
.menu-tab ul li .btns {line-height: 65px;height: 65px;}
}
                                    
@media screen and (max-width: 1280px) {
}
                                
@media screen and (max-width: 992px) {
.menu-tab {display: none;}
.menu-tab ul li {padding: 0 20px;font-size: 15px;width: 33.333%;}
.menu-tab ul li .btns {line-height: 50px;height: 50px;}
}
                                
@media screen and (max-width: 768px) {
.menu-tab ul {flex-wrap: wrap;}
.menu-tab ul li {width: 50%;}
.menu-tab ul li::before {display: none;}
.menu-tab ul li:last-child::after {display: none;}
}


.factory-list {position: relative;padding-top:85px;}
.factory-list .video {position: fixed;top: 240px;left: 135px;width: 380px;z-index: 100;}
.factory-list .video .video-item {position: relative;border-radius: 30px;overflow: hidden;display: inline-block;border: 3px solid #303232;z-index: 999;}
.factory-list .video .video-item img {object-fit: cover;aspect-ratio: 16/9;}
.factory-list .video .video-icon {width: 40px;height: 40px;border-radius: 50%;display: flex;align-items: center;justify-content: center;color: #fff;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 10;}
.factory-list .video .video-icon::after {background: var(--color-primary);content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);border-radius: 50%;z-index: -1;width: 100%;height: 100%;}
.factory-list .video .video-icon::before {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);border-radius: 50%;background: rgba(255, 255, 255, 0.6);transition: all 0.3s ease;animation: breathePlay 2s ease-in-out infinite;z-index: -1;}
@keyframes breathePlay {
0%, 100% {width: 40px;height: 40px;opacity: 0.6;}
50% {width: 56px;height: 56px;opacity: 0.5;}
}
.factory-list .video .video-title {font-size: 24px;font-weight: 600;color: #fff;margin-left: 10px;flex: 1;}

.factory-list .box {height: 83vh;position: relative;overflow: hidden;background-size: cover;background-attachment: fixed;background-repeat: no-repeat;display: flex;align-items: center;justify-content: center;}
.factory-list .box::after {content:'';position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 0;background: rgba(0,0,0,.36);}
.factory-list .box h5 {text-align: center;color: #fff;position: relative;z-index: 10;line-height: 1;font-weight: 700;}

@media screen and (max-width: 1550px) {
.factory-list .video {top: 210px;left: 50px;width: 340px;}
.factory-list .video .video-icon {width: 36px;height: 36px;}
.factory-list .video .video-icon i {font-size: 14px;}
}
                                      
@media screen and (max-width: 1367px) {
.factory-list .video {top: 180px;left: 20px;width: 300px;}
.factory-list .video .video-icon {width: 32px;height: 32px;}
.factory-list .video .video-icon i {font-size: 12px;}
}
                                    
                                
@media screen and (max-width: 992px) {
.factory-list {padding-top: 0;}
.factory-list .video {top: 100px;left: 10px;width: 240px;}
.factory-list .video .video-icon {width: 30px;height: 30px;}
.factory-list .box{height:100%;background-size:100%;aspect-ratio:1.7777 / 1;background-attachment:scroll;}
}
                                
@media screen and (max-width: 768px) {
.factory-list .video {width: 200px;right: 10px;left: auto;bottom: 20px;top: auto;}
}
