body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}

fieldset,
img {
  border: 0;
}

:focus {
  outline: 0;
}

address,
caption,
cite,
code,
dfn,
em,
th,
var,
optgroup {
  font-style: normal;
  font-weight: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
  font-size: 100%;
}

strong {
  font-weight: 700;
}

abbr,
acronym {
  border: 0;
  font-variant: normal;
}

input,
button,
textarea,
select,
optgroup,
option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
}

code,
kbd,
samp,
tt {
  font-size: 100%;
}

input,
button,
textarea,
select {
  *font-size: 100%;
}

input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"]>input[type="button"]::-moz-focus-inner {
  border: none;
  padding: 0;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption {
  text-align: left;
}

sup,
sub {
  font-size: 100%;
}

:link,
:visited,
ins {
  text-decoration: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

.clearfix,
.container-fluid,
.container,
.form-group,
.appel {
  *clear: both;
  *zoom: 1;
}

.clearfix:after,
.clearfix:before,
.container-fluid:after,
.container-fluid:before,
.container:after,
.container:before,
.form-group:after,
.form-group:before,
.appel:after,
.appel:before {
  display: table;
  content: " ";
}

.clearfix:after,
.container-fluid:after,
.container:after,
.form-group:after,
.appel:after {
  clear: both;
}

.hidden {
  display: none !important;
}

.show {
  display: block !important;
}

.hide {
  display: none;
}

.pull-left,
.pull-right {
  display: inline;
}

.pull-left {
  float: left;
}

.pull-right {
  float: right;
}

button,
input,
textarea,
select,
pre {
  font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

pre {
  white-space: normal;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

@font-face {
  font-family: 'iconfont';
  src: url('../font/iconfont.eot');
  src: url('../font/iconfont.eot') format('embedded-opentype'),
    url('../font/iconfont.woff') format('woff'),
    url('../font/iconfont.ttf') format('truetype');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  -webkit-font-smoothing: antialiased;
}

html {
  height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  _background-image: url(about:blank);
  _background-attachment: fixed;
}

body {
  color: #181818;
  font-size: 14px;
  line-height: 1.5;
  font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #fafafa;
  height: 100%;
}

a {
  color: #181818;
  text-decoration: none;
  transition: color .3s, background-color .3s;
}

a:hover {
  color: #000000;
  text-decoration: none;
}

a.hover-underline:hover {
  text-decoration: underline;
}

/* Menu */
.youmu-app {
  background: #fff;
}

.youmu-app dl {
  float: left;
  width: 100%;
  padding: 15px 0;
  border-bottom: 1px solid #000000;
}

.youmu-app dt,
.youmu-app dd {
  float: left;
  line-height: 25px;
  text-align: center;
}

.youmu-app dt {
  width: 10%;
  color: #000;
  font-size: 16px;
}

.youmu-app dd {
  width: 10%;
  font-size: 16px;
}

.youmu-app dt a {
  color: #000000;
}

.youmu-app dd a {
  color: #666;
}

.youmu-app dt a:hover,
.youmu-app dd a:hover {
  color: #e74c3c;
}

.youmu-app dt:after {
  content: "";
  position: absolute;
  margin: 5px 25px 0;
  width: 1px;
  height: 20px;
  background: #000000;
}

.youmu-app dt .cur,
.youmu-app dd .cur {
  color: #e74c3c;
}

/* Hx */
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 400;
}

.h1,
h1 {
  font-size: 32px;
  font-weight: 300;
}

.h2,
h2 {
  font-size: 22px;
  font-weight: 300;
}

.h3,
h3 {
  font-size: 18px;
}

.h4,
h4 {
  font-size: 16px;
}

.h5,
h5 {
  font-size: 14px;
}

.h6,
h6 {
  font-size: 12px;
}

.small,
small {
  font-size: 85%;
}

.inline {
  display: inline !important;
}

.inline-block {
  display: inline-block !important;
  vertical-align: middle;
}

.block {
  display: block !important;
}

.sep {
  padding: 0 10px;
  font-family: simsun;
  opacity: .5;
  filter: alpha(opacity=50);
}

/* mask-white */
.mask-white,
.mask-black {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #fff;
  transition: 0.25s;
}

.mask-black {
  background-color: #000;
}

/* text-align */
.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

.text-nowrap {
  white-space: nowrap;
}

.text-break {
  word-wrap: break-word;
  white-space: normal;
}

.text-justify {
  text-align: justify;
}

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: normal;
  white-space: nowrap;
}

/* border */
.noborder {
  border: 0 none !important;
}

.border-top {
  border-top: 1px solid #eee;
}

.border-right {
  border-right: 1px solid #eee;
}

.border-bottom {
  border-bottom: 1px solid #eee;
}

.border-left {
  border-left: 1px solid #eee;
}

/* text-color */
.text-white {
  color: #fff !important;
}

.text-light {
  color: #999 !important;
}

.text-gray {
  color: #666 !important;
}

.text-dark {
  color: #181818 !important;
}

.text-primary {
  color: #000000 !important;
}

.text-success {
  color: #46be8a !important;
}

.text-info {
  color: #57c7d4 !important;
}

.text-warning {
  color: #f2a654 !important;
}

.text-danger {
  color: #f96868 !important;
}

.text-pink {
  color: #e53b75 !important;
}

.text-purple {
  color: #6d45bc !important;
}

.text-indigo {
  color: #465bd4 !important;
}

.text-red {
  color: #d6494b !important;
}

.text-blue {
  color: #0066cc !important;
}

.text-green {
  color: #27ae60 !important;
}

.text-orange {
  color: #d35400 !important;
}

.text-yellow {
  color: #ffec00 !important;
}

.text-brown {
  color: #8d6658 !important;
}

/* bg-color */
.bg-primary {
  background-color: #369ce0 !important;
}

.bg-success {
  background-color: #46be8a !important;
}

.bg-info {
  background-color: #57c7d4 !important;
}

.bg-warning {
  background-color: #f2a654 !important;
}

.bg-danger {
  background-color: #f96868 !important;
}

.bg-grey {
  background-color: #757575 !important;
}

.bg-red {
  background-color: #f96868 !important;
}

.bg-pink {
  background-color: #f96197 !important;
}

.bg-purple {
  background-color: #926dde !important;
}

.bg-indigo {
  background-color: #677ae4 !important;
}

.bg-blue {
  background-color: #62a8ea !important;
}

.bg-cyan {
  background-color: #57c7d4 !important;
}

.bg-teal {
  background-color: #3aa99e !important;
}

.bg-green {
  background-color: #46be8a !important;
}

.bg-yellow {
  background-color: #ffb300 !important;
}

.bg-orange {
  background-color: #f2a654 !important;
}

.bg-brown {
  background-color: #8d6658 !important;
}

/* margin */
.ma0 {
  margin: 0px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.mr4 {
  margin-right: 4px !important;
}

.mt5 {
  margin-top: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.my10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.my15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mx20 {
  margin-right: 20px !important;
  margin-left: 20px !important;
}

.my20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mr30 {
  margin-right: 30px !important;
}

/* padding */
.pa0 {
  padding: 0px !important;
}

.pt0 {
  padding-top: 0px !important;
}

.pr0 {
  padding-right: 0px !important;
}

.pt3 {
  padding-top: 3px !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.pl5 {
  padding-left: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pa15 {
  padding: 15px !important;
}

.py10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pl15 {
  padding-left: 15px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.px15 {
  padding-right: 15px !important;
  padding-left: 15px !important;
}

.pa20 {
  padding: 20px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.px20 {
  padding-right: 20px !important;
  padding-left: 20px !important;
}

.py20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.px25 {
  padding-right: 25px !important;
  padding-left: 25px !important;
}

.py25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.pa30 {
  padding: 30px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.px30 {
  padding-right: 30px !important;
  padding-left: 30px !important;
}

.py30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.py40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.py50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}


/* visible* */
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}

@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
}

@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
}

@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}

@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

/* label */
.label {
  display: inline-block;
  padding: 2px 4px;
  font-size: 12px;
  line-height: 14px;
  color: #fff;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: #999;
  border-radius: 2px;
}

.label:empty {
  display: none;
}

.label-round {
  border-radius: 1000px;
}

.label-default {
  background-color: #777;
}

.label-primary {
  background-color: #337ab7;
}

.label-success {
  background-color: #5cb85c;
}

.label-warning {
  background-color: #f0ad4e;
}

.label-info {
  background-color: #5bc0de;
}

.label-danger {
  background-color: #d9534f;
}

.label-white {
  background-color: #fff;
  color: #f00;
}

.label-default-outline {
  color: #777;
  border: 1px solid #ccc;
  background-color: transparent;
}

a.label:hover,
a.label:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}

a.label-default:hover,
a.label-default:focus {
  background-color: #5e5e5e;
}

a.label-primary:hover,
a.label-primary:focus {
  background-color: #286090;
}

a.label-success:hover,
a.label-success:focus {
  background-color: #449d44;
}

a.label-info:hover,
a.label-info:focus {
  background-color: #31b0d5;
}

a.label-warning:hover,
a.label-warning:focus {
  background-color: #ec971f;
}

a.label-danger:hover,
a.label-danger:focus {
  background-color: #c9302c;
}

/* caret */
.caret {
  display: inline-block;
  width: 0;
  height: 0;
  overflow: hidden;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  transition: .25s;
  _border-right-style: dashed;
  _border-left-style: dashed;
}

/* iconimg */
.iconimg {
  display: inline-block;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  vertical-align: middle;
  border: 0 none;
  text-indent: -999px;
  *text-indent: 0;
  background-repeat: no-repeat;
}

/* container */
.container {
  margin-right: auto;
  margin-left: auto;
  width: 960px;
}

/* dropdown-menu */
.dropdown-menu {
  position: absolute;
  top: 100%;
  z-index: 9;
  font-size: 14px;
  pointer-events: none;
  border: 1px solid;
  border-color: #ddd;
  border-color: rgba(255, 255, 255, 0);
  *border-color: #ddd;
  background-color: #fff;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.2);
  display: none;
}

.dropdown-menu.in,
.open .dropdown-menu {
  pointer-events: auto;
  display: block;
}

.dropdown-arrow {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  line-height: 0;
  font-size: 0;
  overflow: hidden;
  border-style: dashed dashed solid;
  border-width: 0 7px 5px 7px;
  left: 12px;
}

.dropdown-arrow {
  top: -5px;
  border-color: transparent transparent #ffffff;
}

.dropdown-arrow1 {
  top: -6px;
  border-color: transparent transparent #ddd;
}

/* backdrop */
.backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background-color: rgba(0, 0, 0, .2);
  opacity: 0;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.backdrop.in {
  opacity: 1;
  pointer-events: auto;
  z-index: 900;
}


/* appel */
.content {}

.appel {
  margin-top: 5px;
  padding: 5px;
  background-color: #fff;
}

.appel-heading {
  position: relative;
  height: 32px;
  line-height: 32px;
}

.appel-more {
  float: right;
  color: #999;
}

.appel-more>span>a+a {
  margin-left: 20px;
}

.appel-more>span>a {
  color: #999;
}

.appel-more>span>a:hover {
  color: #000000;
}

.appel-title>small {
  color: #666;
  margin-left: 7px;
  font-weight: 400;
}

.appel-title {
  position: relative;
  float: left;
  /*margin-left: -20px;*/
  padding-left: 20px;
  font-size: 20px;
  font-weight: 700;
}

.appel-title:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 3px;
  height: 20px;
  margin-top: -10px;
  background-color: #000000;
}

/* appel-tabs */
.appel-tabs {}

.appel-tabs>a+a {
  margin-left: 10px;
}

.appel-tabs>a {
  float: left;
  padding: 0 25px;
  color: #666;
  background-color: #f9f9f9;
  border-radius: 100px;
  transition: .15s ease-in-out;
}

.appel-tabs>a:hover,
.appel-tabs>a.active {
  color: #fff;
  background-color: #000000;
}


/* main */
.appel-main {
  width: 100%;
  margin: 0;
  padding: 0;
}


/* box */
.box {
  border: 1px solid;
  border-color: #f0f0f0;
  border-color: rgba(255, 255, 255, 0);
  *border-color: #f0f0f0;
  background-color: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  border-radius: 3px;
}

.box-aside {
  position: relative;
  z-index: 2;
  float: left;
  width: 190px;
  margin-right: -1px;
  border-right: 1px solid #eee;
}

.box-primary {
  float: right;
  width: 947px;
  margin-left: -1px;
  padding: 25px 30px;
  border-left: 1px solid #eee;
  background-color: #fff;
}

/* form-control */
.form-control {
  display: block;
  width: 100%;
  height: 36px;
  line-height: 36px;
  text-indent: 13px;
  font-size: 14px;
  color: #ccc;
  *color: #484848;
  border: 1px solid #e6e8ea;
  background-color: #fff;
  border-radius: 3px;
  transition: border linear .2s, box-shadow linear .2s;
}

.form-control:hover {
  border-color: #bbb;
  text-decoration: none;
}

.form-control:focus {
  color: #484848;
  border-color: #23b4e0;
  box-shadow: 0 0 7px rgba(35, 180, 224, .5);
}

.form-control::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

.form-control:-ms-input-placeholder {
  color: #ccc;
}

.form-control::-webkit-input-placeholder {
  color: #ccc;
}

.form-control[disabled],
.form-control[readonly] {
  border-color: #e5e5e5;
  background-color: #f5f5f6;
  box-shadow: none;
}

.form-control[disabled] {
  cursor: not-allowed;
}

select.form-control {
  text-indent: 0 !important;
}

textarea.form-control {
  height: auto;
  line-height: 1.5;
  text-indent: 0;
  padding: 0 10px;
  word-wrap: normal;
  overflow: auto;
  overflow-y: scroll;
}

/* IE6 form-control */
.form-control-hover {
  border-color: #bbb;
  text-decoration: none;
}

.form-control-focus {
  color: #484848;
  border-color: #23b4e0;
}

.form-control-error,
.form-input-error {
  color: #d95c5c;
  border-color: #dbb1b1;
  background-color: #fff0f0;
}

.form-control-succeed,
.form-input-succeed {
  color: #2eab77;
  border-color: #a6d6c2;
  background-color: #e7fdf4;
}

/* input-sm */
.input-sm {
  height: 28px;
  line-height: 28px;
  text-indent: 7px;
}

select.input-sm {
  height: 30px;
  line-height: 30px;
}

/* help-block */
.help-block {
  display: block;
  margin-top: 5px;
  color: #808080;
  font-size: 13px;
}

/* radio&checkbox  */
.radio,
.checkbox {
  position: relative;
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  cursor: pointer\9;
}

.radio input,
.checkbox input {
  float: left;
  margin: 4px 7px 0 0;
  *margin: 0 3px 0 -3px;
  cursor: pointer;
}

/* btn */
.btn {
  display: inline-block;
  padding: 6px 12px;
  font-size: 14px;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  border: 1px solid transparent;
  background-color: transparent;
  border-radius: 3px;
  transition: .3s;
}

/* .btn-block */
.btn-block {
  display: block;
  width: 100%;
}

/* btn-size  */
.btn-lg {
  line-height: 30px;
  font-size: 18px;
  padding: 15px 70px;
}

/* btn-small  */
.btn-sm {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

/* btn-xs  */
.btn-xs {
  padding: 0 7px;
  font-size: 12px;
}

/* btn-default */
.btn-default {
  color: #333;
  border-color: #ddd;
  background-color: #fff;
}

.btn-default:hover {
  color: #000000;
  border-color: #ddd;
  background-color: #f9f9f9;
}

.btn-default:active {
  color: #000000;
  border-color: #d7d7d7;
  background-color: #f5f5f5;
}

/* btn-outline */
.btn-outline {
  color: #808080;
  border-color: #e5e5e5;
}

.btn-outline:hover {
  color: #181818;
  border-color: #ccc;
  background-color: #f9f9fa;
}

.btn-outline:active {
  border-color: #d7d7d7;
  background-color: #eee;
}

/* btn-primary */
.btn-primary {
  color: #fff;
  border-color: #000000;
  background-color: #000000;
}

.btn-primary:hover {
  color: #fff;
  border-color: #ff5752;
  background-color: #ff5752;
}

.btn-primary:active {
  background-color: #fe2e29;
}

/* btn-red */
.btn-red {
  color: #fff;
  border-color: #ce3638;
  background-color: #ce3638;
}

.btn-red:hover {
  color: #fff;
  border-color: #db393c;
  background-color: #db393c;
}

.btn-red:active {
  background-color: #c23235;
}

/* btn-green */
.btn-green {
  color: #fff;
  border-color: #29a562;
  background-color: #29a562;
}

.btn-green:hover {
  color: #fff;
  border-color: #2db36b;
  background-color: #2db36b;
}

.btn-green:active {
  background-color: #26995c;
}

/* btn-orange */
.btn-orange {
  color: #fff;
  border-color: #e88c3a;
  background-color: #e88c3a;
}

.btn-orange:hover {
  color: #fff;
  border-color: #f5933d;
  background-color: #f5933d;
}

.btn-orange:active {
  background-color: #db8437;
}

/* btn-disabled */
/*.btn.disabled,.btn.disabled:hover,.btn.disabled:active,*/
.btn-disabled,
.btn-disabled:hover,
.btn-disabled:active {
  cursor: default;
  box-shadow: none;
  text-shadow: 0 1px 0 #fff;
  color: #aaa;
  border-color: #ddd;
  background-color: #f2f2f2;
}

/* btn-group */
.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.btn-group>.btn,
.btn-group-vertical>.btn {
  position: relative;
  float: left;
}

.btn-group>.btn:hover,
.btn-group-vertical>.btn:hover,
.btn-group>.btn:focus,
.btn-group-vertical>.btn:focus,
.btn-group>.btn:active,
.btn-group-vertical>.btn:active,
.btn-group>.btn.active,
.btn-group-vertical>.btn.active {
  z-index: 2;
}

.btn-group .btn+.btn,
.btn-group .btn+.btn-group,
.btn-group .btn-group+.btn,
.btn-group .btn-group+.btn-group {
  margin-left: -1px;
}

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}

.btn-group>.btn:first-child {
  margin-left: 0;
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-group>.btn:last-child:not(:first-child),
.btn-group>.dropdown-toggle:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group>.btn-group {
  float: left;
}

.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn {
  border-radius: 0;
}

.btn-group>.btn-group:first-child:not(:last-child)>.btn:last-child,
.btn-group>.btn-group:first-child:not(:last-child)>.dropdown-toggle {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-group>.btn-group:last-child:not(:first-child)>.btn:first-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0;
}

.btn-group>.btn+.dropdown-toggle {
  padding-right: 8px;
  padding-left: 8px;
}

.btn-group>.btn-lg+.dropdown-toggle {
  padding-right: 12px;
  padding-left: 12px;
}

.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn .caret {
  margin-left: 0;
}

/* form-group */
.form-group {
  margin-bottom: 15px;
}

.form-group .control-label {
  display: inline-block;
  max-width: 100%;
  line-height: 20px;
  padding-top: 10px;
}

.form-group .btn-link,
.form-group .radio,
.form-group .checkbox {
  margin-top: 0;
}

.form-text {
  padding-top: 7px;
}

/* col-xs-* */
.col-xs-06,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
  float: left;
  *display: inline;
  *overflow: hidden;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-11 {
  width: 91.66666667%;
}

.col-xs-10 {
  width: 83.33333333%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-8 {
  width: 66.66666667%;
}

.col-xs-7 {
  width: 58.33333333%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-5 {
  width: 41.66666667%;
  *width: 41%;
}

.col-xs-4 {
  width: 33.33333333%;
}

.col-xs-3 {
  width: 25%;
  *width: 24.99999%;
}

.col-xs-2 {
  width: 16.66666667%;
}

.col-xs-1 {
  width: 8.33333333%;
}

.col-xs-06 {
  width: 5.33333333%;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

.col-xs-offset-11 {
  margin-left: 91.66666667%;
}

.col-xs-offset-10 {
  margin-left: 83.33333333%;
}

.col-xs-offset-9 {
  margin-left: 75%;
}

.col-xs-offset-8 {
  margin-left: 66.66666667%;
}

.col-xs-offset-7 {
  margin-left: 58.33333333%;
}

.col-xs-offset-6 {
  margin-left: 50%;
}

.col-xs-offset-5 {
  margin-left: 41.66666667%;
}

.col-xs-offset-4 {
  margin-left: 33.33333333%;
}

.col-xs-offset-3 {
  margin-left: 25%;
}

.col-xs-offset-2 {
  margin-left: 16.66666667%;
}

.col-xs-offset-1 {
  margin-left: 8.33333333%;
}

.col-xs-offset-0 {
  margin-left: 0;
}

/* ff-collapse */
.ff-collapse {
  display: none;
}

.ff-collapse.in {
  display: inline;
}

/* fade */
.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -moz-transition: opacity .15s linear;
  -ms-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}

.fade.in {
  opacity: 1;
}

/* tab-pane */
.tab-content>.tab-pane {
  display: none;
}

.tab-content>.tab-appel {
  display: none;
}

.tab-content>.active {
  display: block;
}

/* tooltip */
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  filter: alpha(opacity=0);
  opacity: 0;
  line-break: auto;
}

.tooltip.in {
  filter: alpha(opacity=90);
  opacity: .9;
}

.tooltip.top {
  top: 0;
  padding: 5px 0;
  margin-top: -3px;
}

.tooltip.right {
  padding: 0 5px;
  margin-left: 3px;
}

.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px;
}

.tooltip.left {
  padding: 0 5px;
  margin-left: -3px;
}

.tooltip-inner {
  max-width: 200px;
  padding: 7px 12px;
  color: #fff;
  text-align: center;
  background-color: #181818;
  background-color: rgba(0, 0, 0, .9);
  border-radius: 4px;
}

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
  border-top-color: rgba(0, 0, 0, .9);
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000;
  border-right-color: rgba(0, 0, 0, .9);
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000;
  border-left-color: rgba(0, 0, 0, .9);
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
  border-bottom-color: rgba(0, 0, 0, .9);
}

/* tooltip.error */
.tooltip.error {
  cursor: pointer;
  display: none;
}

.tooltip.error {
  filter: alpha(opacity=100);
  opacity: 1;
}

.tooltip.error .tooltip-inner {
  min-width: 170px;
  max-width: 350px;
  text-align: left;
  color: #e00;
  padding: 8px 12px;
  font-size: 14px;
  border: 1px solid #e9c786;
  background-color: #fef4e2;
}

.tooltip.error.top {
  top: 0;
  margin-top: -50px;
  white-space: nowrap;
}

.tooltip.error.top .tooltip-arrow {
  border-top-color: #e9c786;
  left: 25px;
}

.tooltip.error.right {
  left: 100%;
  top: 0;
}

.tooltip.error.right .tooltip-arrow {
  border-right-color: #ebccd1;
  top: 19px;
}

.tooltip.error.bottom {
  top: 100%;
}

.tooltip.error.bottom .tooltip-arrow {
  border-bottom-color: #ebccd1;
  left: 25px;
}

.tooltip.error.left {
  right: 100%;
  top: 0;
  margin-right: 5px;
}

.tooltip.error.left .tooltip-arrow {
  border-left-color: #ebccd1;
}

/* hr */
hr {
  height: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
  clear: both;
}

/* table */
.table {
  width: 100%;
  font-size: 14px;
  margin-bottom: 20px;
  background-color: #fff;
}

.table th {
  background-color: #fcfcfc;
  white-space: nowrap;
}

.table th,
.table td {
  padding: 10px 20px;
  vertical-align: middle;
  border-top: 1px solid #eee;
}

.table>tbody>tr:nth-child(2n) td {
  background-color: #fcfcfc;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid #ededed;
}

.table-custom {
  border: 1px solid #eee;
}

.table-custom th,
.table-custom td {
  padding: 15px 25px;
  border-top: 0 none;
  border-bottom: 1px solid #eee;
  text-align: center;
  color: #808080;
}

.table-custom thead th {
  border-bottom: 1px solid #e5e5e5;
  font-size: 14px;
  color: #666;
  font-weight: 700;
}

.table-custom>tbody>tr:hover {
  background-color: transparent;
}

.table-condensed th,
.table-condensed td {
  padding: 5px 10px;
}

.table-condensed th {
  font-size: 14px;
}

.table-responsive {
  width: 100%;
  min-height: .01%;
  overflow-x: auto;
  margin-bottom: 20px;
}

.table-responsive .table {
  margin-bottom: 0;
}

/* header */
.header {
  background-color: #000000;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}

.navbar-header {
  height: 66px;
  padding: 10px 10px;
}

.navbar-header .container {
  position: relative;
}

/* navbar-brand */
.navbar-brand {
  float: left;
  height: 50px;
}

.navbar-brand img {
  display: block;
  height: 50px;
}


/* navbar-account */
.navbar-goback {
  display: none;
}

.navbar-history .history-toggle {
  display: none;
}

.navbar-history {
  float: right;
  margin-left: 10px;
}

.navbar-history>a {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-indent: 1px;
  overflow: hidden;
  text-align: center;
  font-size: 24px;
  border-radius: 50%;
  color: #000000;
}

.navbar-history>.dropdown-menu {
  right: 0;
  width: 250px;
  padding-bottom: 5px;
  z-index: 999;
}

.navbar-history p {
  border-top: 1px solid #f5f5f5;
  padding: 7px 0 2px 0;
}

.history-heading {
  height: 40px;
  line-height: 40px;
  padding: 0 10px 0 15px;
  border-bottom: 1px solid #f5f5f5;
}

.history-heading>h5 {
  float: left;
  color: #666;
}

.history-heading>a {
  float: right;
  color: #666;
  margin-left: 10px;
}

.history-heading>a:hover {
  color: #000000;
}

.history-list {}

.history-list>li {
  position: relative;
  padding: 0 15px;
  line-height: 38px;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: normal;
  white-space: nowrap;
}

.history-list>li+li {
  border-top: 1px solid #f0f0f0;
}

/* navbar-search */
.navbar-search {
  float: right;
  position: relative;
  width: 400px;
  height: 36px;
  border: 1px solid #000000;
  border-radius: 36px;
}

.appel .navbar-search {
  float: none;
  width: auto;
  margin: 5px;
}

/* search-control */
.navbar-search>.search-control {
  position: absolute;
  top: 0;
  left: 0;
  color: #181818;
  width: 100%;
  height: 34px;
  line-height: 20px;
  padding: 7px 20px;
  border: 0 none;
  background-color: transparent;
  border-radius: 100px;
}

/* search-button */
.navbar-search>.search-button {
  position: absolute;
  top: -1px;
  right: -1px;
  width: 80px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  border: 0 none;
  background-color: #000000;
  border-radius: 0 36px 36px 0;
}

.navbar-search>.search-button:hover {
  background-color: #ff5b57;
}

/* search-hotkey */
.search-hotkey {
  padding: 5px 5px 0 5px;
}

.search-hotkey h5 {
  font-weight: 700;
  margin-bottom: 10px;
}

.search-hotkey a {
  margin: 0 10px 10px 0;
}

/* autocomplete-suggestions */
.autocomplete-suggestions {
  font-size: 14px;
  border: 1px solid;
  border-color: #ddd;
  border-color: rgba(255, 255, 255, 0);
  overflow: hidden;
  padding: 3px 0;
  background-color: #fff;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
}

.autocomplete-suggestion {
  padding: 6px 10px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
}

.autocomplete-suggestion strong {
  color: #000000;
}

.autocomplete-suggestion:hover,
.autocomplete-suggestion:active {
  background-color: #f5f5f5;
}


/* navbar-primary */
.navbar-primary {
  height: 50px;
  font-size: 16px;
  color: #fff;
  background-color: #000000;
}

.navbar-nav>li {
  float: left;
  position: relative;
  line-height: 45px;
  padding: 0 5px;
}

.navbar-nav>li+li:before {
  content: "·";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 16px;
  opacity: .5;
  filter: alpha(opacity=50);
}

.navbar-nav>li>a {
  position: relative;
  display: block;
  height: 45px;
  line-height: 44px;
  text-align: center;
  padding: 0 30px;
  color: #222;
  transition: .3s;
}

.navbar-nav>li:first-child>a {
  padding-left: 0;
}

.navbar-nav>li>a:hover {
  color: #000000;
  font-weight: 700;
}

.navbar-nav>li.active>a,
.navbar-nav>li.active>a:hover {
  font-weight: 700;
  color: #000000;
}

.navbar-nav>li.movie {
  width: 60px;
  color: #666;
}

.navbar-nav>li.movie+li:before {
  display: none;
}

.navbar-primary .navbar-nav>li>a,
.navbar-primary .navbar-nav>li>a:hover {
  color: #fff;
  height: 50px;
  line-height: 50px;
}

.navbar-primary .navbar-nav>li.active>a,
.navbar-primary .navbar-nav>li.active>a:hover {
  color: #fff;
}

.navbar-primary .navbar-nav>li.active>a::after {
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -6px;
  bottom: 0;
  width: 0;
  height: 0;
  border-bottom: 6px solid;
  border-left: 6px dashed transparent;
  border-right: 6px dashed transparent;
}

.navbar-primary .navbar-nav>li.active>a::after {
  margin: 0;
  left: 40px;
}

.navbar-primary .navbar-nav>li:first-child.active>a::after {
  margin: 0;
  left: 12px;
}

/* friend-link */
.friend-link {
  padding: 10px 0 0 0;
}

.friend-link a {
  margin-right: 10px;
}

/* footer */
.footer {
  margin-top: 20px;
  padding: 20px 0;
  line-height: 24px;
  color: #ffffff;
  text-align: center;
  background-color: #000000;
}

/* footer */
.footer a {
  color: #999;
}

.footer a:hover {
  color: #000000;
}

/* backtop */
.backtop {
  position: fixed;
  right: 0;
  bottom: 20px;
  display: none;
  z-index: 9999;
}

.backtop .iconfont {
  width: 50px;
  height: 50px;
  line-height: 50px;
  display: block;
  overflow: hidden;
  text-align: center;
  font-size: 26px;
  color: #fff;
  background-color: rgba(0, 0, 0, .5);
}

.backtop:hover .iconfont {
  background-color: #000000;
}


/* thumbnail-group */
.appel-max {
  padding: 0 2px;
  clear: both;
}

.appel>.appel:first {
  margin-top: -20px;
}

.thumbnail-group {
  margin: 0 0 0 -20px;
}

.thumbnail-group>li {
  float: left;
  width: 22.7%;
  margin: 20px 0 0 20px;
}

/* h5 */
.thumbnail-group>li>.video-info {
  padding-top: 8px;
}

.thumbnail-group>li>.video-info>h4 {
  overflow: hidden;
  font-size: 14px;
  line-height: 18px;
  height: 36px;
}

.thumbnail-group>li>.video-info>h5,
.thumbnail-group>li>.video-info>p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.thumbnail-group>li>.video-info>h5 {
  height: 18px;
  line-height: 18px;
  overflow: hidden;
}

.thumbnail-group>li>.video-info>p {
  font-size: 12px;
  color: #999;
  line-height: 14px;
  height: 14px;
  width: 100%;
  margin-top: 5px;
}

.thumbnail-group>li>.video-info>p>a {
  color: #999;
  margin-right: 6px;
}

.thumbnail-group>li>.video-info>p>a:hover {
  color: #000000;
}

/* thumbnail */
.thumbnail-group>li>.thumbnail {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  background-color: #454545;
}

.thumbnail-group>li>.thumbnail .video-grade {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 46px;
  line-height: 30px;
  padding: 13px 10px 0 0;
  overflow: hidden;
  color: #fff;
  text-align: right;
  font-size: 12px;
  background: url(../image/video-mask.png) 0 0 repeat-x;
}

.thumbnail-group>li>.thumbnail .video-number {
  position: absolute;
  z-index: 1;
  right: 5px;
  bottom: 5px;
  display: block;
  overflow: hidden;
  color: #fff;
  padding: 0 8px;
  line-height: 20px;
  font-size: 12px;
  background-color: rgba(0, 0, 0, .6);
  border-radius: 100px;
}

.thumbnail-group>li>.thumbnail img {
  display: block;
  width: 100%;
  height: 145px;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.5s;
  -o-transition: all linear 0.3s;
  transition: all linear 0.3s;
}

.thumbnail-group>li>.thumbnail:hover img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);

}

