body {margin: 0;padding: 0;font-family: 'Poppins',Arial, Helvetica, sans-serif;font-weight: 400;}    
h1,h2,h3,h4,h5,h6,strong,b {font-family: 'Poppins',Arial, Helvetica, sans-serif;font-weight: 600;margin: 0;padding: 0;}
a {text-decoration: none;color: #000;}



.sh-video-banner {position: relative;overflow: hidden;}
.sh-video-banner-text {position: absolute;left: 50%;top: 55%;transform: translate(-50%,-50%);z-index: 11;text-align: center;color: #fff;} 
.sh-video-banner-text .title-1 {overflow: hidden;}
.sh-video-banner-text .title-1 h1 {font-size: 48px;}  
.sh-video-banner-pic {position: relative;}
.sh-video-banner-pic img {display: block;width: 100%;height: auto;} 
.sh-video-banner-pic img:last-child {display: none;}
.sh-video-section {padding: 5% 0;overflow: hidden;}
.sh-video-content {width: 76%;margin: auto;display: flex;flex-wrap: wrap;}
.sh-video-content-left {width: 17%;}
.sh-video-content-right {margin-left: 3%;width: 80%;}
.sh-video-content-nav {position: relative;background: #f6f6f6;border-radius: 10px;}
.sh-video-content-nav ul {list-style: none;padding: 10%;margin: 0;overflow: hidden;}
.sh-video-content-nav ul li{list-style: none;padding: 10px 0;margin: 0;}
.sh-video-content-nav ul li a{display: flex;align-items: center;}
.sh-video-content-nav ul li i{width: 20px;height: 20px;display: block;position: relative;margin-right: 10px;}
.sh-video-content-nav ul li i::before {content: '';width: 100%;height: 100%;border: 1px solid #ccc;position: absolute;left: 0;top: 0;border-radius: 100%;box-sizing: border-box;}
.sh-video-content-nav ul li i::after {content: '';width: 100%;height: 100%;position: absolute;left: 0;top: 0;border-radius: 100%;background-image: -moz-linear-gradient( 0deg, rgb(44,51,104) 31%, rgb(28,130,134) 71%, rgb(77,181,96) 94%);background-image: -webkit-linear-gradient( 0deg, rgb(44,51,104) 31%, rgb(28,130,134) 71%, rgb(77,181,96) 94%);background-image: -ms-linear-gradient( 0deg, rgb(44,51,104) 31%, rgb(28,130,134) 71%, rgb(77,181,96) 94%);opacity: 0;}
.sh-video-content-nav ul li strong {color: #666;}
.sh-video-content-nav ul li.cur i::before {background: #fff;transform: scale(0.6);border: none;z-index: 11;}
.sh-video-content-nav ul li.cur i::after {opacity: 1;}
.sh-video-content-nav ul li.cur strong,.sh-video-content-nav ul li a:hover strong{color: #000;}
.sh-video-content-nav ul li a:hover i::before {border: 1px solid #333;}
.sh-video-nav-list {position: relative;overflow: hidden;}
.sh-video-nav-list ul {list-style: none;padding: 5% 10%;margin: 0;overflow: hidden;}
.sh-video-nav-list ul li {list-style: none;padding: 0;margin: 0;position: relative;}
.sh-video-nav-list ul li::before {content: '';width: 6px;height: 6px;display: block;position: absolute;left: -14px;top: 10px;background: #333;opacity: 0.5;z-index: 11;border-radius: 100%;}
.sh-video-nav-list ul li a {font-size: 14px;color: #666;padding: 3px 0;}
.sh-video-nav-list ul li a:hover {color: #000;}
.sh-video-content-list {position: relative;display: flex;flex-wrap: wrap;}
.sh-video-list-item {width: 32%;margin-right: 2%;margin-bottom: 4%;}
.sh-video-list-item.mr0 {margin-right: 0;}
.sh-video-list-item .img-1 {background: #000;border-radius: 10px;position: relative;overflow: hidden;}
.sh-video-list-item .pic-1 {background-position: center;background-size: cover;background-repeat: no-repeat;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.sh-video-list-item .img-1 img {display: block;width: 100%;}
.sh-video-list-item .txt-2 {margin-top: 10px;}
.sh-video-list-item .title-1 strong{font-size: 16px;line-height: 24px;}
.sh-video-list-item .play-1 {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);z-index: 11;}
.sh-video-list-item .play-1 i {display: block; width: 50px;height: 50px; background: #2c3368;border-radius: 100%;position: relative;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.sh-video-list-item .play-1 i::after {content: '';border-left: 15px solid  #fff; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right:  0px solid transparent; display: block;  position: absolute; left: 50%; top: 50%; transform: translate(-40%,-50%); z-index: 11;}
.sh-video-list-item a:hover .play-1 i {transform: scale(1.05);}
.sh-video-list-item a:hover i {background: #50b662;}
.yt-modal-overlay{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:9998;}
.yt-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:88vw;max-width:920px;aspect-ratio:16/9;background:#000;z-index:9999;}
.yt-modal iframe{width:100%;height:100%;display:block;border:0;}
.yt-modal-close{position:absolute;right:-10px;top:-10px;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.8);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;}
.yt-modal-shorts{width: 50vw;max-width: 350px;min-width: 280px;aspect-ratio: 9/16;} 





@media screen and (max-width: 1440px) { 
    .sh-video-content{width: 86%;}
    .sh-video-list-item .title-1 strong{font-size: 16px;}
}

@media screen and (max-width: 1280px) { 
    .sh-video-content {width: 90%;}
}

@media screen and (max-width: 1200px) { 
    .sh-video-content-nav ul li strong{font-size: 12px;}
    .sh-video-nav-list ul li a{font-size: 12px;}
    .sh-video-list-item .title-1 strong{font-size: 14px;}
}


@media screen and (max-width: 860px) {   
    .sh-video-banner-pic img:first-child {display: none;}
    .sh-video-banner-pic img:last-child {display: block;}
    .sh-video-banner-text .title-1 h1 {font-size: 28px;line-height: 40px;}
    .sh-video-section {padding: 10% 0;}
    .sh-video-content,.sh-video-list-group-item strong,.sh-video-banner-text,.sh-video-banner-text .search-1 {width: 90%;}
    .sh-video-content-left {width: 100%;}
    .sh-video-content-right {margin-left: 0;width: 100%;margin-top: 5%;}
    .sh-video-list-item {width: 10%;margin-right: 0;}


    .sh-video-content-list{ flex-direction: column;}
    .sh-video-list-item{width: 100%;}
    .sh-video-nav-list ul li a{font-size: 14px;}
    .sh-video-content-nav ul li strong{font-size: 16px;}

}