@charset "UTF-8";
@import url(reset.css);
@import url(iconfont.css);
/* foot */
/* 所有框线 */
/* reset bootstrap */
a:focus, a:hover {
  text-decoration: none; }

.input-group .form-control {
  border: 1px #eaeaea solid; }
.mgt60{margin-top: 60px;}
.input-group .btn-default {
  border-color: #eaeaea; }
  .input-group .btn-default .iconfont {
    line-height: 1; }

.c0 {
  color: #000000; }

.c1 {
  color: #ea1d1a; }

.c2 {
  color: #f6f6f6; }

.c3 {
  color: #333333; }

.c4 {
  color: #666666; }

.c5 {
  color: #999999; }

.c6 {
  color: #eaeaea; }

.empty {
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important; }

body {
  background: #fff;
  color: #666666;
  line-height: 180%;
  font-size: 12px; }

h5 {
  font-size: 14px; }

h4 {
  font-size: 16px; }

h3 {
  font-size: 20px; }

h2 {
  font-size: 28px; }

p {
  line-height: 190%; }

a {
  color: #666666; }

a:hover {
  color: #ea1d1a; }

.jcsb {
  display: -webkit-box;
  display: -webkit-flex; /* Safari */
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;/*两端对齐*/
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center; /*居中对齐弹性盒的各项 <div> 元素*/
}


.cen {
  margin: auto;
  width: 1200px; position: relative;}

.cc {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

img {
  max-width: 100%; }

b {
  font-weight: normal;
  color: #ea1d1a; }

.nav_top { background-color: #f6f6f6; }
.nav_top .cen {height: 36px; }
.nav_top .tit {color: #999999; }
.menu>li {display: inline-block;padding: 0 15px;border-right: 1px #eaeaea solid;line-height: 120%;position: relative;}
.menu>li>a{ color: #999;font-size: 12px;}
.menu>li:hover>a{text-decoration: underline;}
.menu>li .iconfont {font-size: 10px; }
.menu>li:last-child { border-right: none; }

.meun2{display: none; left: 0;top: 25px;background-color: #fff;-moz-box-shadow: 0 0 10px rgba(0,0,0,.2);-webkit-box-shadow: 0 0 10px rgba(0,0,0,.2);box-shadow: 0 0 10px rgba(0,0,0,.2);z-index: 2000;width: 80px;text-align: center;}
.meun2>li{border-bottom: 1px solid #eaeaea;}
.meun2>li:last-child{border-bottom: none;}
.meun2>li>a{display: block;height: 30px;line-height: 30px;font-size: 12px;color: #999;}
.meun2>li:hover>a{color: #ea1d1a;}


.head1 .main {margin-left: 20px; height: 100px}
/*.head1 nav.main a {color: #333333;font-size: 15px;font-weight: bold;margin: 0 19px; }
.head1 nav.main a:hover { color: #ea1d1a; }*/
.head1 .main li {line-height: 100px}
.head1 .main li a {color: #333333;font-size: 15px;font-weight: bold;margin: 0 19px; }
.head1 .main li:hover a,
.head1 .main li.active a{ color: #ea1d1a; }





.head2 {
  border: 1px #eaeaea solid;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden; }
  .head2 .swiper1 {
    background-color: #900;
    width: 950px; }
  .head2 .fr {
    padding: 10px 19px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
    .head2 .fr > h4 {
      font-weight: bold; }
    .head2 .fr .vip {
      margin: 5px 0; }
    .head2 .fr .rank_list {
      padding: 0px 0 0; }
      .head2 .fr .rank_list li {
        text-align: center; }
        .head2 .fr .rank_list li h5 {
          color: #333333;
          margin-bottom: 5px;
          font-weight: bold; }
        .head2 .fr .rank_list li h6 {
          color: #999999; }
    .head2 .fr > .tit {
      color: #333333;
      font-weight: bold; }
    .head2 .fr .list li {
      background: url(../img/ii.png) 0px center no-repeat;
      padding-left: 20px;
      margin: 10px 0; }
    .head2 .fr hr.cut {
      height: 1px;
      margin: 19px 0;
      border-bottom: 1px #f6f6f6 solid;
      padding: 0;
      background: none; }

.head3 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .head3 .fl {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 950px;
    -moz-box-flex: 0;
    -ms-flex: 0 0 950px;
    flex: 0 0 950px; }
    .head3 .fl > a {
      float: left;
      background-repeat: no-repeat;
      -webkit-background-size: cover;
      background-size: cover;
      background-position: center bottom; }
      .head3 .fl > a:hover .tit {
        -webkit-transform: translate(0px, 10px);
        -ms-transform: translate(0px, 10px);
        transform: translate(0px, 10px); }
      .head3 .fl > a.tt1, .head3 .fl > a.tt2 {
        width: 294px;
        height: 289px;
        margin-right: 10px; }
        .head3 .fl > a.tt1 .tit, .head3 .fl > a.tt2 .tit {
          padding: 32px;
          text-align: center; }
      .head3 .fl > a.tt3 {
        width: 338px;
        height: 140px;
        margin-bottom: 10px; }
      .head3 .fl > a.tt4 {
        width: 338px;
        height: 140px;
        margin-bottom: 0px; }
      .head3 .fl > a .tit {
        padding: 28px;
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s; }
        .head3 .fl > a .tit h2 {
          font-size: 20px;
          font-weight: bold;
          margin-bottom: 12px;
          color: #333333; }
        .head3 .fl > a .tit h3 {
          font-size: 14px;
          color: #999999; }
  .head3 .fr {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 5px;
    padding: 20px 10px 10px 20px;
    background-color: #f6f6f6;
    -webkit-border-radius: 4px;
    border-radius: 4px; }
    .head3 .fr h3 {
      color: #333333; }
    .head3 .fr .o_list > li {
      margin-bottom: 10px; }
      .head3 .fr .o_list > li h6 {
        margin-bottom: 5px;
        color: #999999; }
    .head3 .fr .pics {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
      .head3 .fr .pics li {
        width: 37px;
        height: 37px;
        background-color: #fff;
        margin-bottom: 3px;
        margin-right: 3px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 4px;
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s; }
        .head3 .fr .pics li:hover {
          background-color: #ea1d1a; }
        .head3 .fr .pics li img {
          width: 100%; }

.tit2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 30px; }
  .tit2 .fl {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }
    .tit2 .fl h2 {
      margin-right: 10px;
      font-weight: bold;
      color: #333333; }
    .tit2 .fl h6 {
      font-size: 14px;
      color: #999999; }
  .tit2 a.more {
    font-size: 14px;
    color: #999999; }

.prot_list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }
  .prot_list li {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 19.7%;
    -moz-box-flex: 0;
    -ms-flex: 0 1 19.7%;
    flex: 0 1 19.7%;
    height: 290px;
    position: relative;
    margin-right: 9px;
	  margin-top: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden; }
    .prot_list li h3, .prot_list li h4 {
      font-weight: bold;
      color: #333333; }
    .prot_list li:hover {
      -webkit-box-shadow: 0 0 8px #ccc;
      box-shadow: 0 0 8px #ccc; }
      .prot_list li:hover .buy {
        height: 44px; }
    .prot_list li:last-child {
      margin-right: 0; }
    .prot_list li .hot {
      width: 29px;
      height: 29px;
      background: url(../img/hot.png) 0px 0px no-repeat;
      position: absolute;
      left: 5px;
      top: 5px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      color: #ea1d1a; }
    .prot_list li .price b {
      margin-right: 6px;
      font-size: 1.3em; }
    .prot_list li .desc {
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
      -moz-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; }
      .prot_list li .desc i {
        font-style: normal; }
    .prot_list li .tit {
      color: #333333; }
    .prot_list li s {
      color: #999999; }
    .prot_list li .tit, .prot_list li .price, .prot_list li .desc {
      padding: 3px 10px; }
    .prot_list li .pic {
      -webkit-box-flex: 1;
      -webkit-flex: 1;
      -moz-box-flex: 1;
      -ms-flex: 1;
      flex: 1;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center; }
    .prot_list li .buy {
      padding: 0 10px;
      margin-top: 10px;
      background-color: #ea1d1a;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
      -moz-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      height: 0;
      overflow: hidden;
      -webkit-transition: all 0.2s;
      -o-transition: all 0.2s;
      transition: all 0.2s; }
      .prot_list li .buy a {
        color: #fff; }
    .prot_list li.focus {
      -webkit-background-size: cover;
      background-size: cover;
      background-position: center 0;
      text-align: center;
      -webkit-transition: all 0.2s;
      -o-transition: all 0.2s;
      transition: all 0.2s;
      -webkit-box-shadow: 0 0 0px #ccc;
      box-shadow: 0 0 0px #ccc; }
      .prot_list li.focus:hover {
        background-position: 0 -30px; }
      .prot_list li.focus .cont {
        padding-top: 30px; }
      .prot_list li.focus h3 {
        margin-bottom: 5px; }
      .prot_list li.focus .desc {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }

.foot {
  background-color: #3c3c3c;
  /*margin-top: 60px;本样式影响别的页面，比如===========1.2-列表页-竖排=====这张页面底部和上面内容没有间距的，详见设计稿================*/ }
  .foot .cen {
    padding: 70px 0; }
    .foot .cen .nav1 {
      text-align: center;
      margin: 0 0px 30px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
      -moz-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      border-bottom: 1px #4f4f4f dotted;
      padding: 0 50px 30px; }
      .foot .cen .nav1 .cut {
        border-right: 1px #4f4f4f solid;
        height: 20px;
        width: 1px; }
      .foot .cen .nav1 sm {
        font-size: 16px;
        color: #fff; }
        .foot .cen .nav1 sm:last-child {
          border-right: none; }
        .foot .cen .nav1 sm i {
          font-size: 22px;
          margin-right: 5px; }
    .foot .cen .nav2 {
      margin: 0px 50px 0;
      -webkit-box-align: start;
      -webkit-align-items: flex-start;
      -moz-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start; }
      .foot .cen .nav2 ul {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -moz-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-right: 30px; }
        .foot .cen .nav2 ul li {
          -webkit-box-flex: 1;
          -webkit-flex: 1;
          -moz-box-flex: 1;
          -ms-flex: 1;
          flex: 1; }
          .foot .cen .nav2 ul li h5 {
            color: #fff;
            margin-bottom: 1.5em; }
          .foot .cen .nav2 ul li a {
            display: block;
            color: #999999;
            margin-bottom: 0.7em; }
            .foot .cen .nav2 ul li a:hover {
              color: #fff; }
      .foot .cen .nav2 .fr {
        color: #999999; }
        .foot .cen .nav2 .fr b {
          font-size: 18px; }
  .foot .copyright {
    border-top: 1px #404040 solid;
    background-color: #313131;
    text-align: center;
    padding: 30px;
    color: #999999; }
    .foot .copyright a {
      margin: 0 10px;
      color: #999999; }
      .foot .copyright a:hover {
        color: #fff; }

.fixed {
  position: fixed;
  z-index: 999;
  right: 0;
  top: 30%;
  -webkit-box-shadow: 0 0 8px #eee;
  box-shadow: 0 0 8px #eee;
  background-color: #fff; }
  .fixed a {
    display: block;
    width: 70px;
    height: 80px;
    text-align: center;
    padding-top: 17px;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    position: relative; }
    .fixed a:after {
      content: "";
      width: 60%;
      /*height: 1px;
      background-color: #eaeaea;*/
      position: absolute;
      bottom: 0;
      left: 20%; }
    .fixed a:last-child:after {
      display: none; }
    .fixed a:hover {
      background-color: #ea1d1a; }
      .fixed a:hover h4, .fixed a:hover i {
        color: #fff; }
      .fixed a:hover:after {
        display: none; }
    .fixed a:visited, .fixed a.active {
      text-decoration: none; }
    .fixed a i {
      color: #ea1d1a;
      font-size: 26px; }
    .fixed a h4 {
      margin-top: 5px;
      color: #333333;
      font-size: 14px; }

#btn-group {
  margin-left: 10px; }
  #btn-group a {
    width: 110px;
    color: #ea1d1a;
    border-color: #ea1d1a; }
    #btn-group a:hover {
      background-color: #ea1d1a;
      border-color: #ea1d1a;
      color: #fff; }
  #btn-group .btn_cart i {
    line-height: 100%; }

#input-group {
  width: 330px; }

#swiper1 {
  background-color: #fff;
  width: 950px;
  height: 535px; }
  #swiper1 .video_layer {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    display: none; }
    #swiper1 .video_layer .close_btn {
      cursor: pointer;
      width: 30px;
      height: 30px;
      background-color: rgba(0, 0, 0, 0.7);
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding: 5px;
      position: absolute;
      right: 0px;
      top: 0px; }
      #swiper1 .video_layer .close_btn img {
        width: 100%; }
  #swiper1 .swiper-slide {
    position: relative; }
    #swiper1 .swiper-slide .pic {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%; }
      #swiper1 .swiper-slide .pic img {
        width: 950px;
        height: 535px; }
    #swiper1 .swiper-slide .btn_play {
      width: 70px;
      cursor: pointer;
      opacity: .6;
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      -webkit-transition: all 0.2s;
      -o-transition: all 0.2s;
      transition: all 0.2s; }
      #swiper1 .swiper-slide .btn_play:hover {
        opacity: 1; }
  #swiper1 .swiper-pagination {
    bottom: 50px; }
  #swiper1 .swiper-pagination-bullet {
    width: 18px;
    height: 18px;
    background: #fff;
    opacity: .6; }
  #swiper1 .swiper-pagination-bullet-active {
    background: #ea1d1a;
    opacity: 1; }

#GaugeMeter_1 {
  height: 100px;
  position: relative;
  text-align: center;
  overflow: hidden;
  cursor: default; }
  #GaugeMeter_1 > span, #GaugeMeter_1 > b {
    position: absolute;
    text-align: center;
    display: inline-block;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    left: 50%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%); }
  #GaugeMeter_1 > span {
    top: -20px;
    line-height: 100%;
    font-size: 20px;
    color: #ea1d1a;
    font-weight: bold; }
    #GaugeMeter_1 > span u {
      text-decoration: none; }
  #GaugeMeter_1 b {
    top: -24px;
    left: 50%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%); }

.scr {
  overflow: auto; }

.layui-layer-page .layui-layer-content {
  overflow: hidden !important; }

/*20190808角标导致购物车宽度增加*/
#btn-group a {
  width: 122px;
}