.thumbnail-group>li>.thumbnail:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: opacity 300ms linear;
  background: url(../image/video-play.png) no-repeat center rgba(0, 0, 0, .15);
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: all ease-out .35s;
  transition: all ease-out .35s;
}

.thumbnail-group>li>.thumbnail:hover:after {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

/* thumbnail-group-small */
.thumbnail-group-small>li {}

.thumbnail-group-small>li>.thumbnail,
.thumbnail-group-small>li>.thumbnail img {
  height: 100px;
}

.thumbnail-group-small>li>.thumbnail:hover:after {
  background-size: 30%;
}

/* thumbnail-group-special */
.thumbnail-group-special {
  clear: both;
}

.thumbnail-group-special>li {
  width: 275px;
}

.thumbnail-group-special>li>.thumbnail,
.thumbnail-group-special>li>.thumbnail img {
  width: 275px;
  height: 130px;
}

.thumbnail-group-special>li>.video-info {
  text-align: center;
}

/* list-group */
.thumbnail-group+.list-group {
  border-top: 1px dashed #eee;
  margin-top: 18px;
  padding-top: 15px;
}

.list-group {
  margin: 0 0 -5px 0;
}

.list-group>li>.sep {
  padding: 0 4px;
  font-size: 12px;
  color: #999;
}

.list-group>li>span {
  color: #999;
}

.list-group>li>a {
  color: #666;
}

.list-group>li>a:hover {
  text-decoration: underline;
  color: #000000;
}

.list-group>li {
  float: left;
  width: 25%;
  color: #666;
  line-height: 30px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  padding-right: 20px;
}

.list-group-50>li {
  width: 100%;
}

.list-group-dot>li::before {
  content: "·";
  font-size: 14px;
  padding-right: 8px;
}

/* rank-group */
.rank-group {
  margin: 0 0 -5px 0;
  list-style: decimal;
  list-style-position: inside;
}

.rank-group>li {
  position: relative;
  line-height: 30px;
  color: #000000;
}

.rank-group>li a {
  color: #333;
}

.rank-group>li a:hover {
  color: #000000;
}

.rank-group>li>.rank-grade strong {
  font-weight: 400;
  font-size: 13px;
}

.rank-group>li>.rank-grade {
  display: none;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -10px;
  font-size: 12px;
  color: #999;
  line-height: 20px;
}

.rank-group>li>.rank-title {
  position: absolute;
  top: 0;
  left: 25px;
  right: 0;
  display: block;
  color: #999;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* filter */
.filter {
  padding: 10px 10px 5px 10px;
}

.filter dt {
  float: left;
  width: 70px;
  color: #666;
  text-align: right;
  margin-right: 15px;
}

.filter dd {
  float: left;
}

.filter a.active {
  color: #fff;
  background-color: #000000;
}

.filter-primary {
  line-height: 40px;
  font-size: 16px;
  position: relative;
  padding-bottom: 5px;
}

.filter-primary dt {
  margin-right: 5px;
}

.filter-primary dd {
  padding: 0 10px;
}

.filter-primary dd a {
  padding: 0 10px;
}

.filter-primary .filter-more {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 14px;
  border-radius: 3px;
}

.filter-primary .filter-more a {
  color: #666;
  display: block;
  padding: 0 20px;
  border-radius: 3px;
}

.filter-primary .filter-more a:hover {
  color: #000000;
  background-color: #f9f9f9;
}

.filter-append {
  overflow: hidden;
  padding: 5px 20px 5px 0;
  line-height: 30px;
  display: none;
}

.filter-append>dl {
  padding: 0 0 5px 0;
}

.filter-append dd {
  margin-right: 7px;
}

.filter-append dd a {
  padding: 0 10px;
}

/* category */
.category {
  border-top: 1px solid #f5f5f5;
  margin-top: 20px;
  padding-top: 20px;
  line-height: 30px;
  margin-bottom: -10px;
}

.category dt {
  float: left;
  color: #666;
  padding-right: 5px;
}

.category dd {
  font-size: 0;
  overflow: hidden;
  position: relative;
}

.category dd a {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  height: 30px;
  line-height: 30px;
  margin-right: 9px;
  margin-bottom: 10px;
  padding: 0 15px;
  border-radius: 30px;
  background-color: #f8f8f8;
}

.category dd a:hover,
.category dd a:active,
.category dd a.active {
  color: #fff;
  background-color: #000000;
}

/* pagination */
.pagination {
  text-align: center;
  padding: 30px 0;
  overflow: hidden;
  clear: both;
  font-size: 0;
}

.pagination>li {
  display: inline-block;
  vertical-align: middle;
}

.pagination>li>a {
  display: block;
  margin: 0 4px;
  padding: 0 15px;
  height: 36px;
  line-height: 36px;
  font-size: 16px;
  background-color: #f5f5f5;
  border-radius: 3px;
  cursor: pointer;
}

.pagination>li>a:hover,
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover {
  z-index: 2;
  color: #fff;
  background-color: #000000;
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover {
  cursor: default;
}

.pagination>.disabled>a,
.pagination>.disabled>a:focus,
.pagination>.disabled>a:hover {
  z-index: 2;
  color: #fff;
  cursor: pointer;
  background-color: #000000;
}

/* pager */
.pager {
  padding: 20px 0;
}

.pager>li>a {
  margin: 0 7px;
  padding: 0 25px;
  font-size: 14px;
  background-color: #f5f5f5;
  border-radius: 30px;
}


/* breadcrumbs */
.breadcrumbs {
  padding: 20px 0;
}

.appel .breadcrumbs {
  padding-top: 0;
}

/* detail */
.detail {
  position: relative;
}

/* detail-mobile */
.detail-mobile {
  position: absolute;
  right: 0;
  top: -42px;
}

.detail-mobile .dropdown-menu {
  right: 0;
  padding: 10px;
  z-index: 1080;
}

.detail-mobile .dropdown-menu img {
  display: block;
  max-width: 200px;
}

/* detail-poster */
.detail-poster {
  float: left;
  width: 350px;
}

.detail-poster>a {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  height: auto;
}

.detail-poster>a img {
  display: block;
  width: 100%;
  min-height: auto;
}

.detail-poster>a:hover:after {
  opacity: 1;
}

.detail-poster>a:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: opacity 300ms linear;
  background: url(../image/video-play.png) no-repeat center rgba(0, 0, 0, .3);
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: all ease-out .35s;
  transition: all ease-out .35s;
}

.detail-poster>a:hover:after {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

/* detail-info */
.detail-info {
  overflow: hidden;
  padding-left: 20px;
}

.detail-info .detail-header {
  position: relative;
  margin-bottom: 10px;
}

.detail-info .score-wrap {
  position: absolute;
  right: 0;
  top: 13px;
}

.detail-info h2 {
  font-size: 30px;
  line-height: 35px;
  font-weight: 400;
}

.detail-info h2 small {
  font-size: 16px;
  margin-left: 20px;
  font-weight: 400;
  color: #000000;
}

.detail-info h3 {
  font-size: 16px;
  color: #666;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: normal;
  white-space: nowrap;
}

.detail-info .detail-actor>li {
  padding-top: 6px;
  line-height: 24px;
  overflow: hidden;
  color: #666;
}

.detail-info .detail-actor>li span,
.detail-info .detail-actor>li a {
  margin-right: 10px;
}

.detail-info .detail-actor>li label span {
  margin-right: 0 !important;
}

.detail-info .detail-actor>li a.ff-tag-link {
  margin-right: 0;
  text-decoration: underline;
}

.detail-info .detail-actor>li p {
  float: left;
  width: 30%;
}

.detail-info .detail-actor>li p a:after {
  display: none;
}

.detail-info .detail-actor>li.intro {
  white-space: normal;
  position: relative;
}

.detail-info .detail-actor>li.intro p {
  float: none;
  clear: both;
  width: auto;
  line-height: 24px;
  padding: 3px 0;
  overflow: hidden;
  max-height: 78px;
}

.detail-info .detail-actor>li.owl p {
  max-height: none;
}

.detail-info .detail-actor>li.intro .detail-intro-more {
  position: absolute;
  right: 0;
  bottom: 3px;
  margin: 0;
  padding-left: 15px;
  background-color: #fff;
}

/* score */
.score {
  line-height: 20px;
  font-size: 0;
  position: relative;
}

.score>em,
.score>label {
  font-size: 14px;
  color: #666;
  display: inline-block;
  vertical-align: middle;
}

.score>em {
  padding-left: 5px;
  color: #000000;
  font-size: 16px;
}

.score>em>sup {
  font-size: 14px;
  vertical-align: top;
  margin-left: 2px;
}

.score>span {
  display: inline-block;
  vertical-align: middle;
  line-height: 20px;
  width: 105px;
  font-size: 14px;
  white-space: nowrap;
}

.score>span>i {
  display: inline-block;
  vertical-align: -2px;
  width: 18px;
  height: 18px;
  overflow: hidden;
  text-indent: -999px;
  background: url(../image/score.png) 0 0 no-repeat;
}

.score>span>i.star-half-png {
  background-position: 0 -20px;
}

.score>span>i.star-on-png {
  background-position: 0 -40px;
}

/* detail-source */
.detail-source {
  float: none;
  width: 100%;
  padding: 10px 0;
  clear: both;
}


/* detail-tab */
.detail-tab {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 10px;
}

.detail-tab>li {
  float: left;
  cursor: pointer;
  display: block;
  text-align: center;
  margin: 0 -1px -1px 0;
  border: 1px solid #e5e5e5;
  background-color: #f9f9f9;
}

.detail-tab>li>a {
  display: block;
  padding: 8px 24px;
}

.detail-tab>li>a:hover {
  color: #000000;
  background-color: #fff;
}

.detail-tab>li.active {
  position: relative;
  margin-top: -2px;
  border-radius: 3px 3px 0 0;
  border-bottom-color: #fff;
  background-color: #fff;
}

.detail-tab>li.active>a,
.detail-tab>li.active>a:hover {
  padding-top: 10px;
  color: #000000;
  font-weight: 700;
  border-radius: 3px 3px 0 0;
}

/* detail-tab-zt */
.detail-tab-zt {
  padding-right: 50pxs;
  position: relative;
}

.detail-tab-zt>li.zt {
  float: right;
  border-color: transparent;
  background-color: transparent;
}

.detail-tab-zt>li.zt>a {
  padding-left: 0;
  padding-right: 0;
}

.detail-tab-zt>li.zt>a:hover {
  text-decoration: underline;
}


/* detail-download */
.detail-download {
  border-top: 1px solid #f5f5f5;
}

.detail-download .detail-content {
  max-height: 400px;
  overflow-x: hidden;
  overflow-y: auto;
  border-top: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
  margin: 3px 0;
}

.detail-download .table {
  margin: 0;
}

.detail-download .table td {
  border: 0 none;
  padding: 5px;
  white-space: nowrap;
  font-size: 0;
}

.detail-download .table>tbody>tr:nth-child(2n) td {
  background-color: transparent;
}

.detail-download .table .code {
  width: 100%;
  line-height: 30px;
}

.detail-download .table .btns {
  width: 70px;
}

.detail-download .table .btns .btn {
  display: block;
  white-space: nowrap;
}

.detail-download .table .title {
  font-size: 14px;
}

/* detail-play-list */
.detail-play-list {
  margin: 0 -5px;
  display: none;
}

.detail-play-list li {
  float: left;
  min-width: 12.5%;
}

.detail-play-list li>a {
  display: block;
  margin: 5px;
  line-height: 35px;
  text-align: center;
  border-radius: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 1px solid #e5e5e5;
  background-color: #fff;
}

.detail-play-list li>a:hover {
  color: #000000;
  background-color: #fff;
}

.detail-play-list-dianshiju li {
  min-width: 8.333333333333333%;
}

.detail-play-list-zongyi li {
  width: auto;
  min-width: 14.28%;
}

.detail-play-list-zongyi li a {
  padding: 0 13px;
}

/* bdsharebuttonbox */
.bdsharebuttonbox {}

.bdsharebuttonbox a {
  background-image: url(../image/share-icons.png) !important;
  margin: 6px 0 0 6px !important;
}

.bdshare-button-style0-24 .bds_tsina {
  background-position: 0 0 !important;
}

.bdshare-button-style0-24 .bds_qzone {
  background-position: -34px 0 !important;
}

.bdshare-button-style0-24 .bds_tqq {
  background-position: -68px 0 !important;
}

.bdshare-button-style0-24 .bds_renren {
  background-position: -102px 0 !important;
}

.bdshare-button-style0-24 .bds_kaixin001 {
  background-position: -136px 0 !important;
}

.bdshare-button-style0-24 .bds_tieba {
  background-position: -170px 0 !important;
}

.bdshare-button-style0-24 .bds_douban {
  background-position: -204px 0 !important;
}

.bdshare-button-style0-24 .bds_weixin {
  background-position: -238px 0 !important;
}

.bdshare-button-style0-24 .bds_sqq {
  background-position: -272px 0 !important;
}

.bdshare-button-style0-24 .bds_copy {
  background-position: -306px 0 !important;
}

.bdshare-button-style0-24 .bds_more {
  background-position: -340px 0 !important;
}

.bdshare-button-style0-32 .bds_tsina {
  background-position: 0 -40px !important;
}

.bdshare-button-style0-32 .bds_tqq {
  background-position: -42px -40px !important;
}

.bdshare-button-style0-32 .bds_qzone {
  background-position: -84px -40px !important;
}

.bdshare-button-style0-32 .bds_renren {
  background-position: -126px -40px !important;
}

.bdshare-button-style0-32 .bds_douban {
  background-position: -168px -40px !important;
}

.bdshare-button-style0-32 .bds_kaixin001 {
  background-position: -210px -40px !important;
}

.bdshare-button-style0-32 .bds_tieba {
  background-position: -252px -40px !important;
}

.bdshare-button-style0-32 .bds_sqq {
  background-position: -294px -40px !important;
}

.bdshare-button-style0-32 .bds_copy {
  background-position: -336px -40px !important;
}

.bdshare-button-style0-32 .bds_weixin {
  background-position: -378px -40px !important;
}

.bdshare-button-style0-32 .bds_more {
  background-position: -420px -40px !important;
}

/* play */
.play {
  position: relative;
  padding: 2px 0 0 0;
  color: #ccc;
  background: url(../image/play-bg.jpg) no-repeat;
  background-color: #232324;
  background-size: cover;
  background-position: center;
}

.play h2 {
  margin-bottom: 20px;
}

.play h2>a {
  color: #ccc;
  margin-right: 5px;
}

.play h2>a:hover {
  color: #fff;
}

.play h2>small {
  color: #ccc;
}

.play .player {
  position: relative;
  width: 100%;
  height: 675px;
  margin: 0 auto;
  background-color: #181818;
  box-shadow: 0 -5px 50px 0 rgba(0, 0, 0, .3);
}

.play .player iframe {
  width: 100%;
  height: 100%;
}

.play-interaction {
  height: 58px;
  padding: 0 18px 0 13px;
  background-color: #2b2b2b;
  box-shadow: 0 -5px 50px 0 rgba(0, 0, 0, .3);
}

.play-interaction>.score-wrap {
  float: right;
  margin: 19px 19px 0 0;
}

.play-interaction>.score>label {
  color: #ccc;
}

.play-interaction>.play-btn {
  float: right;
  margin-top: 13px;
  font-size: 0;
}

.play-interaction>.play-btn>a {
  display: inline-block;
  height: 32px;
  line-height: 30px;
  padding: 0 18px;
  margin-left: 10px;
  font-size: 12px;
  color: #fff;
  background-color: #37373d;
  border-radius: 3px;
}

.play-interaction>.play-btn>a:hover {
  background-color: #444;
}

.play-interaction>.play-btn>a:active {
  background-color: #1c1c1c;
}

.play-interaction>.play-btn>a.disabled,
.play-interaction>.play-btn>a.disabled:hover,
.play-interaction>.play-btn>a.disabled:active {
  cursor: default;
  color: #ccc;
  background-color: #1c1c1c;
}

.play-share {
  float: left;
  margin-top: 11px;
}

.play-interaction>.play-clipboard {
  float: left;
  margin-top: 8px;
}

.play-interaction>.play-clipboard>a {
  height: 32px;
  line-height: 30px;
  padding: 0 18px;
  font-size: 12px;
}

.play-interaction .detail-mobile {
  position: relative;
  top: auto;
  float: left;
  margin-top: 13px;
}

.play-interaction .detail-mobile .dropdown-menu {
  right: auto;
  left: 0;
}

.play-weixintip {
  font-size: 12px;
  padding: 7px 10px;
  line-height: 1.2;
  background-color: #ffedc4;
  color: #f60;
}

/* play-source */
.play-source {
  margin-top: 0;
  padding-bottom: 15px;
}

.play-source .detail-source {
  float: none;
  width: auto;
  padding: 0;
  position: relative;
}

.play-source .detail-play-list li {
  width: 10%;
}

.play-source .detail-play-list li.active>a,
.play-source .detail-play-list li.active>a:hover {
  color: #fff;
  border-color: #000000;
  background-color: #000000;
}

/* play-intro */
.play-intro {
  padding: 10px 0 0 0;
  color: #999;
}

.play-intro span {
  margin-right: 10px;
}

.play-intro a {
  margin-right: 5px;
  color: #666;
}

.play-intro a:hover {
  color: #000000;
}

.play-intro .summary {
  padding-top: 10px;
}

.play-intro pre {
  padding-top: 10px;
}

/* news */
.news-main {
  width: 820px;
  float: left;
}

.news-aside {
  width: 360px;
  float: right;
}

/* news-group */
.news-group {
  list-style: circle;
  margin: 10px 0 0 18px;
}

.news-group>li {
  height: 33px;
}

.news-group>li>.rank-title {
  top: 0;
  left: 0;
  right: 0;
}

/* news-listing */
.news-listing {
  margin: 5px 0 20px 0;
}

.news-listing>li {
  overflow: hidden;
  padding: 15px 0;
  border-bottom: 1px solid #f5f5f5;
}

.news-listing .news-thumbnail {
  float: left;
  width: 150px;
  height: 105px;
  overflow: hidden;
}

.news-listing .news-thumbnail img {
  display: block;
  width: 100%;
}

.news-listing .news-info {
  display: block;
  overflow: hidden;
  padding-left: 20px;
  color: #999;
}

.news-listing .news-info h5 {
  font-size: 18px;
  margin-bottom: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-listing .news-info p {
  line-height: 22px;
  overflow: hidden;
  max-height: 66px;
}

.news-listing-nopage {
  margin-bottom: 0;
}

.news-listing-nopage>li:last-child {
  padding-bottom: 0;
  border-bottom: 0 none;
}

/* tags-group */
.tags-group {
  font-size: 0;
  margin: 3px -7px 0 0;
}

.tags-group>a {
  display: inline-block;
  vertical-align: top;
  line-height: 26px;
  margin: 7px 7px 0 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
  color: #666;
  white-space: nowrap;
  background-color: #f9f9f9;
  border-radius: 2px;
  transition: .15s ease-in-out;
}

.tags-group>a:hover,
.tags-group>a.active {
  color: #fff;
  background-color: #000000;
}

/* tags-group-lg */
.tags-group-lg {
  margin: 5px -10px 0 0;
}

.tags-group-lg>a {
  font-size: 14px;
  font-weight: 400;
  padding: 2px 15px;
  margin: 10px 10px 0 0;
  color: #333;
  background-color: #f5f5f5;
}





/* news-appel */
.news-appel {
  padding: 40px;
}

.news-caption {
  border-bottom: 1px solid #f5f5f5;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.news-caption>h2 {
  font-size: 24px;
  font-weight: 700;
  color: #000;
  margin-bottom: 10px;
}

.news-caption>p {
  font-size: 14px;
  color: #888;
}

.news-caption>p>span {
  margin-right: 20px;
}

/* news-preview */
.news-preview {
  color: #666;
  font-size: 14px;
  padding: 10px 15px;
  margin-bottom: 20px;
  background-color: #f9f9f9;
  border-radius: 2px;
}

/* news-content */
.news-content>*,
.news-content p {
  margin-bottom: 20px;
}

.news-content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

.news-content {
  text-align: justify;
  word-wrap: break-word;
  word-break: break-word;
  letter-spacing: normal;
  font-size: 16px;
  line-height: 1.8;
}

/* news-page */
.news-page {
  text-align: center;
  margin-bottom: 20px;
}

.news-page a {
  padding-left: 30px;
  padding-right: 30px;
}

.news-page .btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-top-left-radius: 40px;
  border-bottom-left-radius: 40px;
}

.news-page .btn-group>.btn:last-child:not(:first-child) {
  border-top-right-radius: 40px;
  border-bottom-right-radius: 40px;
}

/* news-share */
.news-share {
  font-size: 0;
  text-align: center;
  margin-bottom: 20px;
}

.news-share .bdsharebuttonbox>a {
  float: none;
  display: inline-block;
  margin: 5px !important;
}

/* news-tags */
.news-tags {
  margin-bottom: 10px;
}

.news-tags>a {
  display: inline-block;
  margin: 0 10px 10px 0;
  font-size: 12px;
  border-radius: 2px;
  box-shadow: none;
  line-height: 18px;
  padding: 5px 12px;
  font-weight: 700;
  background-color: #f9f9f9;
  transition: .15s ease-in-out;
}

.news-tags>a:hover {
  color: #fff;
  background-color: #000000;
}

/* news-more */
.news-more {
  margin-bottom: -20px;
  position: relative;
  color: #666;
}

.news-more li {
  line-height: 30px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-more li a {
  color: #666;
}

.news-more li a:hover {
  color: #000000;
}

/* special-intro  */
.special-intro {
  clear: both;
  position: relative;
  margin-top: 20px;
}

.special-intro-pic {
  float: left;
  width: 45%;
}

.special-intro-pic img {
  display: block;
  width: 100%;
}

.special-intro-text {
  overflow: hidden;
  padding-left: 25px;
}

.special-intro-text h2 {
  line-height: 1.2;
  font-size: 36px;
  color: #000;
  font-weight: 400;
  margin-bottom: 10px;
}

.special-intro-text .special-content {
  line-height: 1.8;
  color: #666;
  font-size: 16px;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 285px;
}

.special-intro-text .special-share {
  margin-left: -6px;
  position: absolute;
  bottom: 0;
}

/* actor-appel */
.actor-appel .actor-avatar {
  width: 240px;
  float: left;
  margin-bottom: 15px;
}

.actor-appel .actor-avatar>img {
  display: block;
  width: 100%;
}

.actor-appel .actor-avatar>.actor-share {
  margin: 9px 0 0 -6px;
}

.actor-appel .actor-intro {
  overflow: hidden;
  padding-left: 25px;
  margin-bottom: 15px;
}

.actor-appel .actor-intro h2 {
  font-size: 36px;
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 15px;
}

.actor-appel .actor-intro .info {
  clear: both;
  margin-bottom: 10px;
}

.actor-appel .actor-intro .info li {
  float: left;
  width: 50%;
  padding: 4px 20px 4px 90px;
  line-height: 20px;
}

.actor-appel .actor-intro .info .title {
  float: left;
  margin-left: -90px;
}

.actor-appel .actor-intro .info .cont {
  color: #666;
}

.actor-appel .actor-intro .intro {
  line-height: 24px;
  color: #666;
  overflow: hidden;
  max-height: 120px;
}

.actor-appel .actor-more {
  clear: both;
  border-top: 1px solid #f5f5f5;
  padding-top: 15px;
  text-align: center;
}

.actor-appel .actor-more .owl .caret {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}


/* four-zero-four */
.four-zero-four {
  text-align: center;
  padding: 50px;
}

.four-zero-four h2 {
  font-size: 96px;
}

.four-zero-four h3 {
  font-size: 30px;
  padding-bottom: 10px;
}

.four-zero-four p {
  font-size: 18px;
  padding: 10px;
  color: #666;
}

.four-zero-four .btn {
  margin: 0 5px;
  border-radius: 100px;
  padding-left: 20px;
  padding-right: 20px;
}

/* latest-primary */
.latest-tabs>li {
  float: left;
  width: 16.66666%;
  height: 35px;
  line-height: 33px;
  overflow: hidden;
  text-align: center;
  background-color: #f6f6f6;
  cursor: pointer;
  transition: .3s;
}

.latest-tabs>li.active {
  color: #fff;
  background-color: #000000;
}

/* comments-group */
.comments-group {
  margin-top: 20px;
}

.comments-group li {
  position: relative;
  padding: 15px 0;
  padding-left: 60px;
  overflow: hidden;
  border-top: 1px solid #f3f3f3;
}

.comments-avatar {
  position: absolute;
  top: 2px;
  left: 0;
  font-size: 48px;
  color: #999;
}

.comments-info {
  line-height: 24px;
  color: #333;
}

.comments-info .comments-user {
  margin-bottom: 3px;
  color: #999;
}

.comments-info .comments-user strong {
  color: #181818;
  margin-right: 20px;
}


/* play-soshm */
.play-soshm {
  float: left;
  padding-top: 8px;
}

.soshm-item {
  float: left;
  cursor: pointer;
}

.soshm-item+.soshm-item {
  margin-left: 8px;
}

.soshm-item-icon {
  display: block;
  width: 32px;
  height: 32px;
  padding: 5px;
  margin: 0;
  vertical-align: middle;
  border-radius: 50%
}

.soshm-item-icon img {
  vertical-align: top;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%
}

.soshm-item-text {
  display: none;
  font-size: 14px;
  color: #666
}

.soshm-item.weixin .soshm-item-icon {
  background: #49b233;
}

.soshm-item.weixin:hover .soshm-item-icon {
  background: #398a28
}

.soshm-item.yixin .soshm-item-icon {
  background: #23cfaf
}

.soshm-item.yixin:hover .soshm-item-icon {
  background: #1ca38a
}

.soshm-item.weibo .soshm-item-icon {
  background: #f04e59
}

.soshm-item.weibo:hover .soshm-item-icon {
  background: #ec1f2d
}

.soshm-item.qzone .soshm-item-icon {
  background: #fdbe3d
}

.soshm-item.qzone:hover .soshm-item-icon {
  background: #fcad0b
}

.soshm-item.renren .soshm-item-icon {
  background: #1f7fc9
}

.soshm-item.renren:hover .soshm-item-icon {
  background: #18639d
}

.soshm-item.tieba .soshm-item-icon {
  background: #5b95f0
}

.soshm-item.tieba:hover .soshm-item-icon {
  background: #2c77ec
}

.soshm-item.douban .soshm-item-icon {
  background: #228a31
}

.soshm-item.douban:hover .soshm-item-icon {
  background: #186122
}

.soshm-item.tqq .soshm-item-icon {
  background: #97cbe1
}

.soshm-item.tqq:hover .soshm-item-icon {
  background: #6fb7d6
}

.soshm-item.qq .soshm-item-icon {
  background: #4081e1
}

.soshm-item.qq:hover .soshm-item-icon {
  background: #2066ce
}

.soshm-item.weixintimeline .soshm-item-icon {
  background: #1cb526
}

.soshm-item.weixintimeline:hover .soshm-item-icon {
  background: #15891d
}

.soshm-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 15px 20px
}

.soshm-group .soshm-item {
  display: block;
  float: none;
  margin: 0
}

.soshm-pop {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, .65);
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in
}

.soshm-pop-show {
  opacity: 1;
  -webkit-transition-duration: .6s;
  transition-duration: .6s
}

.soshm-pop-show .group1 {
  -webkit-animation: soshtrans 1.2s 1 ease;
  animation: soshtrans 1.2s 1 ease
}

.soshm-pop-show .group2 {
  -webkit-animation: soshtrans 1.7s 1 ease;
  animation: soshtrans 1.7s 1 ease
}

.soshm-pop-show .group3 {
  -webkit-animation: soshtrans 2.2s 1 ease;
  animation: soshtrans 2.2s 1 ease
}

.soshm-pop-show .group4 {
  -webkit-animation: soshtrans 2.7s 1 ease;
  animation: soshtrans 2.7s 1 ease
}

.soshm-pop-hide {
  opacity: 0;
  -webkit-transition-duration: 1s;
  transition-duration: 1s
}

.soshm-pop-hide .group1 {
  -webkit-animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) 0ms forwards;
  animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) 0ms forwards
}

