.clearfix:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

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

body,
button,
input,
select,
textarea {
  font      : 16px/1.7 "\5FAE\8F6F\96C5\9ED1", "\9ED1\4F53", "Hiragino Sans GB";
  color     : #292929;
  background: #fff
}

address,
cite,
dfn,
em,
var {
  font-style: normal
}

code,
kbd,
pre,
samp {
  font-family: courier new, courier, monospace
}

small {
  font-size: 14px
}

ol,
ul {
  list-style: none
}

a {
  color          : #292929;
  text-decoration: none
}

a:hover {
  color: #292929
}

sup {
  vertical-align: text-top
}

sub {
  vertical-align: text-bottom
}

legend {
  color: #000
}

fieldset,
img {
  border: 0
}

img {
  vertical-align: middle
}

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

button {
  cursor: pointer
}

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

h1 {
  font-size: 36px
}

h2 {
  font-size: 30px
}

h3 {
  font-size: 24px
}

h4 {
  font-size: 18px
}

h5 {
  font-size: 14px
}

h6 {
  font-size: 12px
}

@media all and (max-width:1184px) and (min-width:1440px) {

  body,
  button,
  input,
  select,
  textarea {
    font-size: 14px
  }

  h1 {
    font-size: 32.4px
  }

  h2 {
    font-size: 27px
  }

  h3 {
    font-size: 21.6px
  }

  h4 {
    font-size: 16.2px
  }

  h5 {
    font-size: 12.6px
  }

  h6 {
    font-size: 10.8px
  }
}

@media all and (max-width:992px) {

  blockquote,
  button,
  dd,
  div,
  dl,
  dt,
  fieldset,
  form,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  hr,
  input,
  legend,
  li,
  ol,
  p,
  pre,
  td,
  textarea,
  th,
  ul {
    -moz-box-sizing   : border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing     : border-box;
    -ms-box-sizing    : border-box;
    box-sizing        : border-box
  }

  h1 {
    font-size: 28.8px
  }

  h2 {
    font-size: 24px
  }

  h3 {
    font-size: 19.2px
  }

  h4 {
    font-size: 14.4px
  }

  h5 {
    font-size: 11.2px
  }

  h6 {
    font-size: 9.6px
  }
}

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

.iconfont {
  font-family              : iconfont;
  font-style               : normal;
  -webkit-font-smoothing   : antialiased;
  -webkit-text-stroke-width: .2px
}

.row {
  margin: 0 0 0 -16px
}

.row:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

.row .row {
  margin: 0 0 0 -16px
}

.span0,
.span1,
.span10,
.span11,
.span2,
.span3,
.span4,
.span5,
.span6,
.span7,
.span8,
.span9 {
  margin: 0 0 0 16px;
  float : left
}

.span1 {
  width: 84px
}

.span2 {
  width: 184px
}

.span3 {
  width: 284px
}

.span4 {
  width: 384px
}

.span5 {
  width: 484px
}

.span6 {
  width: 584px
}

.span7 {
  width: 684px
}

.span8 {
  width: 784px
}

.span9 {
  width: 884px
}

.span10 {
  width: 984px
}

.span11 {
  width: 1084px
}

@media all and (max-width:1184px) and (min-width:1440px) {
  .span1 {
    width: 105.33px
  }

  .span2 {
    width: 226.67px
  }

  .span3 {
    width: 348px
  }

  .span4 {
    width: 469.33px
  }

  .span5 {
    width: 590.67px
  }

  .span6 {
    width: 712px
  }

  .span7 {
    width: 833.33px
  }

  .span8 {
    width: 954.67px
  }

  .span9 {
    width: 1076px
  }

  .span10 {
    width: 1197.33px
  }

  .span11 {
    width: 1318.67px
  }
}

