a:hover { } .v-head { margin: 15px 0; width: 1210px; } .vh-main { width: 676px; height: 364px; } .vh-item { position: relative; overflow: hidden; margin: 0 10px 5px 0; border-radius: 4px; } .swiper-w { margin: 0 10px 5px 0; } .vh-small { width: 252px; height: 179px; } .vh-title { bottom: 0; left: 0; width: 100%; line-height: 46px; background-color: rgba(0, 0, 0, 0.5); z-index: 1; } .swiper-page-w { width: 270px; height: 46px; } .vh-t-inner { margin-left: 15px; max-width: 400px; } .vh-small .vh-title { line-height: 32px; } .vh-small .vh-t-inner { margin-left: 10px; max-width: 232px; } .play-icon { top: 0; left: 0; width: 100%; height: 100%; background: url('../../images/play-icon.png') no-repeat center rgba(0, 0, 0, 0.5); transition: all 0.25s ease-out; transform: scale(1.5); opacity: 0; cursor: pointer; z-index: -1; } .vh-main .play-icon { background-size: 86px; } .vh-item:hover .play-icon { transform: scale(1); opacity: 1; z-index: 1; } .v-main { margin-bottom: 20px; box-sizing: border-box; padding: 0 15px; width: 890px; border: solid 1px #e9e9e9; } .w300 { width: 300px; } .v-side { margin-bottom: 20px; box-sizing: border-box; padding: 0 15px; width: 300px; border: solid 1px #e9e9e9; } .v-title { margin: 8px 0 15px; color: #2d8ae6; } .v-list-inner { width: 864px; } .v-list-inner > a { margin: 0 6px 15px 0; float: left; width: 210px; } .vl-item { width: 210px; height: 140px; } .vl-item-des { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 42px; } .v-list-inner .play-icon, .hot-v-list .play-icon { background: url('../../images/play-icon-s.png') no-repeat center rgba(0, 0, 0, 0.5); } .hot-v-list .play-icon { background-size: 36px; } .vs-head { margin-top: 8px; line-height: 30px; } .more-link { padding-right: 12px; background: url('../../images/icon/icon-right.png') right center no-repeat; } .hot-v-list { margin-top: 20px; } .hot-v-list > a { overflow: hidden; display: block; margin-bottom: 20px; } .hot-v-list > a:not(:last-child) { padding-bottom: 20px; border-bottom: dashed 1px #e9e9e9; } .hot-v-list .vh-item, .vs-item { width: 132px; height: 88px; } .vs-des { margin-left: 140px; } .vs-des-text { overflow: hidden; line-height: 16px; height: 32px; } .vs-des-date { margin-top: 36px; } .swiper-pagination-bullet { width: 10px; height: 10px; background-color: #cececd; opacity: 1; border-radius: 5px; margin-right: 6px; } .swiper-pagination-bullet-active { width: 20px; height: 10px; background-color: #198cfd; border-radius: 5px; } .swiper-pagination { right: 15px; } .crumbs { margin-top: 10px; } .vd-title { margin-top: 6px; } .vd-subinfo { } .video-frame { margin-top: 7px; height: 437px; background-color: #000000; border-radius: 4px; } .vd-tags { margin-top: 10px; } .vd-tags > a { float: left; margin: 0 10px 8px 0; background: #f4f4f4; border-radius: 100px; padding: 0 12px; position: relative; height: 22px; line-height: 22px; transition: all 0.3s; font-size: 12px; border: 1px solid #f4f4f4; } .vd-tags > a:hover { border-color: #00a1d6; color: #00a1d6; } .xgjc-list { } .xgjc-list > li { float: left; width: 400px; height: 30px; position: relative; background: url(../../images/icon/dot.png) no-repeat 0 center; } .xgjc-list > li:nth-child(even) { margin-left: 58px; } .xgjc-list > li a { color: #333; line-height: 30px; height: 30px; font-size: 14px; display: inline-block; padding-left: 14px; /* padding-right: 85px; */ position: relative; overflow: hidden; width: 280px; white-space: nowrap; text-overflow: ellipsis; } .xgjc-list > li a:hover { color: #f30; } .xgjc-list > li span { position: absolute; right: 0; top: 6px; color: #999; font-size: 12px; background: #fff; } .vd-des-title { margin-top: 23px; } .vd-des-content { line-height: 28px; } .cut-line { margin: 10px 0 25px; border-bottom: dashed 1px #e9e9e9; } .dnf { margin: 20px 0; height: 258px; background: linear-gradient(0deg, #fff088 0%, #fffef7 100%); box-shadow: 0px -3px 13px 0px #85b2c7, 0px 3px 7px 0px #51718a, 0px 9px 14px 0px #7da1bc; border-radius: 7px; border: solid 1px #5d7996; opacity: 0.07; } .dnf-inner { margin: -278px 0 20px 0; padding: 15px; height: 258px; background: url('../../images/texture.png') no-repeat center; } .dnf-img { display: block; width: 154px; height: 154px; border-radius: 36px; } .dnf-link { margin-top: 30px; display: block; width: 152px; line-height: 40px; background-image: linear-gradient( 266deg, #0478ed 0%, #3193f6 50%, #5badff 100% ); border-radius: 20px; } .dnf-score { right: 15px; top: -25px; /* vertical-align: text-top; */ color: #ff7011; /* box-shadow: 0px 3px 6px 0px rgba(255, 167, 148, 0.69); */ } .int-num { font-size: 110px; } .dot { font-size: 100px; } .float-num { font-size: 70px; } .dnf-main { margin: 0 200px 0 183px; } .dnf-subinfo-list { margin-top: 5px; line-height: 33px; height: 66px; } .dnf-subinfo-list > li { float: left; width: 50%; } .download-link { margin-top: 10px; display: block; width: 103px; line-height: 30px; background-color: #29af6c; border-radius: 15px; } .download-link:hover, .dnf-link:hover { color: #fff; } .android-icon { top: 2px; margin-right: 7px; display: inline-block; width: 16px; height: 16px; background: url('../../images/anzhuo-2.png') no-repeat center; } .erweima { top: 3px; margin-left: 7px; display: inline-block; width: 16px; height: 16px; background: url('../../images/mobilegame/erweima.png') no-repeat center; background-size: 16px; } .erweima-wrap { display: none; top: -30px; left: 116px; width: 90px; height: 90px; border: solid 1px #ccc; /* box-shadow: 1px 1px; */ border-radius: 2px; } .download-link:hover .erweima-wrap { display: block; } .erweima-wrap img { margin: 4px auto; display: block; width: 82px; height: 82px; } .arr-dir { top: 36px; left: -16px; width: 0; height: 0; border: solid 8px transparent; border-right: solid 8px #ccc; } .arr-dir-inner { top: -8px; left: -6px; width: 0; height: 0; border: solid 8px transparent; border-right: solid 8px #fff; } .tag-list { margin-top: 40px; } .tag-list > li { margin-right: 20px; padding: 0 12px; float: left; line-height: 30px; background-color: #f1f1f1; border-radius: 15px; } .hot-special-list { margin-top: 20px; } .hsl-inner { width: 284px; } .hsl-inner > a { float: left; width: 126px; margin: 0 16px 10px 0; } .hs-img { display: block; width: 126px; height: 178px; border-radius: 4px; } .hs-title { margin-top: 5px; } .mobile-game-list { margin-top: 20px; } .mgl-inner { width: 294px; } .mgl-inner > a { float: left; width: 72px; margin: 0 26px 10px 0; } .mg-img { display: block; width: 72px; height: 72px; border-radius: 10px; }