.soshm-pop-hide .group2 {
  -webkit-animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .2s forwards;
  animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .2s forwards
}

.soshm-pop-hide .group3 {
  -webkit-animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .4s forwards;
  animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .4s forwards
}

.soshm-pop-hide .group4 {
  -webkit-animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .6s forwards;
  animation: soshtrans2 .5s 1 cubic-bezier(.68, -.55, .265, 1.55) .6s forwards
}

.soshm-pop-sites {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.soshm-pop .soshm-item-icon {
  width: 42px;
  height: 42px;
  padding: 10px
}

.soshm-weixin-sharetip {
  position: fixed;
  overflow: hidden;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: 50% auto;
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .6s ease-out;
  transition: all .6s ease-out
}

.soshm-weixin-sharetip.weixin-sharetip-show {
  z-index: 9999;
  opacity: 1;
  visibility: visible
}

@-webkit-keyframes soshtrans {
  0% {
    -webkit-transform: translate3d(0, 1136px, 0);
    transform: translate3d(0, 1136px, 0)
  }

  50% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  60% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
}

@keyframes soshtrans {
  0% {
    -webkit-transform: translate3d(0, 1136px, 0);
    transform: translate3d(0, 1136px, 0)
  }

  50% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  60% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
}

@-webkit-keyframes soshtrans2 {
  0% {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 500%, 0);
    transform: translate3d(0, 500%, 0)
  }
}