@media all and (max-width:992px) {
  .row {
    margin: 0
  }

  .row .row {
    margin: 0
  }

  .span0,
  .span1,
  .span10,
  .span11,
  .span2,
  .span3,
  .span4,
  .span5,
  .span6,
  .span7,
  .span8,
  .span9 {
    margin: 16px 0;
    float : none;
    width : 100%
  }
}

.container {
  width : 1184px;
  margin: 0 auto
}

.container:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

@media all and (max-width:1184px) and (min-width:1440px) {
  .container {
    width: 1440px
  }
}

@media all and (max-width:1199px) {
  .container {
    width: 100%
  }
}

@media all and (max-width:992px) {
  .container {
    padding: 0 32px
  }
}

.m-box {
  margin-bottom: 16px
}

.m-box .m-hd {
  margin-bottom: 8px
}

.m-box .m-hd .more {
  float: right
}

.m-box .m-hd .tabs:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

.m-box .m-hd .tabs li {
  float       : left;
  margin-right: 8px;
  cursor      : pointer
}

.m-box .m-hd .tabs .hd-title {
  font-size: 18px;
  color    : #434343
}

.m-box .m-hd .tabs .active {
  font-size: 20px;
  color    : #292929
}

.m-box .hd-title {
  font-size: 20px
}

#common_header {
  background   : #fff;
  border-bottom: 1px solid #c7c7c7;
  height       : 45px;
  line-height  : 45px
}

#common_header .logo,
#common_header .nav,
#common_header .navbar {
  float: left
}

#common_header .logo {
  width      : 67px;
  height     : 45px;
  margin-left: 16px;
  line-height: 66em;
  overflow   : hidden;
  background : url(../../images/logo_common_header.png) no-repeat left center
}

#common_header .logo a {
  display: block
}

#common_header .dropdown-toggle {
  display: block;
  height : 45px;
  padding: 0 8px
}

#common_header .open {
  color: #fff
}

#common_header .open .dropdown-toggle {
  background: #ec0c15
}

#common_header .dropdown-menu {
  text-align: center
}

#common_header .dropdown-menu li {
  line-height: 30px
}

#common_header .dropdown-menu li:hover {
  background: #f2f2f2
}

#common_header .nav {
  float  : left;
  padding: 0 16px
}

#common_header .nav li {
  float    : left;
  height   : 45px;
  font-size: 16px;
  padding  : 0 8px
}

#common_header .nav .dropdown {
  padding: 0
}

#common_header .nav .dropdown .dropdown-toggle {
  padding: 0 8px
}

#common_header .nav .dropdown-menu {
  min-width: 67px
}

#common_header .nav .dropdown-menu li {
  float      : none;
  line-height: 1.7;
  height     : auto
}

#common_header .servers {
  float       : right;
  margin-right: 16px
}

#common_header .servers .dropdown-toggle:after {
  font-family: iconfont;
  content    : "\e617"
}

#common_header .servers .open .dropdown-toggle:after {
  content: "\e618"
}

#common_header .servers .iconfont {
  font-size  : 20px;
  font-weight: 200
}

#common_header .channel,
#common_header .mobile {
  float: left
}

#common_header .mobile {
  padding: 0 8px
}

@media all and (max-width:992px) {
  #common_header {
    text-align: center
  }

  #common_header .navbar {
    float  : none;
    display: inline-block
  }

  #common_header .navbar .logo {
    float  : none;
    display: block;
    margin : 0
  }

  #common_header .navbar .nav {
    display: none
  }

  #common_header .servers {
    display: none
  }
}

.footer-nav {
  padding   : 16px 0;
  border-top: 1px solid #c7c7c7;
  background: #f2f2f2
}

.footer-nav ul {
  font-size: 0
}

.footer-nav li {
  display    : inline-block;
  line-height: 2;
  padding    : 0 8px 0 0;
  font-size  : 16px
}

#common-footer {
  padding   : 16px 0;
  background: #515151;
  color     : #fff
}

#common-footer a {
  color: #fff
}

