.news-details { padding: 3.9rem 0 5.6rem; background: url(../img/news/news_details_bg.jpg) no-repeat left top; background-size: contain; } .news-details .con { position: relative; } .news-details .con .news-center { width: 75%; margin: 0 auto; } .news-details .con .news-center .title { padding-bottom: 2.5rem; border-bottom: 1px solid #e3e3e3; } .news-details .con .news-center .title h1 { font-size: 1.8rem; font-weight: bold; text-align: center; } .news-details .con .news-center .title .brief { display: flex; justify-content: center; margin-top: 2rem; font-size: 0.9rem; color: #777; } .news-details .con .news-center .title .brief > span { font-size: 1rem; margin-right: 0.4rem; } .news-details .con .news-center .title .brief h3 { margin-right: 1rem; } .news-details .con .news-center .text { margin-top: 2.5rem; } .news-details .con .news-center .text p { font-size: 0.9rem; color: #888; text-align: justify; /*margin-top: 1.5rem;*/ line-height: 1.8; } .news-details .con .news-center .text img { max-width: 100%; } .news-details .con .news-bottom { margin-top: 5rem; } .news-details .con .news-bottom .left { float: left; width: 46.5%; background: #f4f4f4; padding: 0 2rem; } .news-details .con .news-bottom .left a { display: block; } .news-details .con .news-bottom .left a .prev { float: left; line-height: 5rem; font-size: 0.9rem; color: #777; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .left a .prev span { font-size: 1rem; color: #666; margin-right: 0.6rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .left a h2 { float: right; width: 80%; text-align: right; line-height: 5rem; font-size: 0.9rem; font-weight: bold; color: #555; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .left:hover a .prev { color: #004a92; } .news-details .con .news-bottom .left:hover a .prev span { color: #004a92; } .news-details .con .news-bottom .left:hover a h2 { color: #004a92; } .news-details .con .news-bottom .middle { float: left; width: 7%; height: 5rem; background: #004a92; text-align: center; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .middle a { display: block; } .news-details .con .news-bottom .middle a span { font-size: 1.4rem; color: #fff; line-height: 5rem; } .news-details .con .news-bottom .middle:hover { background: #d8222a; } .news-details .con .news-bottom .right { float: right; width: 46.5%; background: #f4f4f4; padding: 0 2rem; } .news-details .con .news-bottom .right a { display: block; } .news-details .con .news-bottom .right a .next { float: right; line-height: 5rem; font-size: 0.9rem; color: #777; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .right a .next span { font-size: 1rem; color: #666; margin-left: 0.6rem; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .right a h2 { float: left; width: 80%; line-height: 5rem; font-size: 0.9rem; font-weight: bold; color: #555; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .news-details .con .news-bottom .right:hover a .next { color: #004a92; } .news-details .con .news-bottom .right:hover a .next span { color: #004a92; } .news-details .con .news-bottom .right:hover a h2 { color: #004a92; } .news-details .con .news-share { position: absolute; top: 0; right: 0; } .news-details .con .news-share a { float: none; display: block; width: 2.8rem; height: 2.8rem; background: #bbb; padding-left: 0; margin: 0; position: relative; text-align: center; margin-top: 1rem; opacity: 1; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; z-index: 1; } .news-details .con .news-share a:before { content: '\e62f'; font-family: iconfont; position: absolute; left: 50%; top: 0; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); font-size: 1.2rem; line-height: 2.8rem; color: #fff; z-index: -1; } .news-details .con .news-share a:hover { background: #d8222a; } .news-details .con .news-share a.bds_tsina:before { content: '\e81c'; } .news-details .con .news-share a.bds_qzone:before { content: '\e63f'; } .news-details .con .news-share.active { position: fixed; top: 20%; right: 12%; } @media screen and (max-width: 1024px) { .news-details .con .news-center { width: 90%; } .news-details .con .news-share { right: 4%; } .news-details .con .news-share.active { right: 4%; } } @media screen and (max-width: 768px) { .news-details { padding: 20px 0; } .news-details .con .news-center { width: 100%; } .news-details .con .news-center .title { padding-bottom: 20px; } .news-details .con .news-center .title h1 { font-size: 18px; } .news-details .con .news-center .title .brief { font-size: 14px; margin-top: 20px; } .news-details .con .news-center .title .brief > span { font-size: 16px; position: relative; top: -1px; } .news-details .con .news-center .text { margin-top: 20px; } .news-details .con .news-center .text p { font-size: 14px; /*margin-top: 10px;*/ } .news-details .con .news-bottom { margin-top: 20px; } .news-details .con .news-bottom .left { width: 44%; } .news-details .con .news-bottom .left a .prev { line-height: 44px; font-size: 14px; } .news-details .con .news-bottom .left a .prev span { font-size: 16px; } .news-details .con .news-bottom .left a h2 { display: none; } .news-details .con .news-bottom .middle { width: 12%; height: 44px; } .news-details .con .news-bottom .middle a span { line-height: 44px; } .news-details .con .news-bottom .right { width: 44%; } .news-details .con .news-bottom .right a h2 { display: none; } .news-details .con .news-bottom .right a .next { line-height: 44px; font-size: 14px; } .news-details .con .news-bottom .right a .next span { font-size: 16px; } .news-details .con .news-share { position: relative !important; top: 0 !important; right: 0 !important; } .news-details .con .news-share .share { text-align: center; margin-top: 20px; } .news-details .con .news-share a { display: inline-block; width: 44px; height: 44px; margin: 0 4px; } .news-details .con .news-share a:before { font-size: 20px; line-height: 44px; } } /*# sourceMappingURL=news_details.css.map */99热国产这里只有精品无卡顿,99视频10精品视频在线,99精品视频九九精品视频