@keyframes soshtrans2 {
  0% {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 500%, 0);
    transform: translate3d(0, 500%, 0)
  }
}

/* role-relation */
.role-relation {
  margin-top: 10px;
}

.role-relation table {
  width: 100%;
  font-size: 12px;
  border: 1px solid #ededed;
}

.role-relation table th {
  background-color: #fcfcfc;
  white-space: nowrap;
}

.role-relation table th,
.role-relation table td {
  padding: 10px 13px;
  vertical-align: middle;
  border: 1px solid #eee;
}

.role-relation table>tbody>tr:nth-child(2n+1) td {
  background-color: #fcfcfc;
}

.role-relation table:first-child>tbody>tr:nth-child(1) td {
  white-space: nowrap;
  background-color: #f5f5f5;
  font-weight: 700;
}

.role-relation table>tbody>tr>td:nth-child(-n+2) {
  text-align: center;
  min-width: 80px;
}

.role-relation table td p {
  min-width: 200px;
}



#wznr {
  width: 100%;
}

#wznr .nrtitle {
  text-align: center;
  clear: both;
  color: #333333;
  margin: 10px auto;
  line-height: 25px;
}

#wznr .nrtitle h1 {
  text-align: center;
  font-size: 16px;
  clear: both;
  color: #333333;
  margin: 10px auto;
}

