html,
body,
#app {
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
    /* font-size: 4rem; */
    background-color: #000;
}

div {
    box-sizing: border-box;
    /* font-size: 3.2rem; */
}

input {
    font-size: 3.2rem;
    background-color: transparent;
    /* 去除背景色 */
    border: none;
    /* 去除边框 */
    outline: none;
    /* 去除聚焦时的轮廓 */
    padding: 0;
    /* 去除内边距 */
    caret-color: #fff
}

input:focus {
    border: none;
    /* 去除聚焦时的边框 */
    outline: none;
    /* 去除聚焦时的轮廓 */
}

.flex-col {
    display: flex;
    flex-direction: column;
}

.justify-between {
    display: flex;
    justify-content: space-between;
}

.justify-center {
    display: flex;
    justify-content: center;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.top-group {
    margin-top: 3rem;
}


::-webkit-scrollbar-track {
    background-color: #000;
    /* 轨道背景色 */
}

/* 定制滚动条上的滑块 */
::-webkit-scrollbar-thumb {
    background-color: #888;
    /* 滑块颜色 */
    border-radius: 0.5rem;
    /* 滑块圆角 */
}

/* 鼠标悬停时滑块样式 */
::-webkit-scrollbar-thumb:hover {
    background-color: #555;
    /* 悬停时滑块颜色 */
}

/* 设置滚动条轨道宽度和高度 */
::-webkit-scrollbar {
    width: 1rem;
    /* 横向滚动条宽度 */
    height: 1rem;
    /* 纵向滚动条高度 */
}

#app {
    /*overflow-y: auto;*/
    margin: 0 auto;
    user-select: none;
    padding-top: constant(safe-area-inset-top);
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-bottom: constant(safe-area-inset-bottom);
    padding-top: env(safe-area-inset-top);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
}

.page {
    width: 100%;
    max-width: 800px;
    height: 100%;
    margin: 0 auto;
    font-size: 3.2rem;
    background-color: #000;
    display: flex;
    flex-direction: column;
    line-height: 1;
    color: #fff;
    transform: translateZ(0px);
    -webkit-transform: translateZ(0px);
    position: relative;
}

.page img {
    width: 100%;
    height: 100%;
    /*display: flex;*/
    object-fit: contain;
    /*object-fit: initial;*/
}

.page .img-ed {
    object-fit: inherit;
}
.page .list .poster img{
    height: 60%;
    
}
.page .list .poster .img-ed{
    object-fit: cover;
    height: 100%;
}

.loading {
    opacity: 0.5;
}

/* 头部导航 */
.top {
    width: 100%;
    height: 12rem;
    padding: 1.5rem 4rem 1.5rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #c6c6c6;
}

.top .logo {
    height: 100%;
    width: auto;
    flex: 1;
    margin-right: 4rem;
}

.top .icon {
    width: 6rem;
    height: 6rem;
    margin-left: 6rem;
}

.top .letter {
    padding: 1.4rem 2.8rem;
    border-radius: 4rem;
    font-size: 3.6rem;
    color: #eee;
    border: 1px solid #f5dbb9;
    display: flex;
    align-items: center;
    position: relative;
}
.top .letter .dot{
    width: 2.66rem;
    height: 2.66rem;
    position: absolute;
    top: 0;
    right: 0;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
}

.top .logo img {
    object-fit: contain;
}

/* 头部标题 */

.tit-top {
    color: #fff;
    font-size: 4.8rem;
    line-height: 6.666rem;
    white-space: nowrap;
    padding: 2.66rem 0;
    position: relative;
    border-bottom: 1px solid #323232;
}

.his-btn {
    width: 2.933rem;
    position: absolute;
    left: 6.4rem;
    bottom: 3.2rem;
    height: 5.33rem;
}

.top-text {
    width: 66.66rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* 底部导航 */
.bottom-tabs {
    /*position: absolute;*/
    bottom: -2px;
    left: 50%;
    /*transform: translateX(-50%);*/
    /*height: 14rem;*/
    padding-top: 1rem;
    padding-bottom: 1rem;
    z-index: 99;
    width: 100%;
    max-width: 800px;
    display: flex;
    background-color: #000;
}

.bottom-tabs .bottom-tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    text-decoration: none;
    color: inherit;
}

.bottom-tabs .bottom-tab .icon {
    width: 6rem;
    height: 6rem;
}

