html {margin: 0 auto;max-width: 430px;background-color: #eee;}
body {background-color: #eee;color: #333;margin: 0;padding: 0;font: 15px Helvetica, Arial, sans-serif;line-height: 1.5;outline: 0;background-repeat: repeat-x;background-position: center top;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
*, :after, :before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {margin: 0;font-weight: 400;line-height: 1.2;}
ul {display: block;margin-block-start: 0em;margin-block-end: 0em;margin-inline-start: 0px;margin-inline-end: 0px;padding-inline-start: 0px;}
a {vertical-align: baseline;background: transparent;text-decoration: none;color: #333;}
a:hover {color: #3291f6;}
form {display: block;margin-top: 0em;margin-block-end: 0em;margin: 0;padding: 0;}button, input, optgroup, option, select, textarea {font-family: inherit;font-size: inherit;font-style: inherit;font-weight: inherit;outline: 0;}
p {margin-block-start: 0em;margin-block-end: 0em;margin-inline-start: 0px;margin-inline-end: 0px;}
p a {color: #333;}
p {font-size: 14px;color: #333;word-wrap: break-word;word-break: break-all;line-height: 2;}
p img {display: flex;border-radius: 10px;width: 50%;margin: 15px auto;}
ul, li {list-style: none;}
::-webkit-scrollbar-thumb {border-radius: 5px;background-color: #ccc;}
::-webkit-scrollbar {height: 0px;}
::-webkit-scrollbar {width: 0;height: 0;}
body {padding-top: 87px;background-color: #fff;}
.header {background-color: #ffffff;position: fixed;width: 100%;top: 0;max-width: 430px;box-shadow: 0 1px 4px rgba(0, 0, 0, .05);font-size: 15px;z-index: 1000;}
.header-up {display: flex;align-items: center;flex-wrap: nowrap;border-bottom: 1px solid #eee;padding: 6.75px 15px;animation: fadeInFromRight 0.3s forwards ease-out;}
.header-up-logo img {height: 30px;vertical-align: middle;}
.header-up-search {margin-left: 10px;}
#search {width: 100%;display: flex;flex-wrap: wrap;}
#wd {width: 90%;padding: 0px 10px 0px 30px;display: inline-block;margin-right: 0px;line-height: 30px;height: 30px;outline: none;box-sizing: border-box;background: #f7f7f7;border-radius: 50px;color: #999999;font-size: 13px;border: none;}
.header-up-search button {cursor: pointer;display: inline-block;outline: none;height: 29px;width: 29px;border: 0;box-sizing: border-box;color: #181818;background: rgb(126 126 126 / 0%);vertical-align: top;padding: 0px;position: absolute;}
.fa-search {color: #777;font-size: 13px;vertical-align: 1px;}
.fa-history {font-size: 20px;color: #333;}
.fa-ellipsis-v {padding-left: 15px;margin-left: 5px;font-size: 20px;color: #333;position: relative;top: 0.5px;}
.watch-history {display: none;position: absolute;top:53px;border-radius: 4px;background-color: #ffffff;border: 1px solid rgb(0 0 0 / 1%);box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);width: 260px;right: 5px;padding: 10px 15px;z-index: 1000;animation: fadeInFromRight 0.3s forwards ease-out;}
.watch-history::after {position: absolute;background-color: #fff;border-top: 1px solid rgb(0 0 0 / 3%);border-left: 1px solid rgb(0 0 0 / 3%);top: -6px;right: 37px;z-index: -1;display: none;margin-left: -4px;width: 8px;height: 8px;border-radius: 0 0 2px 0;content: "";-webkit-transform: rotate(45deg);transform: rotate(45deg);-ms-transform: rotate(45deg);display: block;}
.watch-system {display: none;border-radius: 3px;position: absolute;top: 53px;background-color: #ffffff;border: 1px solid rgb(0 0 0 / 1%);box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);width: 100px;right: 5px;padding: 10px 15px;z-index: 1000;animation: fadeInFromRight 0.3s forwards ease-out;cursor: pointer;}
.watch-system::after {position: absolute;background-color: #fff;border-top: 1px solid rgb(0 0 0 / 3%);border-left: 1px solid rgb(0 0 0 / 3%);top: -6px;right: 7px;z-index: -1;display: none;margin-left: -4px;width: 8px;height: 8px;border-radius: 0 0 2px 0;content: "";-webkit-transform: rotate(45deg);transform: rotate(45deg);-ms-transform: rotate(45deg);display: block;}
@keyframes fadeInFromRight {
0% {transform: translateY(30%);}
100% {transform: translateY(0%);}
}
.text-watch {display: flex;justify-content: space-between;margin-bottom: 15px;}
.history_bg {display: flex;max-height: 500px;overflow-y: auto;flex-direction: column;}
.history_vod {display: flex;justify-content: space-between;align-items: center;margin-bottom: 15px;font-size: 12px;}
.history_vod a {display: flex;flex-direction: column;text-align: center;}
.history_vod img {width: 100px;height: 70px;object-fit: cover;margin-bottom: 5px;border-radius: 5px;}
.history-list.clearfix .pull-right.text-red {color: #3291f6;}
.header-up-button {margin-left: auto;display: flex;}
.header-down {padding: 13.5px 15px;}
.header-down ul {display: flex;flex-wrap: nowrap;overflow: auto;max-width: 100%;width: auto;}
.header-down li {padding-right: 20px;display: inline-block;-webkit-box-flex: 0;-webkit-flex: 0 0 auto;}
.header-down a:hover {font-weight: 700;}
.header-down .active a {color: #3291f6;font-weight: 700;}
.row {margin-top: 1rem;}
.middle-hot {margin-bottom: 1rem;}
.hot-vod {padding: 15px;border-bottom: inherit;}
.hot-vod h3 {color: #191919;font-size: 17px;font-weight: 600;}
.middle-hot ul {display: flex;flex-wrap: nowrap;overflow: auto;width: 100%;}
.middle-hot ul li {width: 28vw;max-width: 120px;margin-left: 15px;}
.middle-hot ul li:last-child {margin-right: 15px;}
.hot-top {margin-bottom: 12px;}
.hot-top img {width: 27vw;height: 38vw;max-width: 120px;max-height: 170px;vertical-align: middle;object-fit: cover;border-radius: 5px;}
.hot-bottom {color: #191919;font-weight: 700;display: flex;flex-direction: column;align-items: center;}
.hot-bottom a {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;width: 25vw;font-size: 13px;max-width: 120px;text-align: center;}
.middle-hot ul li:hover a {color: #3291f6;}
.middle-new {padding: 15px;}
.new-vod {padding-bottom: 15px;}
.new-vod h3 {color: #191919;font-size: 17px;font-weight: 600;}
.middle-new ul {display: flex;justify-content: space-between;flex-wrap: wrap;}
.middle-new ul li {margin-bottom: 15px;}
.middle-new ul li:nth-child(3n) {margin-right: 0;}
.new-top {margin-bottom: 12px;}
.new-top img {width: 27vw;height: 38vw;max-width: 120px;max-height: 170px;vertical-align: top;object-fit: cover;border-radius: 5px;}
.new-bottom {color: #191919;font-weight: 700;display: flex;flex-direction: column;align-items: center;}
.new-bottom a {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;width: 25vw;font-size: 13px;max-width: 120px;text-align: center;}
.middle-new ul li:hover a {color: #3291f6;}
.page {padding-top: 0;padding-right: 15px;padding-bottom: 15px;padding-left: 15px;}
.page ul {display: flex;justify-content: center;}
.page  li {display: inline-block;padding: 0 4px;width: 17.5%;}
.page a {display: inline-block;text-align: center;width: 100%;height: 35px;border: 1px solid;border-radius: 3px;font-size: 13px;line-height: 35px;border-color: #f2f2f2;}
.vod-view {padding: 15px;}
.vod-view h1 {font-size: 17px;font-weight: 600;}
.view-specific {flex-direction: column;padding: 15px 0;display: flex;justify-content: space-between;}
.view-left {display: flex;}
.view-cover {margin-right: 15px;}
.view-cover img {border-radius: 5px;width: 135px;height: 185px;object-fit: cover;}
.view-related {font-size: 13px;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.view-related span {color: #999;}
.vod-go {display: flex;justify-content: center;margin: 1rem 0;font-size: 14px;}
.play-button {color: #ffffff;border-radius: 6px;padding: 7px 16px;background-color: #3291f6;transition: .3s;margin-right: 10px;cursor: pointer;}
.share-button {color: #515c6b;border-radius: 6px;padding: 7px 16px;background-color: rgba(138, 138, 138, .15);transition: .3s;cursor: pointer;}
.play-button:hover {color: #fff;background: #0063cb;}
.share-button:hover {color: #fff;background: #FF9900;}
.vod-go .fa-angle-right {padding: 0 0 0 5px;font-size: 15px;}
.vod-go .fa-qrcode {padding: 0 0 0 5px;font-size: 13px;}
.set-text {display: flex;justify-content: space-between;}
.set-text h3 {color: #191919;font-size: 17px;font-weight: 600;}
.set-text a {font-size: 13px;}
.set-text .fa-sort-numeric-desc {margin-right: 3px;font-size: 12px;}
.set-text .fa-angle-down {margin-left: 3px;font-size: 12px;}
#playlist {display: none;}
#playlist.active {display: block;}
.sort-list {margin-top: 1rem;max-height: 300px;overflow: auto;display: flex;max-width: 100%;width: auto;padding-bottom: 1rem;}
.sort-list li {display: inline-block;-webkit-box-flex: 0;-webkit-flex: 0 0 auto;padding-right: 10px;margin-bottom: 15px;}
.sort-list a {padding: 0 10px;font-size: 14px;background-color: #f8f8f8;border-radius: 4px;text-align: center;line-height: 40px;display: block;}
.view-brief h3 {color: #191919;font-size: 17px;font-weight: 600;margin-bottom: 1rem;}
.view-brief p {color: rgb(102, 102, 102);text-wrap: wrap;}
.play-view {padding: 15px;}
.detail-up {padding-bottom: 0.5rem;}
.detail-up h1 {color: #333;font-size: 16px;font-weight: bold;display: inline-block;margin-right: 10px;}
.detail-up small {color: #999;font-weight: bold;}
.detail-down {color: #666;}
.detail-down span {font-size: 14px;margin-right: 4px;margin-left: 4px;}
.detail-down span:nth-child(1) {margin-left: 0;color: #f50;}
.select-set {margin-top: 1rem;}
.dropdown-box {display: none;}
.dropdown.open .dropdown-box {display: block;}
.dropdown-box {margin-left: -15px;width: 100%;max-width: 430px;position: fixed;bottom: 0;top: auto;background-color: #fff;border-top-right-radius: 5px;border-top-left-radius: 5px;animation: fadeInFromRight 0.3s forwards ease-out;border: 1px solid rgb(0 0 0 / 1%);box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);}
.dropdown-select {padding: 15px 10px;color: #777;position: sticky;border-bottom: 1px solid #d9d9d9;font-size: 14px;font-weight: 600;display: flex;justify-content: center;align-items: center;}
.dropdown-select i {font-size: 14px;margin-right: 3px;color: #f67a32;}
.dropdown-box ul {width: 100%;text-align: center;}
.dropdown-box li {padding: 15px 10px;background-color: #fff;color: #333;position: sticky;border-top: 1px solid #eee;font-size: 12px;}
.dropdown-box a:nth-child(1) li {border-top: 0px solid #eee;}
.dropdown-box .active {padding: 15px 10px;background-color: #3291f6;color: #fff;}
.dropdown-box li:hover {padding: 15px 10px;background-color: #3291f6;color: #fff;}
.dropdown-box small {background: #b30000;color: #fff;box-shadow: 0 3px 10px rgba(0, 0, 0, .2);border-bottom-left-radius: 5px;position: absolute;line-height: 15px;font-size: 10px;padding: 0 5px;top: -1px;right: 35%;}
.play-view .sort-list .active a {color: #3291f6;font-weight: 700;}
.MacPlayer {padding-bottom: 56.25% !important;z-index: 99;}
.embed-responsive {position: relative;display: block;overflow: hidden;padding: 0;height: 0;}
.embed-responsive iframe {position: absolute;top: 0;bottom: 0;left: 0;width: 100%;height: 100%;border: 0;}
.middle-new.random {padding-top: 0;}
.often-list {padding: 15px;}
.list-text {padding-bottom: 15px;}
.list-text h3 {color: #191919;font-size: 16px;font-weight: 600;}
.list-vod li {display: flex;margin-bottom: 1rem;align-items: center;}
.list-left {margin-right: 15px;}
.list-left img {width: 100px;height: 150px;vertical-align: middle;object-fit: cover;border-radius: 5px;}
.list-right a {color: #191919;font-weight: 700;font-size: 14px;}
.list-vod li:hover a {color: #3291f6;}
.list-type {color: #999;}
.list-area {margin-left: 5px;color: #999;}
.list-star {color: #999;}
.list-director {color: #999;}
.list-related {font-size: 12px;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.list-right .list-related:last-child {-webkit-line-clamp: 2;}
.footer {padding: 15px;border-top: 1px solid #eee;}
.footer p {text-align: center;line-height: 1.7;color: #888;}
.map {text-align: center;margin-top: 1rem;font-size: 13px;}
.map a {margin-right: 5px;}
.copyright {text-align: center;margin-top: 1rem;font-size: 14px;}
.gotop {position: fixed;z-index: 999;width: 40px;height: 40px;line-height: 40px;text-align: center;background-color: #fff;right: 10%;cursor: pointer;border-radius: 5px;bottom: 90px;border: #f0f0f0 solid 1px;box-shadow: 0 1px 4px 0 #dfe5ee;}
.gotop {right: 6%;}