#wznr .ttnr {
  width: 98%;
  line-height: 30px;
  padding-left: 10px;
  padding-bottom: 20px;
  clear: both;
  color: #333333;
}

#wznr .ttnr em {
  width: 98%;
  font-style: normal;
  line-height: 30px;
  padding-left: 10px;
  clear: both;
  color: #333333;
}

#wznr .ttnr img {
  display: block;
  margin: 5px auto;
  float: center;
  max-width: 90%;
  width: expression(document.body.clientWidth>800? "800px"; "auto");
  overflow: hidden;
}

#ddav {
  width: 900px;
  margin: 5px auto;
  text-align: center;
  display: block;
}

#ddav img {
  width: 100%;
  height: 60px;
}

#ddab {
  width: 100%;
  height: 20px;
  margin: 5px auto;
  line-height: 20px;
  text-align: center;
  border-radius: 3px;
  display: block;
}

#ddab .seach form {
  height: 20px
}

#ddab .seach {
  width: 100%;
  float: center;
  height: 20px
}

#ddab .seach input {
  margin-top: 10px;
  display: block;
  width: 70%;
  float: left;
  border: 1px solid #000000;
  padding-top: 8px;
  padding-bottom: 8px;
  text-indent: 0.2em
}

#ddab .seach button {
  margin-top: 10px;
  border: none;
  background: #000000;
  color: #fff;
  display: block;
  width: 28%;
  float: right;
  padding-top: 1px;
  border-radius: 4px;
  cursor: pointer;
  height: 38px
}

