html, body{ height: 100%; } body { /* font-family: Source Han Sans CN; */ font-family: microsoft yahei; font-size: 0.14rem; margin: 0; min-width: 1.2rem; } .page { width: 100%; background-color: #fff; min-height: 100%; } /* 顶部 */ .p-header{ width: 100%; height: 0.90rem; width: 100%; } .p-header .logo-wrap{ width: 2.79rem; height: 0.90rem; margin-right: auto; } .p-header .logo-wrap .logo{ width: 1.74rem; height: auto; } .p-header .tab-wrap{ margin-right: 0.60rem; } .p-header .tab-wrap .tab{ height: 0.90rem; width: 1.42rem; cursor: pointer; } .p-header .tab-wrap .tab.active .cn{ color:#10848F; opacity: 1; } .p-header .tab-wrap .tab.active .en{ color:#10848F; opacity: 1; } .p-header .tab-wrap .tab:hover .cn{ color:#10848F; opacity: 1; } .p-header .tab-wrap .tab:hover .en{ color:#10848F; opacity: 1; } .p-header .tab .cn{ font-size: 0.16rem; color: #242227; height: 0.16rem; font-size: 0.16rem; font-weight: 400; line-height: 0.16rem; } .p-header .tab .en{ margin-top: 0.06rem; font-size: 0.14rem; font-weight: 400; color: #242227; line-height: 0.21rem; opacity: 0.6; } .p-bgimg .img{ width: 100%; /* height: 4.00rem; object-fit: cover; */ } .p-tab{ height: 0.60rem; width: 12.00rem; padding-left: 7px; margin:0 auto; border-bottom: 1px solid #eee; cursor: pointer; } .p-tab .tab-item{ width: 1.08rem; height: 0.60rem; line-height: 0.60rem; text-align: center; font-size: 0.16rem; color: #5c5b5b; } .p-tab .tab-item.active{ color:#10848F; position: relative; } .p-tab .tab-item.active::after{ position: absolute; left: 50%; transform: translateX(-50%); bottom: 1px; width: 0.60rem; height: 1px; background-color: #10848F; content: ""; } .p-tab .tab-item:hover{ color:#10848F; } .p-rich{ width: 12.00rem; margin: 0.25rem auto; font-size: 0.16rem; line-height: 0.32rem; color:#464646; flex:1; } .p-bottom { width: 100%; background-color: #10848F; /* margin-top: 0.30rem; */ } .p-bottom .b-top{ padding-top: 0.40rem; height: 3.13rem; border-bottom: 1px solid rgba(255,255,255,.1); } .p-bottom .b-top .b-t-logo{ height: 2.22rem; margin-right: 1.47rem; padding-top: 0.24rem; } .p-bottom .b-top .b-t-logo .img{ width: 1.47rem; height: auto; } .p-bottom .b-t-item{ max-width: 3.52rem; word-break: break-all; } .p-bottom .b-t-item .title{ height: 0.30rem; font-size: 0.20rem; font-weight: 500; color: #FFFFFF; line-height: 0.30rem; } .p-bottom .b-t-item .spliter{ margin-top: 9px; width: 0.40rem; height: 2px; background: #FFFFFF; margin-bottom: 0.10rem; } .p-bottom .b-t-item .line{ height: 0.36rem; line-height: 0.36rem; color: #fff; font-size: 0.16rem; } .p-bottom .b-t-r{ margin-left: 1.24rem; } .p-bottom .b-t-r .img{ width: 1.40rem; height: 1.40rem; margin-right: 0.18rem; } .p-bottom .b-t-r .img.mr0{ margin-right: 0; } .p-bottom .b-bottom{ height: 0.36rem; line-height: 0.36rem; text-align: center; color:#fff; font-size: 0.14rem; } .p-pagination{ margin:0 auto 0.25rem; } /* 播放器弹层 */ .p-player{ position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 60vw; height: 60vh; display: none; background-color: #000; z-index: 10; } .p-player .cancel{ position: absolute; right: -0.20rem; top: -0.20rem; width: 0.48rem; height: 0.48rem; z-index: 2; cursor: pointer; } .p-player video{ width: 100%; height: 100%; } .p-pagination .pagination{ display: flex; } .p-pagination li{ padding: 0 9px; margin: 5px 2px; background: #ddd; border-radius: 2px; height: 26px; line-height: 26px; text-align: center; color: #000; cursor: pointer; font-size: 14px; } .p-pagination li.disabled{ cursor:not-allowed; } .p-pagination li.active{ background-color: #10848F; color:#fff; } .p-rich .r-title{ text-align: center; border-bottom: #CCC 1px solid; } .p-rich .r-title .title{ font-size: 0.25rem; color: #333; font-weight: normal; } .p-rich .r-title .time{ font-size: 0.13rem; color: #adadad; font-weight: normal; margin: 0.20rem 0; } .p-rich img{ max-width: 100%; }