 /*防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
html {
    color: #434343;
    background: white;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

/* 内外边距通常让各个浏览器样式的表现位置不同 */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    margin: 0;
    padding: 0;
}

/* 重设 HTML5 标签, IE 需要在 js 中 createElement(TAG) */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

/* HTML5 媒体文件跟 img 保持一致 */
audio, canvas, video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}
img {
    vertical-align: middle;
}
/* 要注意表单元素并不继承父级 font 的问题 */
body, button, input, select, textarea {
    font: 12px/1.5 "Lantinghei SC",  "Microsoft YaHei", "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif, \5b8b\4f53;
}
input, select, textarea {
    font-size: 100%;
    outline:none;
}

/* 去掉各Table  cell 的边距并让其边重合 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* IE bug fixed:th 不继承 text-align */
th {
    text-align: inherit;
}

/* 去除默认边框 */
fieldset, img {
    border: 0;
}

/* ie6 7 8(q) bug 显示为行内表现 */
iframe {
    display: block;
}

/* 去掉 firefox 下此元素的边框 */
abbr, acronym {
    border: 0;
    font-variant: normal;
}

/* 一致的 del 样式 */
del {
    text-decoration: line-through;
}
address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: 500;
}

/* 去掉列表前的标识, li 会继承 */
ol, ul {
    list-style: none;
}

/* 对齐是排版最重要的因素, 别让什么都居中 */
caption, th {
    text-align: left;
}

/* 来自yahoo, 让标题都自定义, 适应多个系统应用 */
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: 500;
}
q:before, q:after {
    content: '';
}

/* 统一上标和下标 */
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}

/* 正常链接 未访问 */
/* a:link {
        color: #08c;
}
*/

/* 鼠标悬停 */

a:hover {
    text-decoration: none;
    outline: none;
}
a,a:hover,a:active,a:link,a:visited{
    outline: none;
    text-decoration: none;
    font-size: inherit;
    color: inherit;
}
a {
  font-size: inherit;
}
/* 默认不显示下划线，保持页面简洁 */
ins, a {
    text-decoration: none;
}

/* 代码字体 */
code, kbd, pre, samp {
    font-family: monospace, serif;
    font-size: 1em;
}

/* 清理浮动 */
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.clearfix {
    zoom: 1; /* for IE6 IE7 */
}

/* 隐藏, 通常用来与 JS 配合 */
body .fn-hide {
    display: none;
}

/* 设置内联, 减少浮动带来的bug */
.fn-left, .fn-right {
    display: inline;
}
.fn-left {
    float: left;
}
.fn-right {
    float: right;
}

/*文字居中，居左，居右*/
.fn-tc{
    text-align: center;
}
.fn-tl{
    text-align: left;
}
.fn-tr{
    text-align: right;
}
/* 单行文字溢出时出现省略号，需设定宽度 */
.fn-text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fn-hide {
	overflow: hidden;
}
button{
    border: none;
    outline: none;
    background-color: transparent;
    cursor: pointer;
}

.indent2em{
  text-indent: 2em;
}