@media screen and (max-width:800px) {
  .header {
    background-color: #000000;
    width: 100%;
    margin: auto;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
  }

  #ddav {
    width: 90%;
    margin: 5px auto;
    text-align: center;
    display: block;
  }

  #ddav img {
    width: 100%;
    height: 60px;
  }

  .area {
    margin: 0 auto;
    width: 97%;
    margin: 0 auto;
    overflow: hidden;
  }

  .youmu-app dl {
    padding: 6px 0;
  }

  .youmu-app dt {
    width: 20%;
    line-height: 45px;
    font-size: 16px;
    font-weight: bold;
  }

  .youmu-app dd {
    width: 20%;
    line-height: 25px;
    font-size: 14px;
  }

  .youmu-app dt:after {
    margin: 16px 3.6% 0;
  }

  .youmu-app .first {
    border-top: 0;
  }

  .content {
    padding-top: auto;
  }

  .container {
    width: auto;
  }

  .footer {
    padding: 10px;
    font-size: 12px;
    line-height: 1.5;
    margin-top: 10px;
  }

  .backtop {
    bottom: 30px;
  }

  .backtop .iconfont {
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 18px;
    background-color: #000000;
  }

  .container>.appel:first-child {
    margin-top: 0;
  }

  .appel {
    margin-top: 10px;
    padding: 5px;
  }

  .appel-main {
    width: auto;
    float: none;
  }

  .appel-aside {
    width: auto;
    float: none;
    border-top: 1px solid #f0f0f0;
    margin-top: 10px;
    padding-top: 3px;
  }

  .appel-title {
    font-size: 16px;
    margin-left: 5px;
    padding-left: 10px;
  }

  .appel-more {
    font-size: 12px;
  }

  .thumbnail-group {
    margin: 0;
  }

  .thumbnail-group>li {
    float: left;
    width: 25%;
    margin: 0;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .thumbnail-group>li>.thumbnail .video-grade {
    padding: 20px 5px 0 0;
  }

  .thumbnail-group>li>.thumbnail,
  .thumbnail-group>li>.thumbnail img {
    width: 100%;
    height: 115px;
  }

  .thumbnail-group-small>li>.video-info {
    padding-top: 5px;
  }

  .thumbnail-group-small>li>.video-info>h4 {
    font-size: 12px;
  }

  .thumbnail-group-small>li>.thumbnail,
  .thumbnail-group-small>li>.thumbnail img {
    height: 70px;
  }

  .thumbnail-group-special>li {
    float: none;
    width: auto;
  }

  .thumbnail-group-special>li>.thumbnail,
  .thumbnail-group-special>li>.thumbnail img {
    width: 100%;
    height: auto;
  }

  .appel-main .thumbnail-group>li:nth-child(n+10) {
    display: none;
  }

  .rank-group {
    padding: 5px;
    margin-top: 0;
  }

  .rank-group>li:nth-child(n+11) {
    display: none;
  }

  .rank-group>li {
    line-height: 30px;
    float: left;
    width: 50%;
  }

  .rank-group>li .rank-title {
    right: 10px;
    left: 20px;
  }

  .rank-group>li .rank-grade {
    display: none;
  }

  .filter {}

  .filter-primary {
    padding: 0;
    line-height: 35px;
    font-size: 14px;
  }

  .filter-primary dd {
    width: 25%;
    text-align: center;
    padding: 5px;
  }

  .filter-primary dd>a {
    display: block;
    background-color: #f5f5f5;
    line-height: 30px;
    font-size: 14px;
    border-radius: 2px;
  }

  .category {
    margin-top: 10px;
    padding: 10px 0;
    line-height: 26px;
  }

  .category dt {
    padding: 0 5px;
  }

  .category dd {
    overflow: inherit;
    white-space: nowrap;
    margin-bottom: 7px;
  }

  .category dd a {
    font-size: 12px;
    height: 26px;
    line-height: 26px;
    padding: 0 10px;
    background-color: transparent;
  }

  .category dd a:hover,
  .category dd a:active {
    color: #000000;
    background-color: transparent;
  }

  .category dd a.active,
  .category dd a.active:hover,
  .category dd a.active:active {
    color: #fff;
    background-color: #000000;
  }

  .detail {
    padding: 0 5px;
  }

  .appel .breadcrumbs {
    padding: auto;
  }

  .detail-info .detail-header {
    margin-bottom: 0;
  }

  .detail-poster {
    width: 300px;
  }

  .detail-poster>a img {
    min-height: 180px;
  }

  .detail-info {
    float: none;
    width: auto;
    padding-left: 15px;
  }

  .detail-info h2 {
    font-size: 18px;
    line-height: 1;
    margin-bottom: 5px;
  }

  .detail-info h2 small {
    display: block;
    margin: 5px 0 0 0;
    font-size: 12px;
  }

  .detail-info h3 {
    font-size: 14px;
    margin-bottom: 5px;
  }

  .detail-info .detail-actor>li {
    padding: 0;
    line-height: 30px;
    white-space: normal;
    font-size: 14px;
  }

  .detail-info .detail-actor>li a {
    margin-right: 5px;
    display: inline-block;
  }

  .detail-info .detail-actor>li a:after {
    display: none;
  }

  .detail-info .detail-actor>li p {
    width: auto;
  }

  .detail-source {
    float: none;
    width: 100%;
    padding: 10px 0;
    clear: both;
  }

  .detail-tab {
    margin-bottom: 5px;
    white-space: nowrap;
    font-size: 0;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .detail-tab>li {
    float: none;
    margin: 0;
    display: inline-block;
    vertical-align: bottom;
    font-size: 14px;
    border: 0 none;
    background-color: #fff;
  }

  .detail-tab>li>a {
    padding: 10px 15px;
  }

  .detail-tab>li.active>a,
  .detail-tab>li.active>a a:hover {
    border-bottom: 2px solid #000000;
    padding-bottom: 8px;
  }

  .detail-play-list li {
    width: 25%;
  }

  .detail-play-list li>a {
    line-height: 30px;
    font-size: 13px;
  }

  .play {
    padding: 2px 0 0 0;
  }

  .play h2 {
    margin-bottom: 10px;
    padding: 0 10px;
    font-size: 16px;
  }

  .play .player {
    height: 200px;
    box-shadow: none;
  }

  .play-source {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 0;
  }

  .play-source .detail-play-list li {
    width: 25%;
  }

  .play-interaction {
    height: 48px;
    box-shadow: none;
    padding: 0 10px;
  }

  .play-interaction>.play-btn {
    margin-top: 8px;
  }

  .play-interaction>.play-btn>a {
    padding: 0 13px;
  }

  .play-summary {
    display: none;
  }

  .play-intro {
    padding: 10px 5px 0 5px;
  }

  .play-intro span {
    margin: 0;
    display: block;
    margin-bottom: 5px;
  }

  .play-intro a {
    margin-right: 5px;
    color: #666;
  }

  .news-main,
  .news-aside {
    width: auto;
    float: none;
  }

  .news-group {
    margin: 0 0 0 18px;
  }

  .news-group>li>.rank-title {
    left: 0;
    right: 20px;
  }

  .news-listing {
    margin: 0;
  }

  .news-listing>li {
    padding: 10px;
  }

  .news-listing .news-thumbnail {
    width: 125px;
    height: 80px;
  }

  .news-listing .news-info {
    padding-left: 10px;
  }

  .news-listing .news-info h5 {
    margin-bottom: 0;
    height: 80px;
    line-height: 26px;
    font-size: 16px;
    white-space: normal;
  }

  .news-listing .news-info p {
    display: none;
  }

  .tags-group {
    margin: 5px;
  }

  .news-appel {
    padding: 20px 10px;
  }

  .news-appel .breadcrumbs {
    display: none;
  }

  .news-appel .news-preview {
    display: none;
  }

  .news-appel .news-caption>h2 {
    font-size: 20px;
    line-height: 1.2;
  }

  .news-appel .news-caption>p {
    font-size: 12px;
  }

  .news-appel .news-caption>p>span {
    margin-right: 10px;
  }

  .news-appel .news-content {
    font-size: 15px;
  }

  .news-appel .news-more {
    margin-bottom: 0;
  }

  .special-intro-pic {
    float: none;
    width: 100%;
  }

  .special-intro-text {
    padding: 0;
  }

  .special-intro-text h2 {
    font-size: 18px;
    margin: 5px 0;
  }

  .special-intro-text p {
    font-size: 14px;
    line-height: 1.5;
    max-height: none;
  }

  .special-intro-text .special-share {
    position: static;
  }

  .actor-appel .actor-avatar {
    width: 30%;
    margin-bottom: 0;
  }

  .actor-appel .actor-intro {
    overflow: hidden;
    padding-left: 10px;
    margin-bottom: 0;
  }

  .actor-appel .actor-intro h2 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
  }

  .actor-appel .actor-intro .info {
    clear: both;
    margin-bottom: 10px;
  }

  .actor-appel .actor-intro .info li {
    float: none;
    width: auto;
    padding: 2px 0 2px 80px;
    line-height: 20px;
  }

  .actor-appel .actor-intro .info .title {
    margin-left: -80px;
  }

  .latest-primary .latest-tabs {
    margin: 0px;
  }

  .latest-primary .latest-tabs>li {
    height: 28px;
    line-height: 28px;
    font-size: 12px;
  }

  .latest-primary .thumbnail-group>li:nth-child(n+7) {
    display: none;
  }

  .latest-primary .list-group {
    margin: 5px 5px 0 5px;
    padding-top: 10px;
  }

  .latest-primary .list-group>li {
    width: 50%;
    line-height: 22px;
    padding-right: 0;
    font-size: 12px;
  }

  .latest-primary .list-group-50 {
    padding-top: 0;
  }

  .latest-primary .list-group-50>li {
    width: 100%;
  }

  .latest-listing .thumbnail-group>li:nth-child(n+13) {
    display: none;
  }

  .tab-content.pt15 {
    padding-top: 0 !important;
  }

  .four-zero-four {
    padding: 30px;
  }

  .four-zero-four h2 {
    font-size: 64px;
  }

  .four-zero-four h3 {
    font-size: 24px;
  }

  .four-zero-four p {
    font-size: 16px;
  }

  .role-relation {
    display: none;
  }

  .detail-download .table .code .h5 {
    display: none;
  }
}