#common-footer .links {
  margin    : 16px 0;
  text-align: center;
  font-size : 0
}

#common-footer .links a {
  display  : inline-block;
  font-size: 16px
}

#common-footer .links a:not(:last-child):after {
  content: "|";
  padding: 0 32px
}

#common-footer .copyright {
  text-align: center
}

@media all and (max-width:1184px) and (min-width:992px) {
  .footer-nav li {
    font-size: 14px
  }

  #common-footer .links a {
    font-size: 14px
  }

  #common-footer .links a:not(:last-child):after {
    content: "|";
    padding: 0 16px
  }
}

@media all and (max-width:992px) {
  #common-footer * {
    text-align: left !important
  }
}

.newslist {
  margin-bottom: 16px
}

.newslist li {
  line-height  : 1.4;
  padding      : 4px 0;
  overflow     : hidden;
  text-overflow: ellipsis;
  white-space  : nowrap
}

.newslist li:before {
  content    : "\e630";
  margin     : 0 4px 0 0;
  font-family: iconfont;
  color      : #292929
}

.newslist.show li {
  overflow: visible
}

.newslist.video li:before {
  content: '\f0298';
  color  : #ec0c15
}

.newslist .date {
  padding  : 0 0 0 16px;
  font-size: 12px;
  color    : #c7c7c7
}

.newslist .line {
  margin-top : 16px;
  padding-top: 20px;
  border-top : 1px dashed #c7c7c7
}

.newslist.none:before {
  content: ""
}

.imglist {
  margin: 0 0 0 -16px
}

.imglist:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

.imglist li {
  float : left;
  margin: 0 0 16px 16px
}

.imglist li a,
.imglist li img {
  display: block
}

.imglist li .linktitle {
  padding-top: 4px;
  line-height: 1.5em;
  text-align : center;
  min-height : 3em
}

.imglist.imgauto li img {
  height: auto !important
}

.imglist.video .pic {
  position: relative
}

.imglist.video .pic:after {
  position   : absolute;
  left       : 8px;
  bottom     : 8px;
  content    : '\f0298';
  color      : #fff;
  font-size  : 22px;
  font-family: iconfont
}

.imglist.video.center .pic:after {
  left  : 50%;
  top   : 50%;
  bottom: auto;
  margin: -11px 0 0 -11px
}

.newsitem {
  border-bottom: 1px solid #c7c7c7;
  padding      : 8px 0
}

.newsitem:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

.newsitem .title {
  margin-bottom: 8px;
  font-size    : 20px;
  font-weight  : 400
}

.newsitem.center .title {
  text-align: center
}

.newsitem .pic {
  float: left
}

.newsitem .pic a,
.newsitem .pic img {
  display: block
}

.newsitem .pic img {
  width : 192px;
  height: 108px
}

.newsitem .desc p {
  margin-bottom: 8px;
  color        : #515151;
  font-size    : 14px;
  line-height  : 1.4
}

.newsitem p.desc {
  margin-bottom: 8px;
  color        : #515151;
  font-size    : 14px;
  line-height  : 1.4
}

.newsitem .infobar {
  color: #c7c7c7
}

.newsitem .haspic {
  margin-left: 208px
}

@media all and (max-width:1184px) and (min-width:1440px) {
  .newsitem .title {
    font-size: 16px
  }

  .newsitem p {
    font-size: 12px
  }

  .newsitem .haspic p {
    font-size: 12px
  }
}

.focustype {
  margin-bottom: 8px
}

.focustype .title {
  font-size    : 20px;
  font-weight  : 400;
  margin-bottom: 4px;
  line-height  : 1.4
}

.focustype .title.center {
  text-align: center
}

.focustype .desc {
  font-size: 14px;
  color    : #515151
}

@media all and (max-width:1184px) and (min-width:1440px) {
  .focustype {
    font-size: 12px
  }
}