/* flex布局 */
.flex_v{-webkit-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
.flex_1{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;}
.flex_3{-webkit-box-flex:3;-webkit-flex:3;-ms-flex:1;flex:3;}
.flex_align_center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
.flex_align_end{-webkit-box-align:end;-webkit-align-items:end;-ms-flex-align:end;align-items:end;}
.flex_pack_center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
.flex_pack_justify{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}
.flex_pack_end{
  -webkit-box-pack:end;
  -webkit-justify-content:flex-end;
  -ms-flex-pack:end;
  justify-content:flex-end;
}

/* 顺序不能写错 否则不兼容iphone6s */
.flex{
  display: -webkit-box;
  display: -webkit-flex;
  display: box;
  display: flex;
  display: block\9;
}

.flex:after{
  content: '';
  display: none;
  clear: both\9;
  display: block\9;
  overflow: hidden\9;
  visibility: hidden\9;
  width: 0px\9;
  height: 0px\9;
}

.flex>*{
    display: block\9;
    float: left\9;
    margin: 0 2px\9;
}

.flex_wrap{
  flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
}

.flex_start{
   align-content: flex-start;
   -webkit-align-content: flex-start;
   -moz-align-content: flex-start;
   -ms-align-content: flex-start;
}

.space_around{
  -webkit-justify-content:space-around;
  -moz-justify-content:space-around;
  -ms-justify-content:space-around;
  justify-content:space-around;
}

.flex>*.ie_Cb{
    display: none;
    float: none;
    clear: both\9;
    display: block\9;
    overflow: hidden\9;
    visibility: hidden\9;
    width: 0px\9;
    height: 0px\9;    
}

.ie_clearfix:after{
  content: '';
  display: none;
  clear: both\9;
  display: block\9;
  overflow: hidden\9;
  visibility: hidden\9;
  width: 0px\9;
  height: 0px\9;
}


.flex.flex_align_center.flex_pack_center{
  position: relative\9;
}

.flex.flex_align_center.flex_pack_center>*{
  position: absolute\9;
  left: 0\9;
  right: 0\9;
  top: 0\9;
  bottom: 0\9;
  margin: auto\9;
}

.red{
  color: #672319 !important;
}


/*----------------------------------------------------------------- loading ---------------------------------------------*/

.loading{
    width: 100%;
    height: 100%;
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9000;
}

.loadWrp{
    width: 283px;
    height: 212px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.loadWrp dt{
    width: 100%;
    height: auto;
}

.loadWrp dt img{
    width: 100%;
}

.loadWrp dd{
    text-align: center;
    color: #fff;
    font-size: 18px;
    margin: -80px 0 0;
}

        
@media (max-width: 767px) {


    .loading{
        width: 100%;
        height: 100%;
        background: #000;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9000;
    }

    .loadWrp{
        width: 4rem;
        height: 3rem;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

    .loadWrp dt{
        width: 100%;
        height: auto;
    }

    .loadWrp dd{
        text-align: center;
        color: #fff;
        font-size: 18px;
        margin: -.88rem 0 0;
    }

}


/*----------------------------------------------------------------- 头部和导航 ---------------------------------------------*/


/**/

.header{
  width: 100%;
  height: 80px;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9900;
  padding: 0 40px 0;
  height:80px;
  background: #fdfbf6;
  box-shadow:0px 4px 12px 0px rgba(69,40,40,0.1);
}

.header.headPos{}

.headCon{
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
}

.headCon .logo{
  display: block;
  cursor: pointer;
  width: 107px;
  height: 100%;
  position: relative;
}

.aLogo{
  width: 107px;
  height: 80px;
}

.headCon .logo img{
  display: block;
  width: 100%;
}

.headCon .nav{
  width: 850px;
  height: 80px;
}

.nav ul{
  width: 100%;
}

.nav ul li{}
.nav ul li a{
  font-size: 18px;
  display: block;
  position: relative;
  font-size:18px;
  font-family:SourceHanSansSC-Regular;
  font-weight:400;
  color:rgba(102,102,102,1);
  line-height:30px;
}

.nav ul li.cnavON a{color: #DC2021;}
.nav ul li.cnavON a:after{
  content: '';
  display: block;
  width: 72px;
  height: 10px;
  background: url(../images/navOn.png) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  left: calc(50% - 36px);
  bottom: -25px;
}

.headR{ display: none; }
.layerNav{
   display: none;
}





/*@media (max-width: 1520px) and (min-width: 1200px){*/
@media (max-width: 1520px){

  .headCon .nav{
    width: 850px;
  }


  .headCon .logo{
    display: block;
    cursor: pointer;
    width: 107px;
    height: 100%;
    position: relative;
  }

  .aLogo{
    width: 107px;
    height: 80px;
  }


}


@media (max-width: 767px) {
  
  .header{
    width: 100%;
    height: 1rem;
    position: fixed;
    left: 0;
    top: 0;
    padding: .06rem .2rem 0;
  }

  .headCon{
    max-width: 100%;
  }

  .headCon .logo {
      display: block;
      margin-right: .8rem;
      cursor: pointer;
      width: 1rem;
      position: static;
  }

  .aLogo{
    position: absolute;
/*    width: 1.33rem;
    height: 1rem;*/
    width: 1.6rem;
    height: 1.2rem;    
    /*left: calc(50% - .8rem);*/
    left: 15px;
    top: 0;
  }

  .headCon .nav {
      width: calc(100% - 1rem);
      display: none;
  }

  .nav ul li a {
      font-size: 15px;
      display: block;
      position: relative;
  }

  .nav ul li.cnavON a:after {
      content: '';
      display: block;
      width: 30px;
      height: 2px;
      background: #f1e5be;
      position: absolute;
      left: calc(50% - 15px);
      bottom: -.24rem;
  }

  .headR{
    display: block;
    width: .7rem;
    height: .7rem;    
  }

  .headR dd{
    width: .7rem;
    height: .7rem;
  }

 .aNav{
    display: block;
    width: .7rem;
    height: .7rem;
    padding: .22rem 0 0 0;
    margin: .05rem 0 0 0;
    position: relative;
    box-sizing: border-box;
  }

  .aNav .icon_bar{
    display: block;
    width: .5rem;
    height: .04rem;
    background: #DC2021;
    position: absolute;
    left:.1rem;
    top: 07rem;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;

  }

  .aNav .icon_bar:nth-of-type(1){
    top: .2rem;
  }

  .aNav .icon_bar:nth-of-type(2){
    top: .34rem;
  }

  .aNav .icon_bar:nth-of-type(3){
    top: .34rem;
  }

  .aNav .icon_bar:nth-of-type(4){
    top: .48rem;
  }

  .aNav.aNavOn{
    width: .7rem;
    height: .7rem;
    padding: .22rem 0 0 0;
    margin: .05rem 0 0 0;
    z-index: 8000;
  }


  .aNav.aNavOn .icon_bar{
    background: #DC2021;
  }


  .aNav.aNavOn .icon_bar:nth-of-type(1){
    top: .2rem;
    width: 0;
  }

  .aNav.aNavOn .icon_bar:nth-of-type(2){
    top: .35rem;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .aNav.aNavOn .icon_bar:nth-of-type(3){
    top: .35rem;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  .aNav.aNavOn .icon_bar:nth-of-type(4){
    top: .48rem;
    width: 0;
  }


  .layerNav{
    position: fixed;
    right: 0;
    top: 0;
    z-index: 6000;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
    display: none;
  }


  .layerNav dl{
    width: 100%;
    height: 9rem;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5rem);
  }


  .layerNav a{
    display: block;
    width: 100%;
    height: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    font-size: .42rem;
    border-bottom: 1px solid #555;
    color: #fff;
    padding: 0;
  }


  .layerNav a i{
    margin: 0 auto;
  }

}



/*---------------------------------------------------------- 底部 -------------------------------------------------------------- */


.footer{
  width: 100%;
  height: 294px;
  background: url(../images/footer_bg.png) no-repeat center top;
}

.footer dl{
  width: 1230px;
  height: auto;
  margin: 30px auto 0;
}

.footer dt{
  position: relative;
  box-sizing: border-box;
  padding: 0 30px;
}

.footer dt img{
  display: block;
  width: 100%;
}


.footer dd.footInfo{
  margin: 0 0 0 60px;
}

.footLink{
  width: 550px;
  height: 24px;
  margin: 0 -12px;
}

.footLink a{
  color: #ccc;
  font-size: 16px;
  margin: 0 12px;
  position: relative;
}

.footLink a:after{
  content: '';
  width: 1px;
  height: 12px;
  background: #555;
  position: absolute;
  right: -12px;
  top: 5px;
}

.footLink a:last-of-type:after{
  content: '';
  display: none;
}

.footInfo ul{
  margin: 20px 0 0 0;
}

.footInfo ul li{
  color: #999;
  font-size: 14px;
  line-height: 1.6;
}


@media (max-width: 767px) {

  .footer {
      width: 100%;
      height: 2.94rem;
      /*background: url(../images/footer_bg.png) no-repeat center top;*/
      background: url(../images/footer_bg.png) no-repeat -1.8rem 0;
      text-align: center;
      margin: 0;
      position: relative;
      z-index: 10;
  }

  .footer dl{
    width: 100%;
    height: auto;
    margin: .8rem auto 0;
  }

  .footer dt{
    position: relative;
    box-sizing: border-box;
    padding: 0 .6rem;
  }

  .footer dt img{
    display: block;
    width: 100%;
  }


  .footer dd.footInfo{
     display: none;
  }

}


/*------------------------------------------------------ banner -------------------------------------------------------- */

.banner{
   width: 100%;
   height: auto;
   margin: 80px auto 0;
}

.banCon{
   width: 100%;
   height: auto;
}

.banImg{
  /*height: 500px;*/
  overflow: hidden;
}

.banImg img{
  display: block;
  width: 100%;
}

@media (max-width: 767px) {

  .banner{
     width: 100%;
     height: auto;
     margin: 1rem auto 0;
  }

}



/*------------------------------------------------------ 侧边栏 -------------------------------------------------------- */

.sidebar{
  width: 40px;
  height: 40px;
  position: fixed;
  right: 30px;
  bottom: 120px;
  z-index: 9800;
}

.s_music{
  width: 32px;
  height: 32px;
  margin: 0 auto 20px;
}

.s_music a{
  display: block;
  width: 32px;
  height: 32px;
}


.s_music a .icon_music{
  display: block;
  width: 32px;
  height: 32px;
  background: url(../images/icon_music.png) no-repeat;
  background-size: 100% 100%;
}

.s_music a .icon_music.icon_music.musicRotate{
  width: 32px;
  height: 32px;
  background: url(../images/icon_music.png) no-repeat;
  background-size: 100% 100%;
  animation:musicRotate 2s linear infinite;
  -webkit-animation:musicRotate 2s linear infinite; 
}

@keyframes musicRotate
{
  from {
    transform:rotate(0deg);
    -ms-transform:rotate(0deg);   /* IE 9 */
    -moz-transform:rotate(0deg);  /* Firefox */
    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
    -o-transform:rotate(0deg);
  }
  to {
    transform:rotate(360deg);
    -ms-transform:rotate(360deg);   /* IE 9 */
    -moz-transform:rotate(360deg);  /* Firefox */
    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
    -o-transform:rotate(360deg);    
  }
}

@-webkit-keyframes musicRotate /*Safari and Chrome*/
{
  from {
    transform:rotate(0deg);
    -ms-transform:rotate(0deg);   /* IE 9 */
    -moz-transform:rotate(0deg);  /* Firefox */
    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
    -o-transform:rotate(0deg);
  }
  to {
    transform:rotate(360deg);
    -ms-transform:rotate(360deg);   /* IE 9 */
    -moz-transform:rotate(360deg);  /* Firefox */
    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
    -o-transform:rotate(360deg);    
  }
}

.s_con{
  width: 90px;
  height: 150px;
}

.ewm{
  width: 90px;
  height: 118px;
  background: url(../images/ewm.png) no-repeat;
  background-size: 100% 100%;
}

.sc_top{
  width: 40px;
  height: 40px;
  background: #672319;
  border-radius: 5px;
  display: none;
}

.sc_top a{
  display: block;
  width: 40px;
  height: 40px;
  background: url(../images/arrowTop.png) no-repeat center center;
  background-size: 20px 12px;
}


@media (max-width: 767px) {

.sidebar{
  width: .68rem;
  /*height: 2rem;*/
  height: 1rem;
  position: fixed;
  right: .2rem;
  bottom: 10px;
}

.s_music{
  width: .68rem;
  height: .68rem;
  margin: 0 auto .2rem;
}

.s_music a{
  display: block;
  width: .68rem;
  height: .68rem;
  box-sizing: border-box;
  padding: .09rem 0 0 .09rem;
}


.s_music a .icon_music{
  display: block;
  width: .5rem;
  height: .5rem;
  background: url(../images/mob/icon_music.png) no-repeat;
  background-size: 100% 100%;
}

.s_music a .icon_music.icon_music.musicRotate{
  width: .5rem;
  height: .5rem;
  background: url(../images/mob/icon_music.png) no-repeat;
  background-size: 100% 100%;
  animation:musicRotate 2s linear infinite;
  -webkit-animation:musicRotate 2s linear infinite; 
}



.s_con{
  width: .68rem;
  height: 1.36rem;
}

.ewm{
  width: .68rem;
  height: .68rem;
  position: relative;
}

.ewmClick{
  display: block;
  width: .68rem;
  height: .68rem;
  background: url(../images/mob/ewmText.png) no-repeat;
  background-size: 100% 100%;
}

.ewmImg{
  width: 1.2rem;
  height: 1.6rem;
  background: #ede9d9;
  border-radius: .02rem;
  position: absolute;
  left: -1.32rem;
  top: -.26rem;
  display: none;
}

.ewmImg img{
  display: block;
  width: 1.1rem;
  height: 1.1rem;
  margin: .1rem auto 0;
}

.ewmImg p{
  text-align: center;
  font-size: .24rem;
  color: #190e02;
}


.sc_top{
  width: .68rem;
  height: .68rem;
  display: none;
}

.sc_top a{
  display: block;
  width: .68rem;
  height: .68rem;
  background: url(../images/arrowTop.png) no-repeat center center;
}



}




/*------------------------------------------------------ 主体 -------------------------------------------------------- */

.pubBox {
/*  padding-right: 15px;
  padding-left: 15px;*/
  margin-right: auto;
  margin-left: auto;
  max-width: 1520px;
}

/*@media (min-width: 768px) {
  .pubBox {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .pubBox {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .pubBox {
    width: 1430px;
  }
*/

@media (max-width: 1520px) and (min-width: 1200px){
  .pubBox{
    width: 1200px;
  }
}

.pubBox .areaWrp{
  margin: 0 -15px;
}



@media (max-width: 767px) {
  .pubBox{
    width: 100%;
  }
}

.main{
  width: 100%;
  height: auto;
}

.area{}
.area .container{}
.title{}
.areaWrp{}

/* 轮播滑动 */
.imgswitWrp{}
.imgswitCon{}
.imgswitUl{}
.aIsLeft{}
.aIsRight{}