@media (max-width: 600px) {
  #ddav {
    width: 98%;
    margin: 5px auto;
    text-align: center;
    display: block;
  }

  #ddav img {
    width: 100%;
    height: 50px;
  }

  .area {
    margin: 0 auto;
    width: 97%;
    margin: 0 auto;
    overflow: hidden;
  }

  .youmu-app dl {
    padding: 6px 0;
  }

  .youmu-app dt {
    width: 20%;
    line-height: 40px;
    font-size: 14px;
    font-weight: bold;
  }

  .youmu-app dd {
    width: 20%;
    line-height: 23px;
    font-size: 14px;
  }

  .youmu-app dt:after {
    margin: 16px 2.6% 0;
  }

  .youmu-app .first {
    border-top: 0;
  }

  .content {
    padding-top: auto;
  }

  .container {
    width: auto;
  }

  .footer {
    padding: 10px;
    font-size: 12px;
    line-height: 1.5;
    margin-top: 10px;
  }

  .backtop {
    bottom: 30px;
  }

  .backtop .iconfont {
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 18px;
    background-color: #000000;
  }

  .container>.appel:first-child {
    margin-top: 0;
  }

  .appel {
    margin-top: 10px;
    padding: 5px;
  }

  .appel-main {
    width: auto;
    float: none;
  }

  .appel-aside {
    width: auto;
    float: none;
    border-top: 1px solid #f0f0f0;
    margin-top: 10px;
    padding-top: 3px;
  }

  .appel-title {
    font-size: 16px;
    margin-left: 5px;
    padding-left: 10px;
  }

  .appel-more {
    font-size: 12px;
  }

  .thumbnail-group {
    margin: 0;
  }

  .thumbnail-group>li {
    float: left;
    width: 50%;
    margin: 0;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .thumbnail-group>li>.thumbnail .video-grade {
    padding: 20px 5px 0 0;
  }

  .thumbnail-group>li>.thumbnail,
  .thumbnail-group>li>.thumbnail img {
    width: 100%;
    height: 125px;
  }

  .thumbnail-group-small>li>.video-info {
    padding-top: 5px;
  }

  .thumbnail-group-small>li>.video-info>h4 {
    font-size: 12px;
  }

  .thumbnail-group-small>li>.thumbnail,
  .thumbnail-group-small>li>.thumbnail img {
    height: 70px;
  }

  .thumbnail-group-special>li {
    float: none;
    width: auto;
  }

  .thumbnail-group-special>li>.thumbnail,
  .thumbnail-group-special>li>.thumbnail img {
    width: 100%;
    height: auto;
  }

  .rank-group {
    padding: 5px;
    margin-top: 0;
  }

  .rank-group>li:nth-child(n+11) {
    display: none;
  }

  .rank-group>li {
    line-height: 30px;
    float: left;
    width: 50%;
  }

  .rank-group>li .rank-title {
    right: 10px;
    left: 20px;
  }

  .rank-group>li .rank-grade {
    display: none;
  }

  .filter {}

  .filter-primary {
    padding: 0;
    line-height: 35px;
    font-size: 14px;
  }

  .filter-primary dd {
    width: 25%;
    text-align: center;
    padding: 5px;
  }

  .filter-primary dd>a {
    display: block;
    background-color: #f5f5f5;
    line-height: 30px;
    font-size: 14px;
    border-radius: 2px;
  }

  .category {
    margin-top: 10px;
    padding: 10px 0;
    line-height: 26px;
  }

  .category dt {
    padding: 0 5px;
  }

  .category dd {
    overflow: inherit;
    white-space: nowrap;
    margin-bottom: 7px;
  }

  .category dd a {
    font-size: 12px;
    height: 26px;
    line-height: 26px;
    padding: 0 10px;
    background-color: transparent;
  }

  .category dd a:hover,
  .category dd a:active {
    color: #000000;
    background-color: transparent;
  }

  .category dd a.active,
  .category dd a.active:hover,
  .category dd a.active:active {
    color: #fff;
    background-color: #000000;
  }

  .detail {
    padding: 0 5px;
  }

  .appel .breadcrumbs {
    padding: 5px 5px 10px 5px;
  }

  .detail-info .detail-header {
    margin-bottom: 0;
  }

  .detail-poster {
    width: 190px;
  }

  .detail-poster>a img {
    min-height: 110px;
  }

  .detail-info {
    float: none;
    width: auto;
    padding-left: 15px;
  }

  .detail-info h2 {
    font-size: 18px;
    line-height: 1;
    margin-bottom: 5px;
  }

  .detail-info h2 small {
    display: block;
    margin: 5px 0 0 0;
    font-size: 12px;
  }

  .detail-info h3 {
    font-size: 14px;
    margin-bottom: 5px;
  }

  .detail-info .detail-actor>li {
    padding: 0;
    line-height: 25px;
    white-space: normal;
    font-size: 12px;
  }

  .detail-info .detail-actor>li a {
    margin-right: 5px;
    display: inline-block;
  }

  .detail-info .detail-actor>li a:after {
    display: none;
  }

  .detail-info .detail-actor>li p {
    width: auto;
  }

  .detail-source {
    float: none;
    width: 100%;
    padding: 10px 0;
    clear: both;
  }

  .detail-tab {
    margin-bottom: 5px;
    white-space: nowrap;
    font-size: 0;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .detail-tab>li {
    float: none;
    margin: 0;
    display: inline-block;
    vertical-align: bottom;
    font-size: 14px;
    border: 0 none;
    background-color: #fff;
  }

  .detail-tab>li>a {
    padding: 10px 15px;
  }

  .detail-tab>li.active>a,
  .detail-tab>li.active>a a:hover {
    border-bottom: 2px solid #000000;
    padding-bottom: 8px;
  }

  .detail-play-list li {
    width: 25%;
  }

  .detail-play-list li>a {
    line-height: 30px;
    font-size: 13px;
  }

  .play {
    padding: 2px 0 0 0;
  }

  .play h2 {
    margin-bottom: 10px;
    padding: 0 10px;
    font-size: 16px;
  }

  .play .player {
    height: 200px;
    box-shadow: none;
  }

  .play-source {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 0;
  }

  .play-source .detail-play-list li {
    width: 25%;
  }

  .play-interaction {
    height: 48px;
    box-shadow: none;
    padding: 0 10px;
  }

  .play-interaction>.play-btn {
    margin-top: 8px;
  }

  .play-interaction>.play-btn>a {
    padding: 0 13px;
  }

  .play-summary {
    display: none;
  }

  .play-intro {
    padding: 10px 5px 0 5px;
  }

  .play-intro span {
    margin: 0;
    display: block;
    margin-bottom: 5px;
  }

  .play-intro a {
    margin-right: 5px;
    color: #666;
  }

  .news-main,
  .news-aside {
    width: auto;
    float: none;
  }

  .news-group {
    margin: 0 0 0 18px;
  }

  .news-group>li>.rank-title {
    left: 0;
    right: 20px;
  }

  .news-listing {
    margin: 0;
  }

  .news-listing>li {
    padding: 10px;
  }

  .news-listing .news-thumbnail {
    width: 125px;
    height: 80px;
  }

  .news-listing .news-info {
    padding-left: 10px;
  }

  .news-listing .news-info h5 {
    margin-bottom: 0;
    height: 80px;
    line-height: 26px;
    font-size: 16px;
    white-space: normal;
  }

  .news-listing .news-info p {
    display: none;
  }

  .tags-group {
    margin: 5px;
  }

  .news-appel {
    padding: 20px 10px;
  }

  .news-appel .breadcrumbs {
    display: none;
  }

  .news-appel .news-preview {
    display: none;
  }

  .news-appel .news-caption>h2 {
    font-size: 20px;
    line-height: 1.2;
  }

  .news-appel .news-caption>p {
    font-size: 12px;
  }

  .news-appel .news-caption>p>span {
    margin-right: 10px;
  }

  .news-appel .news-content {
    font-size: 15px;
  }

  .news-appel .news-more {
    margin-bottom: 0;
  }

  .special-intro-pic {
    float: none;
    width: 100%;
  }

  .special-intro-text {
    padding: 0;
  }

  .special-intro-text h2 {
    font-size: 18px;
    margin: 5px 0;
  }

  .special-intro-text p {
    font-size: 14px;
    line-height: 1.5;
    max-height: none;
  }

  .special-intro-text .special-share {
    position: static;
  }

  .actor-appel .actor-avatar {
    width: 30%;
    margin-bottom: 0;
  }

  .actor-appel .actor-intro {
    overflow: hidden;
    padding-left: 10px;
    margin-bottom: 0;
  }

  .actor-appel .actor-intro h2 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
  }

  .actor-appel .actor-intro .info {
    clear: both;
    margin-bottom: 10px;
  }

  .actor-appel .actor-intro .info li {
    float: none;
    width: auto;
    padding: 2px 0 2px 80px;
    line-height: 20px;
  }

  .actor-appel .actor-intro .info .title {
    margin-left: -80px;
  }

  .latest-primary .latest-tabs {
    margin: 0px;
  }

  .latest-primary .latest-tabs>li {
    height: 28px;
    line-height: 28px;
    font-size: 12px;
  }

  .latest-primary .list-group {
    margin: 5px 5px 0 5px;
    padding-top: 10px;
  }

  .latest-primary .list-group>li {
    width: 50%;
    line-height: 22px;
    padding-right: 0;
    font-size: 12px;
  }

  .latest-primary .list-group-50 {
    padding-top: 0;
  }

  .latest-primary .list-group-50>li {
    width: 100%;
  }

  .latest-listing .thumbnail-group>li:nth-child(n+13) {
    display: none;
  }

  .tab-content.pt15 {
    padding-top: 0 !important;
  }

  .four-zero-four {
    padding: 30px;
  }

  .four-zero-four h2 {
    font-size: 64px;
  }

  .four-zero-four h3 {
    font-size: 24px;
  }

  .four-zero-four p {
    font-size: 16px;
  }

  .role-relation {
    display: none;
  }

  .detail-download .table .code .h5 {
    display: none;
  }
}