.icon {
  display              : inline-block;
  vertical-align       : middle;
  margin               : 0 4px;
  width                : 27.2px;
  height               : 27.2px;
  line-height          : 27.2px;
  -webkit-border-radius: 27.2px;
  -moz-border-radius   : 27.2px;
  border-radius        : 27.2px;
  font-size            : 16px;
  font-family          : iconfont;
  border               : 1px solid #c7c7c7;
  text-align           : center;
  background           : #fff
}

.icon:hover {
  border-color: #ec0c15;
  background  : #ec0c15;
  color       : #fff
}

.icon-inline {
  display       : inline-block;
  width         : 20px;
  height        : 16px;
  vertical-align: middle;
  overflow      : hidden;
  background    : url(http://img.jxntv.cn/icon/video.png) no-repeat 0 center
}

.icon-blank {
  background-image: none
}

.icon-activity {
  background-image: url(http://img.jxntv.cn/icon/activity.gif)
}

.icon-hot {
  background-image: url(http://img.jxntv.cn/icon/hot.gif)
}

.icon-interview {
  background-image: url(http://img.jxntv.cn/icon/interview.gif)
}

.icon-live {
  background-image: url(http://img.jxntv.cn/icon/live.gif)
}

.icon-new {
  background-image: url(http://img.jxntv.cn/icon/new.gif)
}

.icon-picture {
  background-image: url(http://img.jxntv.cn/icon/picture.gif)
}

.icon-recommend {
  background-image: url(http://img.jxntv.cn/icon/recommend.gif)
}

.icon-special {
  background-image: url(http://img.jxntv.cn/icon/special.gif)
}

.icon-video {
  background-image: url(http://img.jxntv.cn/icon/video.png)
}

.icon-vote {
  background-image: url(http://img.jxntv.cn/icon/vote.gif)
}

.icon-ad {
  display : block;
  position: relative
}

.icon-ad .adflag {
  content   : " ";
  position  : absolute;
  bottom    : 1px;
  right     : 1px;
  width     : 24px;
  height    : 14px;
  padding   : 0;
  background: url(http://img.jxntv.cn/images/ad.png) no-repeat;
  color     : #fff
}

.btn {
  display              : inline-block;
  padding              : 0 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius   : 8px;
  border-radius        : 8px;
  border               : none;
  background           : #c7c7c7;
  text-align           : center
}

.btn:hover {
  background: #ec0c15;
  color     : #fff
}

.btn-list .btn {
  display      : block;
  margin-bottom: 8px
}

.sharebox h2 {
  display  : inline-block;
  font-size: 16px
}

.sharebox ul {
  display: inline-block
}

.sharebox li {
  display: inline-block;
  color  : #c7c7c7;
  cursor : pointer
}

.pages {
  text-align: center
}

.pages .pagination {
  margin   : 16px 0 8px;
  font-size: 0
}

.pages .pagination a {
  display    : inline-block;
  margin     : 0 4px;
  padding    : 0 10px;
  height     : 32px;
  line-height: 32px;
  border     : 1px solid #c7c7c7;
  background : 0 0;
  font-size  : 16px
}

.pages .pagination .current,
.pages .pagination a:hover {
  background: #ec0c15;
  color     : #fff
}

.ad img {
  max-width: 100%
}

.ad .fullimg {
  width : 100%;
  height: auto
}

.adbar {
  margin-bottom: 16px
}

.adbar:after {
  display    : table;
  line-height: 0;
  content    : "";
  clear      : both
}

.adbar .full {
  display: block
}

.adbar .full img {
  width: 100%
}

.adbar .fullimg {
  width : 100%;
  height: auto
}

.adbar .ad-lg {
  width: 1440px;
  float: left
}

.adbar .ad-sm {
  width: -272px;
  float: right
}

@media all and (max-width:1184px) and (min-width:1440px) {
  .adbar .ad-sm {
    display: none
  }
}

.coupletad {
  position: relative
}

.coupletad .couplet {
  position: absolute;
  top     : 0
}

.coupletad .close {
  position   : absolute;
  right      : 0;
  top        : -18px;
  font-size  : 14px;
  line-height: 14px;
  cursor     : pointer;
  color      : #666
}

.coupletad .close .iconfont {
  font-size: 14px
}

.coupletad .left {
  left: -100px
}

.coupletad .right {
  right: -100px
}

img.img-full {
  width : 100%;
  height: auto
}

img.img-responsive {
  display  : block;
  max-width: 100%;
  height   : auto
}

img.img-responsive.center {
  margin-left : auto;
  margin-right: auto
}

.caret {
  display       : inline-block;
  width         : 0;
  height        : 0;
  margin-left   : 2px;
  vertical-align: middle
}

.dropdown,
.dropup {
  position: relative
}

.dropdown-toggle {
  cursor: pointer
}

.dropdown-toggle:focus {
  outline: 0
}

.dropdown-menu {
  position   : absolute;
  top        : 100%;
  left       : 0;
  z-index    : 100;
  display    : none;
  float      : left;
  min-width  : 120px;
  padding    : 5px 0;
  list-style : none;
  line-height: 1.7;
  text-align : left;
  border     : 1px solid #c7c7c7;
  background : #fff
}

.dropdown-menu.pull-right {
  right: 0;
  left : auto
}

.dropdown-menu>li>a {
  display    : block;
  clear      : both;
  font-weight: 400;
  white-space: nowrap
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
  text-decoration: none
}

.dropdown-menu>.active>a,
.dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a:hover {
  text-decoration: none;
  outline        : 0
}

.dropdown-menu>.disabled>a:focus,
.dropdown-menu>.disabled>a:hover {
  text-decoration : none;
  background-color: transparent;
  background-image: none
}

.open>.dropdown-menu {
  display: block
}

.open>a {
  outline: 0
}

.dropdown-menu-right {
  left : auto;
  right: 0
}

.dropdown-menu-left {
  left : 0;
  right: auto
}

.dropdown-header {
  display    : block;
  padding    : 3px 20px;
  white-space: nowrap
}

.dropdown-backdrop {
  position: fixed;
  left    : 0;
  right   : 0;
  bottom  : 0;
  top     : 0;
  z-index : 90
}

.pull-right>.dropdown-menu {
  right: 0;
  left : auto
}

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  border-top: 0;
  content   : ""
}

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top          : auto;
  bottom       : 100%;
  margin-bottom: 2px
}

.sw-sbox {
  position: relative
}

.sw-sbox .slider-fade {
  position: relative;
  z-index : 10
}

.sw-sbox .slider-fade li {
  position: absolute;
  top     : 0;
  left    : 0;
  width   : 100%
}

.sw-sbox .slider-fade li img {
  width : 100%;
  height: auto
}

.sw-sbox .slider-scroll {
  position: absolute;
  top     : 0;
  left    : 0;
  z-index : 10
}

.sw-sbox .slider-scroll li {
  float: left
}

.sw-sbox .slider-scroll li img {
  width : 100%;
  height: auto
}

.sw-sbox .trigger {
  z-index  : 20;
  font-size: 0
}

.sw-sbox .trigger li {
  display: inline-block;
  cursor : pointer
}

.scrollbox {
  position: relative
}

.scrollbox ul {
  position: absolute;
  top     : 0;
  left    : 0
}

.scrollbox ul li {
  float: left
}

.metrobox {
  position: relative
}

.metrobox .item {
  position: absolute;
  overflow: hidden
}

.metrobox .item .pic {
  display: block;
  width  : 100%;
  height : 100%
}

.metrobox .item .pic img {
  width : 100%;
  height: 100%
}

.metrobox .item .linktitle {
  display   : none;
  position  : absolute;
  z-index   : 20;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
  overflow  : hidden;
  background: #000;
  background: rgba(0, 0, 0, .6);
  color     : #fff;
  text-align: center
}

.metrobox .item .linktitle span {
  position   : relative;
  top        : 50%;
  display    : block;
  height     : 3.4em;
  margin-top : -1.7em;
  padding    : 0 16px;
  line-height: 1.7em;
  text-align : center
}

.metrobox .item:hover .linktitle {
  display: block
}

.ui-form .field {
  display      : block;
  margin-bottom: 8px
}

.ui-form .data {
  margin-bottom: 8px
}

.ui-form input[type=date],
.ui-form input[type=datetime-local],
.ui-form input[type=email],
.ui-form input[type=number],
.ui-form input[type=password],
.ui-form input[type=search],
.ui-form input[type=tel],
.ui-form input[type=time],
.ui-form input[type=text],
.ui-form input[type=url],
.ui-form textarea {
  -moz-box-sizing   : border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing     : border-box;
  -ms-box-sizing    : border-box;
  box-sizing        : border-box;
  display           : block;
  border            : 1px solid #c7c7c7;
  line-height       : 35px;
  padding           : 0 8px;
  width             : 100%;
  outline           : 0
}

.ui-form .form-table {
  display: table;
  width  : 100%
}

.ui-form .form-table .field {
  display: table-row
}

.ui-form .form-table .required .label:before {
  content: "*";
  padding: 0 4px 0 0;
  color  : #ec0c15
}

.ui-form .form-table .data,
.ui-form .form-table .label {
  display       : table-cell;
  vertical-align: top;
  padding       : 8px;
  line-height   : 35px
}

.ui-form .form-table .label {
  width     : 160px;
  text-align: right
}

.ui-form .form-table .data input[type=date],
.ui-form .form-table .data input[type=datetime-local],
.ui-form .form-table .data input[type=email],
.ui-form .form-table .data input[type=number],
.ui-form .form-table .data input[type=password],
.ui-form .form-table .data input[type=search],
.ui-form .form-table .data input[type=tel],
.ui-form .form-table .data input[type=time],
.ui-form .form-table .data input[type=text],
.ui-form .form-table .data input[type=url] {
  width: 350px
}

.ui-form .form-table .data textarea {
  height: 105px
}

.ui-form .form-table .data.inline input[type=text] {
  display       : inline-block;
  vertical-align: middle;
  width         : 100px
}

.ui-form .btnbar {
  margin    : 16px 0;
  text-align: center
}

.ui-form .btnbar .btn {
  line-height: 42px;
  margin     : 0 8px;
  padding    : 0 16px;
  min-width  : 120px
}

@media all and (max-width:992px) {
  .ui-form .form-table {
    display: block
  }

  .ui-form .form-table .data,
  .ui-form .form-table .field,
  .ui-form .form-table .label {
    display      : block;
    padding-left : 0 !important;
    padding-right: 0 !important
  }

  .ui-form .form-table .field {
    padding      : 8px 0;
    border-bottom: 1px solid #f2f2f2
  }

  .ui-form .form-table .label {
    text-align: left
  }

  .ui-form .form-table .data input[type=date],
  .ui-form .form-table .data input[type=datetime-local],
  .ui-form .form-table .data input[type=email],
  .ui-form .form-table .data input[type=number],
  .ui-form .form-table .data input[type=password],
  .ui-form .form-table .data input[type=search],
  .ui-form .form-table .data input[type=tel],
  .ui-form .form-table .data input[type=time],
  .ui-form .form-table .data input[type=text],
  .ui-form .form-table .data input[type=url] {
    -moz-box-sizing   : border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing     : border-box;
    -ms-box-sizing    : border-box;
    box-sizing        : border-box;
    width             : 100%
  }

  .ui-form .form-table .data input[type=radio] {
    display: none
  }

  .ui-form .form-table .data label.radio:before {
    content    : "\e636";
    font-family: iconfont
  }

  .ui-form .form-table .data label.radio.selected:before {
    content: "\e635"
  }

  .ui-form .form-table label {
    display: block
  }
}

html,
body {
  margin    : 0;
  padding   : 0;
  min-height: 100vh
}

a {
  text-decoration: none
}

body {
  background-image   : url(./bg.png);
  background-position: top center;
  background-repeat  : no-repeat;
  background-size    : 1920px auto;
  background-color   : #cf0f04
}

.main {
  padding-top: 1060px
}

.top {
  position       : absolute;
  top            : 10%;
  width          : 100%;
  display        : flex;
  flex-direction : column;
  justify-content: center;
  align-items    : center;
}

.top .tit-txt {
  width     : 70%;
  max-width : 900px;
  margin-top: 30px;
}

.top .tit-img {
  width    : 80%;
  max-width: 1090px;
}

.container {
  max-width: 1230px;
  margin   : 0 auto;
  padding  : 10px 15px
}

.title {
  text-indent               : 28px;
  color                     : #C40303;
  line-height               : 35px;
  margin-bottom             : 150px;
  border                    : 1px solid #feffc5;
  padding                   : 20px;
  border-top-left-radius    : 20px;
  border-bottom-right-radius: 20px;
  background-color          : #FFF0C9;
}

.img-div {
  text-align: center;
  margin    : 35px 0px
}

.img-div img {
  width    : 80%;
  max-width: 700px
}

.img-list {
  display        : flex;
  justify-content: flex-start;
  margin         : 0 auto;
  flex-wrap      : wrap
}

.videoView {
  position        : fixed;
  left            : 0;
  top             : 0;
  width           : 100%;
  height          : 100vh;
  background-color: rgba(0, 0, 0, 0.9);
  z-index         : 1000;
  display         : flex;
  align-items     : center;
  justify-content : center;
}

.videoView video {
  width : 100%;
  height: 100%;
}

.videoView .close-btn {
  position       : absolute;
  top            : 15px;
  right          : 15px;
  width          : 30px;
  height         : 30px;
  background     : rgba(255, 255, 255, 0.3);
  color          : white;
  border-radius  : 50%;
  display        : flex;
  align-items    : center;
  justify-content: center;
  font-size      : 24px;
  cursor         : pointer;
  z-index        : 1001;

  &:hover {
    background: rgba(255, 255, 255, 0.5);
  }

}

.more {
  margin-top   : 50px;
  margin-bottom: 100px;
  text-align   : center;
  cursor       : pointer;
}

.more a {
  display         : inline-block;
  width           : 150px;
  height          : 40px;
  line-height     : 40px;
  text-align      : center;
  color           : #cf0f04;
  background-color: white
}

.img-item {
  width     : 20%;
  padding   : 8px;
  box-sizing: border-box;
  cursor    : pointer
}

.img-container {
  background-color: white;
  padding-bottom  : 8px
}

.img-container p {
  padding           : 0px 10px;
  margin-bottom     : 0px;
  font-size         : 16px;
  height            : 54px;
  overflow          : hidden;
  text-overflow     : ellipsis;
  display           : -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical
}

.img-container img {
  width : 100%;
  height: 124px
}

@media (max-width:1200px) {
  .img-item {
    width     : 25%;
    padding   : 8px;
    box-sizing: border-box
  }

  .img-container img {
    width : 100%;
    height: auto
  }
}

@media (max-width:900px) {
  body {
    background-size    : 140vw auto;
    background-position: center 8vw
  }

  .main {
    padding-top: 86vw
  }

  .img-item {
    width     : 33.3%;
    padding   : 8px;
    box-sizing: border-box
  }
}

@media (max-width:650px) {
  .img-item {
    width     : 50%;
    padding   : 8px;
    box-sizing: border-box
  }
}