.bottom-tabs .bottom-tab .bottom-tab-name {
    font-size: 3rem;
    margin-top: 1rem;
    color: #eee;
}

.bottom-tabs .active-bottom-tab {
    color: rgb(255, 174, 105);
}

.bottom-tabs .active-bottom-tab .bottom-tab-name {
    color: rgb(255, 174, 105);
}

/*小图标上方提示*/
.iconapp-tip{
    display: flex;
}

/* 小图标广告 */
.ggt-box-s {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 3rem;
}

.ggt-box-s .ggt-item {
    width: 20%;
    flex-direction: column;
    display: flex;
    align-items: center;
}

.ggt-box-s .ggt-item .icon {
    height: 14rem;
    width: 14rem;
    border-radius: 5px;
    overflow: hidden;
}

.ggt-box-s .ggt-item .name {
    font-size: 3.6rem;
    color: #eee;
    text-align: center;
    margin: 3rem 0;
}


/* banner广告 */
.banner-item {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2rem;
    flex-direction: column;
    width: 100%;
    height: 16rem;
    overflow: hidden;
}

/* 推荐位广告 */
.sicobox {
    margin-bottom: 2.66rem;
}

.sicobox .zhan,
.sicobox .zhen,
.sicobox .qi,
.sicobox .zhi {
    border-radius: 1.33rem;
    margin-bottom: 1.33rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.sicobox .zhen {
    background-color: rgba(255, 213, 22, .14);
}zhan

.sicobox .qi {
    background-color: rgba(0, 118, 255, .14);
}

.sicobox .zhi {
    background-color: rgba(255, 0, 0, .14);
}
.sicobox .zhan {
    background-color: rgb(0 164 58 / 15%);
}
.sico5{
        background-color: rgba(108, 0, 148, 0.14);
    }
.sicobox .sico {
    width: 16rem;
    height: 16rem;
}

.sicobox .icobox {
    width: calc(100% - 16rem);
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}

.sicobox .icobox .ggt-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 20%;
    text-align: center;
}

.sicobox .icobox .ggt-item .icon {
    width: 10.66rem;
    height: 10.66rem;
    overflow: hidden;
    border-radius: 1.33rem
}

.sicobox .icobox .name {
    font-size: 3rem !important;
    margin: 0 !important;
    line-height: 4.3rem;
}


/* 视频列表布局 */
.list {
    flex: 1;
    overflow-y: auto;
    padding: 5rem 2.666rem 14rem 2.666rem;
}

.list .item {
    overflow: hidden;
}

.list .item .poster {
    border-radius: 1rem;
    overflow: hidden;
}

.list .item .name {
    /*overflow: hidden;*/
    /*white-space: nowrap;*/
    /*text-overflow: ellipsis;*/
    display: -webkit-box;      /* 弹性盒子模型 */
  -webkit-line-clamp: 2;     /* 限制最多显示 2 行 */
  -webkit-box-orient: vertical; /* 垂直方向排列 */
  overflow: hidden;          /* 超出隐藏 */
  text-overflow: ellipsis;   /* 显示省略号 */
  word-break: break-word;    /* 处理长单词换行 */
   letter-spacing: 2px; /* 2px 可根据需求调整 */
    line-height: 1.2; /* 行高是字体大小的 1.8 倍 */
    font-size: 3rem;
    margin: 3rem 0;
    color: #eee;
}

.list .box-sp {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
}

.list .box-sp .item {
    width: 46rem;
}

