@import url(https://at.alicdn.com/t/c/font_5120784_erxpc09m95r.css);
*{ padding: 0px; margin: 0px; list-style-type: none; font-family: "微软雅黑"; font-size: 16px; box-sizing: border-box;}
body,html{ background: #fbb162;background: #fbb162;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #fff, #fbb162);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #fff, #fbb162); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.top{ width: 100%; position: relative; z-index: 0;}
.top img{ width: 100%;}
.sfzzymian,.sfzjianjie,.content{ max-width: 1300px; background: #fff; border-radius: 8px; position: relative; margin: 0px auto; margin-top: -26vw; padding: 20px; line-height: 180%; color: #555; z-index: 3;box-shadow: 0 2px 10px 0 rgba(136,145,151,.15);}
.sfzjianjie a{ color: #c42925; text-decoration: none;}
.sfzjianjie p{ text-indent: 2em;}
.sfzmian{ max-width: 1300px; position: relative; margin: 0px auto; background: #fff;border-radius: 8px; padding: 20px; margin-top: 30px; }
.sfzfenzj{ margin-bottom: 15px;}
.sfzfenzj ul{ display: flex; flex-wrap: wrap;}
.sfzfenzj ul li{ width: 12.5%;  padding: 5px 15px; margin-bottom: 15px;}
.sfzfenzj ul li a{ display: block; width: 100%; height: 45px; line-height: 45px; padding-left: 8px; background: #eec4a7; border-radius: 5px; color: #510100; text-decoration: none; display: block;}
.sfzfenzj ul li a i{ margin-right: 5px;}
.sfzfenzj ul li a span{ font-size: 18px;}
.sfzfenzj ul li:hover a{ background: #c42925; color: #fdcd8f; }
.sfzfenzj ul li.active a{background: #c42925; color: #fdcd8f;}
.sfztitle{ margin-top: 15px; position: relative; }
.sfztitleimg{ display: block; width: 100%;position: relative; overflow: hidden;}

.sfzvideo ul{ display: flex; flex-wrap: wrap;}
.sfzvideo ul li{ width: 25%; padding: 0px 30px; margin-top: 30px; margin-bottom: 15px;}
.sfzvideo ul li a{ display: block; width: 100%; text-decoration: none;}
.sfzvideo ul li span{ border-radius: 8px; position: relative; overflow: hidden; aspect-ratio:16/9; display: block;}
.sfzvideo ul li span img{ width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 0; transition: all 0.3s;}
.sfzvideo ul li i{ position: absolute; font-size: 40px; z-index: 3; color: #fff; top: 50%; margin-top: -25px; left: 50%; margin-left: -25px; display: block; width: 50px; height: 50px; border-radius: 50%; background: rgba(136,145,151,.3); text-align: center; line-height: 50px;}
.sfzvideo ul li em{ display: block; width: 100%; height: 75px; line-height: 25px; font-size: 15px; color: #555; font-style: normal; position: relative; overflow: hidden; margin-top: 8px;}
.sfzvideo ul li:hover img{ width: 110%; height: 110%; object-fit: cover; margin-left: -5%; margin-top: -5%;}
.sfzvideo ul li:hover em{color:#c42925;}

.tbchvideo ul{ display: flex; flex-wrap: wrap;}
.tbchvideo ul li{ width: 33.33%; padding: 0px 30px; margin-top: 30px; margin-bottom: 15px;}
.tbchvideo ul li a{ display: block; width: 100%; text-decoration: none;}
.tbchvideo ul li span{ border-radius: 8px; position: relative; overflow: hidden; aspect-ratio:16/9; display: block;}
.tbchvideo ul li span img{ width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 0; transition: all 0.3s;}
.tbchvideo ul li i{ position: absolute; font-size: 40px; z-index: 3; color: #fff; top: 50%; margin-top: -25px; left: 50%; margin-left: -25px; display: block; width: 50px; height: 50px; border-radius: 50%; background: rgba(136,145,151,.3); text-align: center; line-height: 50px;}
.tbchvideo ul li em{ display: block; width: 100%; height: 75px; line-height: 25px; font-size: 15px; color: #555; font-style: normal; position: relative; overflow: hidden; margin-top: 8px;}
.tbchvideo ul li:hover img{ width: 110%; height: 110%; object-fit: cover; margin-left: -5%; margin-top: -5%;}
.tbchvideo ul li:hover em{color:#c42925;}

.footer{ background: #f9ebdb; margin-top: 20px; min-height: 100px; border-top: 5px solid #c42925;}
.footerN{ max-width: 1300px; position: relative; margin: 0px auto; padding: 15px; text-align: center; line-height: 30px; color: #333;}
.footerN a{ color: #333; text-decoration: none;}

.sfzsousuo{ position: absolute; width: 360px; right: 0px; height: 50px; display: flex; top: 8px;}
.sfzsousuo input{  flex: 1; height: 35px; line-height: 35px; border: 1px solid #ccc; border-radius: 8px 0px 0px 8px; background: #fff; outline: none; text-indent: 15px;}
.sfzsousuo button{ background: #c42925; color: #fdcd8f; border-radius: 0px 8px 8px 0px; height: 35px; line-height: 35px; border: none;  cursor: pointer; width: 80px;}
.sfzsousuo button i{ margin-right: 5px;}

.contenttitle{ padding: 15px 15px; text-align: center; font-size: 30px;}
.fangwengxx{ text-align: center; border-bottom: 1px dotted #ccc; padding:15px 0px;}
.fangwengxx ul{ display: flex; justify-content: center; position: relative;}
.fangwengxx ul li{ margin: 0px 15px;}
.fangwengxx ul li em{ font-style: normal; color: #999; }
.contentN { text-align: center; margin-top: 30px;}
.contentN p{ line-height: 180%; font-size: 16px; text-indent: 2em; text-align: left;margin-top: 15px;}


.mianbxdoh{ padding: 15px 0px; display: inline-block;}
.mianbxdoh ul li{float: left;}
.mianbxdoh ul li a{ float: left; color: #510100; text-decoration: none; }
.mianbxdoh ul li::after{content: '>'; padding: 0px 5px;}
.mianbxdoh ul li:last-child::after{ display: none;}

.contentvideo{ max-width: 100%;}
.contentvideo video{ max-width: 100%; max-height: 400px;}
.content{ margin-top: 15px;}

.fenjiplay{ display: flex;}
.fenjiplayLeft{ width: 250px; background: #f6f6f6;}
.fenjiplayLeft ul{}
.fenjiplayLeft ul li{ border-bottom: 15px solid #fff; padding: 15px; }
.fenjiplayLeft ul li a{ color: #333; text-decoration: none; display: block;}
.fenjiplayLeft ul li a i{ font-size: 20px;}
.fenjiplayLeft ul li:hover{ background: #c42925;}
.fenjiplayLeft ul li:hover a{ color: #fdcd8f;}
.fenjiplayLeft ul li.active{ background: #c42925;}
.fenjiplayLeft ul li.active a{color: #fdcd8f;}
.fenjiplayRight{ flex: 1; padding-left: 15px;}
.fenjiplaycontent{margin-top: -26vw;}
.fenjiplayLefttitle{ background: #c42925; color: #fdcd8f; font-size: 24px; text-align: center; padding: 15px 8px; margin-bottom: 15px;}

.sfzplaylisticon{ display: flex; justify-content: center; position: fixed; left: 5x; bottom: 60px; border-radius: 50%; z-index: 5; width: 50px; height: 50px; line-height: 50px; font-size: 36px; color: #fdcd8f; background: #c42925; box-shadow: 0 2px 10px 0 rgba(136,145,151,.15); text-align: center; display: none;}

.tbchua{ padding: 0px 15px;}
.tbchua img{ border-radius: 8px;}

@media only screen and (max-width: 1330px) {
    .sfzzymian,.sfzjianjie,.sfzmian,.footerN,.content{ width: calc(100% - 30px);}
}
@media only screen and (max-width: 1200px) {
    .sfzfenzj ul li{ min-width: 140px;}
    .sfzfenzj ul li{ width: 16.66%;}
    .sfzvideo ul li{ width: 33.33%;}
}
@media only screen and (max-width: 992px) {
    .sfzfenzj ul li{ width: 20%;}
    .top{ width: 100%; position: relative; overflow: hidden;}
    .top img{ width: 130%; margin-left: -15%;}
    .fenjiplay{ flex-wrap: wrap;}
    .fenjiplayLeft{ width: 80%;position: fixed; left: -80%; top: 0px; height: 100%; overflow-y: auto; z-index: 3; padding: 15px; transition: all 0.3s;}
    .fenjiplayLeft.active{ left: 0%;}
    .fenjiplayLeft ul li{ border-bottom: none; background: #fff; margin-bottom: 15px;}
    .sfzplaylisticon{ display: flex;}
}
@media only screen and (max-width: 768px) {
    .sfzfenzj ul li{ width: 25%;}
    .sfzvideo ul li{ width: 50%;}
    .tbchvideo ul li{ width: 50%;}
    .sfzsousuo{ position: relative; width: 100%; margin-top: 15px;}
}
@media only screen and (max-width: 650px) {
   .sfzfenzj ul li{ width: 33.33%;}
}
@media only screen and (max-width: 500px) {
    .sfzfenzj ul li{ width: 50%;}
}
