/*--------------public star---------------*/
/*global*/
html, body { margin: 0; padding: 0;color: #c7c7c7; jdisplay: flex;justify-content: center;align-items: center;height: 100vh;scroll-behavior: smooth;}
body{max-width: 480px; margin: 0px auto; background-color:#000000;}
ul,li,p,h1,h2,h3,h4,h5,h6,dl,dd,figure,figcaption { margin: 0; padding: 0; list-style: none}
input,button {border: 0}
a {text-decoration: none;color: #c7c7c7;}
a:hover { text-decoration: none;}
.fontred{color: #AB0511;}
/*container*/
.container{margin-left: 2%;margin-right: 2%;}

/*navtop*/
.navtop{position: relative; align-items: center; height: clamp(60px, 4.167vw, 100px); width: 100%;color: #c7c7c7;line-height: 60px;font-size: 22px;}
.navtop .appdown{float: left;}
.navtop .logo{float: left; margin-left: 28%;}
@media (max-width: 360px) {
	.navtop .logo{margin-left: 20%;}
}
.navtop .topsearch{float: right;}

/*menu*/
.menu{float: left;width: 100%;padding-bottom: 10px;font-size: 20px;}
.menu .navbar{line-height: 40px;float: left;width: 100%;}
.menu .navbar li{height: 40px;float: left;text-align: center;border-radius: 5px;width: 20%;}
.menu .navbar a{color: #c7c7c7;text-decoration: none;line-height: 15px; letter-spacing: 2px;}
.menu .navbar a:hover{color: #AB0511;font-weight: bolder;}
.menu .navbar .active{background-color: #AB0511; text-align: center;}
.menu .navbar .active a{color: #c7c7c7;font-weight: bolder; }

/*swiper*/
.swiper{position: relative;width: 100%;height: 130px;overflow: hidden;border-radius: 8px;margin-bottom:15px;}
.swiper .carousel-container {position: relative;max-width: 480px;margin: auto;overflow: hidden;height: 130px;}
.swiper .carousel-slides {display: flex;transition: transform 0.5s ease-in-out;height: 130px;}
.swiper .slide {min-width: 100%;position: relative;}
.swiper .slide img {width: 100%;display: block;height: 130px;}
.swiper .caption {position: absolute;bottom: 0px;left: 50%;transform: translateX(-50%);background-color: rgba(0, 0, 0, 0.5);color: white;
padding: 10px 20px;border-radius: 5px;display:none}
.swiper .prev {left: 10px;display:none}
.swiper .next {right: 10px;display:none}

/*ad-fdlink*/
.ad-fdlink{margin-bottom:5px;width: 100%;float: left;}
.ad-fdlink ul{width: 100%;float: left;}
.ad-fdlink li{float: left; width: 20%;height:116px;margin-bottom: 8px;font-size: 12px;}
.ad-fdlink li img{border-radius: 5px;width: 90%;height:86px;}
.ad-fdlink li p{text-overflow: ellipsis;height: 20px;white-space: nowrap;width: 90%;overflow: hidden;margin-top: 5px;text-align: center;}
.ad-fdlink li:nth-child(5) img,.ad-fdlink li:nth-child(10) img,.ad-fdlink li:nth-child(15) img{width: 100%;}
@media (max-width: 450px) {
  .ad-fdlink li{height: 106px;}
  .ad-fdlink li img{height: 80px;}
}

/*remind*/
.remind{}
.remind span{color: #AB0511;}

/*recommend*/
.recommend{margin-top: 20px;float: left;width: 100%;}
.recommend p{text-align: center;float: left;height: 45px;margin-right: 5px;}
.recommend p a{padding-top: 8px;padding-bottom: 8px;margin-bottom: 5px;border-radius: 5px;color: #c7c7c7; background: rgba(255, 255, 255, 0.3);white-space: nowrap;padding-left: 15px;padding-right: 15px;}
.recommend p a:hover{background: #AB0511;}

/*list-tit*/
.list-tit{margin-bottom: 15px;margin-top: 15px;}
.list-tit b{font-size: 22px;}
.list-tit span{float: right;}
.list-tit strong{color: #AB0511;}

/*list-info*/
.list-info{float: left;width: 100%;}
.list-info li{float: left;width: 50%;position: relative;margin-bottom: 8px;height:170px;overflow: hidden;}
.list-info li img{width: 98%;height: auto;border-radius: 5px;height: 130px;}
.list-info li:nth-child(even) {text-align: right; }
.list-info li:nth-child(even) p{padding-left:5px}
.list-info li p{text-align: left;height: 36px;overflow: hidden;font-size: 12px;line-height: 18px;width: 95%;}
.list-info li span{position: absolute;top:108px;right: 5px;background: rgba(255, 255, 255, 0.6);font-size: 12px;color: #000;padding: 3px 6px 3px 6px;border-radius: 5px;}
.list-info li:nth-child(even) span{
  right: 0px;
}
@media (max-width: 450px) {
	.list-info li{height:140px;}
	.list-info li img{height: 100px;}
	.list-info li span{top:77px}
}

/*fadlist*/
.fadlist{margin-top: 15px;float: left;}

/*footer*/
.footer{float: left;width: 100%;font-size: 12px;padding-bottom: 80px;}
.footer .ft-tips{margin-top: 15px;margin-bottom: 10px;}
.footer .ft-pb{letter-spacing: 2px;text-align: center;}
.footer .ft-pb strong a{color:#AB0511;}

/*suspbottom*/
.suspbottom{z-index: 999;position: fixed;bottom: 0;left: 0;width: 100%;height: 60px;text-align: center; background-color: #000;}
.suspbottom .carousel-containerf {position: relative;width: 480px;margin: auto;overflow: hidden;height:60px; }
.suspbottom .carousel-slidesF {display: flex;transition: transform 0.5s ease-in-out;height: 60px;}
.suspbottom .slideF {min-width: 100%;position: relative;}
.suspbottom .slideF img {width: 480px;display: block;height: 60px;margin: auto;}	
@media (max-width: 450px) {
	.suspbottom .slideF img{width: 100%;height: 60px;}
}
/*returntop*/
.back-to-top{position: fixed; bottom: 60px; right: 30%;background: transparent;transform: translateX(-30%);}
@media (max-width: 450px) {
	.back-to-top{right:3px;transform: translateX(-3px);}
}
/*--------------public end---------------*/


/*--------------index star---------------*/
/*ilist*/
.ilist{float: left;width: 100%;}
/*弹窗*/
.modal-overlay {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0, 0, 0, 0.5);display: flex;justify-content: center;align-items: center;z-index: 1000;display: flex;}
.modal-container {background-color: #000000;border-radius: 8px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);width: 80%;max-width: 500px;padding: 20px;position: relative;animation: modalFadeIn 0.3s ease-out;}
.modal-close {position: absolute;top: 10px;right: 10px;background: none;border: none;font-size: 30px;cursor: pointer;color: #666;text-decoration: none;}
.modal-close:hover {color: #333;}
.modal-content {margin-top: 20px;margin-bottom: 20px;}
.modal-title {font-size: 1.5em;margin-bottom: 15px;color: #c7c7c7;}
@keyframes modalFadeIn {
	from {opacity: 0;transform: translateY(-20px);	}
	to {opacity: 1;	transform: translateY(0);	}
}
#modal:target {display: none;}
/*--------------index end---------------*/

/*--------------list star---------------*/
.paginationl {float: left;width: 100%;margin-left: 1%}
.paginationl .pagination {padding: 0;margin: 20px 0;}
.paginationl .pagination li {margin: 5px 5px 0px 0px;float: left;}
.paginationl .pagination a {display: block;padding: 8px 15px;text-decoration: none;color: #c7c7c7;border: 1px solid #c7c7c7;border-radius: 4px;transition: all 0.3s;}
.paginationl .pagination a:hover {background: rgba(255, 255, 255, 0.3);font-weight: bold;}
.paginationl .pagination .active a {background: rgba(255, 255, 255, 0.3);color:#c7c7c7;font-weight: bold;}
.paginationl .pagination .disabled a {color: #c7c7c7;pointer-events: none;cursor: default;font-weight: bold;}
/*--------------list end---------------*/

/*--------------listD star---------------*/
/*listD*/
.listD{float: left;width: 100%;}
/*list-info*/
.listD .listD-info{float: left;width: 100%;}
.listD .listD-info li{float: left;width: 33.33%;position: relative;margin-bottom: 8px;height:270px;overflow: hidden;}
.listD .listD-info li img{width: 98%;height: auto;border-radius: 5px;height: 230px;}
.listD .listD-info li p{text-align: left;height: 36px;overflow: hidden;font-size: 12px;line-height: 18px;width: 95%;}
.listD .listD-info li span{position: absolute;top:208px;right: 5px;background: rgba(255, 255, 255, 0.6);font-size: 12px;color: #000;padding: 3px 6px 3px 6px;border-radius: 5px;}
.listD .listD-info li:nth-child(3n){text-align: right;}
.listD .listD-info li:nth-child(3n) img{width: 100%;}
.listD .listD-info li:nth-child(3n) span{ right: 0px;}
@media (max-width: 450px) {
	.listD .listD-info li{height:240px;}
	.listD .listD-info li img{height: 200px;}
	.listD .listD-info li span{top:177px}
}
/*--------------listD END---------------*/

/*--------------search star---------------*/
.search-container {display: flex;width: 100%;max-width: 460px; margin: 0px 10px 10px 0px;}
.search-input {width: 200px;padding: 13px 20px;border: 2px solid #AB0511;border-radius: 10px 0 0 10px;font-size: 22px;outline: none;transition: all 0.3s;float: left}
.search-input:focus {border-color: #AB0511;}
.search-btn {padding: 14px 25px;background-color: #AB0511;color:#c7c7c7;border: none;border-radius: 0 10px 10px 0;cursor: pointer;font-size: 22px;transition: all 0.3s;float: left}
.search-btn:hover {background-color: #AB0511;}
 @media (max-width: 450px) {
	.search-input {padding: 10px 15px;}
	.search-btn {padding: 10px 20px;}
}
/*--------------search end---------------*/

/*--------------showpage star---------------*/
 /* 初始普通状态 */
#sectionplayer {min-height: 270px;color: white;transition: all 0.4s ease-out;box-shadow: 0 2px 5px rgba(0,0,0,0.1);}
.videotips{line-height: 32px}
.videotips b{color: #AB0511;font-size:  22px}
/* 浮动状态样式 */
#sectionplayer.floating {position: fixed;top: 0;left: 0;width: 100%;z-index: 1000;box-shadow: 0 4px 12px rgba(0,0,0,0.15);animation: floatIn 0.4s ease-out;}
/* 占位元素，防止布局跳动 */
.player-placeholder {display: none;height: auto;}
#sectionplayer.floating + .player-placeholder {display: block;height: 300px; /* 与原元素高度相同 */}
@keyframes floatIn {
	from {transform: translateY(-20px);opacity: 0.9;}
	to {transform: translateY(0);opacity: 1;}
}
/*--------------showpage end---------------*/