@media screen and (max-width: 375px) {
  .youmu-app dd {
    width: 20%;
    line-height: 23px;
    font-size: 12px;
  }

  .youmu-app dt {
    width: 20%;
    line-height: 45px;
    font-size: 12px;
    font-weight: bold;
  }

  .youmu-app dd {
    width: 20%;
    line-height: 23px;
    font-size: 12px;
  }

  .youmu-app dt:after {
    margin: 16px 1.6% 0;
  }

}

@media screen and (max-width: 320px) {
  .thumbnail-group>li {
    padding: 5px;
  }

  .thumbnail-group>li>h5 {
    font-size: 12px;
  }

  .thumbnail-group>li>.thumbnail,
  .thumbnail-group>li>.thumbnail img {
    height: 90px;
  }

  .thumbnail-group-small>li>.thumbnail,
  .thumbnail-group-small>li>.thumbnail img {
    height: 60px;
  }

  .thumbnail-group-special>li>.thumbnail,
  .thumbnail-group-special>li>.thumbnail img {
    height: auto;
  }

  .rank-group>li {
    font-size: 12px;
    line-height: 28px;
  }

  .filter-primary dd {
    padding: 2px;
  }

  .filter-primary dd>a {
    font-size: 12px;
    margin: 2px;
  }

  .detail-play-list li {
    width: 25%;
    font-size: 12px;
  }

  .detail-play-list li>a {
    line-height: 30px;
  }

  .news-listing .news-thumbnail {
    width: 100px;
    height: 70px;
  }

  .news-listing .news-info h5 {
    height: 70px;
    line-height: 23px;
    font-size: 15px;
  }

  .play-interaction>.play-btn>a {
    padding: 0 10px;
  }

  .play-soshm {
    padding-top: 10px;
  }

  .soshm-item+.soshm-item {
    margin-left: 5px;
  }

  .soshm-item-icon {
    width: 28px;
    height: 28px;
  }
}

.banyundog.com {
  height: 432px;
}