.list .box-sp .item .poster {
    width: 100%;
    height: 26.66rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.list .box-more {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 4.2rem;
    color: #eee;
}

.list .box-more .more {
    display: flex;
    align-items: center;
    font-size: 3rem;
    color: #888;
    white-space: nowrap;
}

.list .box-more .more img {
    margin-left: 2rem;
    height: 4rem;
}

.list .box-dh {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.list .box-dh .item {
    display: inline-block;
    width: 70rem;
    margin-right: 2rem;
}

.list .box-dh .item .poster {
    width: 100%;
    height: 40rem;
}

.list .box-xh {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.list .box-xh .item {
    display: inline-block;
    width: 40rem;
    margin-right: 2rem;
}

.list .box-xh .item .poster {
    width: 100%;
    height: 24rem;
}

.list .box-dp {}

.list .box-dp .item {
    width: 100%;
}

.list .box-dp .item .poster {
    width: 100%;
    height: 46rem;
}

.list .box-zh {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
}

.list .box-zh .item {
    width: 46rem;
}

.list .box-zh .item:nth-child(1) {
    width: 100%;
}

.list .box-zh .item .poster {
    width: 100%;
    height: 28rem;
}

.list .box-zh .item:nth-child(1) .poster {
    width: 100%;
    height: 46rem;
}

/* 加载更多 */
.more {
    text-align: center;
    padding: 6rem 0;
    font-size: 3rem;
    color: #eee;
}

/*qq浏览器弹窗样式*/
.qqhomepops{
    position: fixed;
    z-index: 999;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .4);
    display: flex;
    align-items: center;
    justify-content: center;
}
.qqhomepops .qqbrowser{
    width: 62rem;
	height: 73rem;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
}
.qqhomepops .isQQBrowserbox{
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.qqhomepops .closesaaasd {
	position: absolute;
	left: 50%;
	bottom: -13.33rem;
	width: 10.933rem;
	height: 10.933rem;
	transform: translateX(-50%);
}

.qqhomepops .copyu {
	width: 56rem;
	height: 9.33rem;
	position: absolute !important;
	bottom: 2.66rem;
	left: 50%;
	transform: translateX(-50%);
}

/*播放页提示收藏弹窗样式*/
.schomepops{
    position: fixed;
    z-index: 99;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .4);
    display: flex;
    align-items: center;
    justify-content: center;
}
.shouValue{
	width: 94.66rem;
	/* height: 770rpx; */
	border-radius: 4rem;
	background: #272A32 100%;
	position: relative;
	padding: 5.33rem 2.66rem ;
}
.svtext1{
	font-family: PingFangHK, PingFangHK;
	font-weight: 400;
	font-size: 4.8rem;
	color: #FFFFFF;
	line-height: 6.66rem;
	text-align: center;
	font-style: normal;
}
.svtext2{
	font-family: PingFangHK, PingFangHK;
	font-weight: 400;
	font-size: 3.73rem;
	color: #BBBBBB;
	line-height: 5.33rem;
	text-align: center;
	font-style: normal;
}
.closesv{
	width: 9.33rem;
	height: 9.33rem;
	position: absolute;
	top: 4rem;
	right: 4rem;
}
.svbox{
    display: grid;
}
.svbox img{
    display: block;
    height: auto;
}
.svimgtop{
	margin: 7px 0;
}
/*搜索页样式*/
.biaoqian {
  width: 100%;
  padding:3rem 0 4rem;
}
.biaoqian-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.3rem;
}
.biaoqian-item {
    padding: 1.33rem 2.66rem;
    /*color: #4B4D55;*/
    text-align: center;
    border-radius: 3rem;
    border: 1px solid #979797;
}

/*播放页复制邮箱*/
.vpcopyemal{
    display: block;
    border: 1px solid red;
    border-radius: 1.26rem;
    padding: 1.33rem;
    font-size: 3.733rem;
    position: relative;
}
.vpcopyemal .email{
    background: red;
    border-radius: 2.3rem;
    color: #fff;
    display: inline-block;
    width: 55%;
    text-align: center;
    padding: 1rem 0;
}
.vpcopyemal .copybtn{
    /*float: right;*/
    color: #fff;
    background: red;
    border-radius: 3.3rem;
    padding: 1rem;
    /* font-size: 2.86rem; */
    position: absolute;
    right: 1.33rem;
    top: 1.33rem;
}
/*搜索页复制邮箱*/
.sccopyemail{
    border: 1px solid red;
    border-radius: 1.3rem;
    text-align: center;
    margin-bottom: 3rem;
    font-size: 3.733rem;
    color: red;
    line-height: 4rem;
}
.sccopyemail .emailbx{
    display: inline-block;
    width: 95%;
    background: red;
    color: #fff;
    padding: 1.33rem;
    font-size: 3.2rem;
    border-radius: 1.33rem;
    white-space: nowrap;
    margin-bottom: 1.66rem;
}
.sccopyemail .copybtn{
    display: inline-block;
    width: 50%;
    background: red;
    color: #fff;
    border-radius: 3.6rem;
    margin-bottom: 1.66rem;
    padding: 1.33rem 0;
}

img {
  user-select: none;            /* 禁止选中 */
  -webkit-user-drag: none;      /* 禁止拖拽 */
  -webkit-touch-callout: none;  /* 禁止长按菜单（iOS） */
}