 /*防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
 
 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 {
     color: #000000;
     text-decoration: none;
     outline: none;
 }
 
 a,
 a:hover,
 a:active,
 a:link,
 a:visited {
     outline: none;
     text-decoration: none;
 }
 
 a {
     color: #000000;
 }
 /* 默认不显示下划线，保持页面简洁 */
 
 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;
 }
 /* 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;
 }
 /*.flex{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
}*/
 /* 顺序不能写错 否则不兼容iphone6s */
 
 .flex {
     display: -webkit-box;
     display: -webkit-flex;
     display: box;
     display: flex;
 }
 
 .flex_wrap {
     flex-wrap: wrap;
     -webkit-flex-wrap: wrap;
 }
 
 .flex_start {
     align-content: flex-start;
     -webkit-align-content: flex-start;
 }
 
 .space_around {
     -webkit-justify-content: space-around;
     justify-content: space-around;
 }
 /*----------------------------------------------------------------- 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;
     }
 }
 /*----------------------------------------------------------------- 头部和导航 ---------------------------------------------*/
 /**/
 
 .headerWrp {
     width: 100%;
     height: 116px;
     position: fixed;
     /*position: absolute;*/
     left: 0;
     top: 0;
     z-index: 800;
     padding: 27px 40px 0;
 }
 
 .headerWrp.headPos {}
 
 .nav {
     width: 1200px;
     height: auto;
     margin: 0 auto;
 }
 
 .nav .logo {
     display: block;
     margin-right: 39px;
     cursor: pointer;
     width: 330px;
 }
 
 .nav .logo img {
     display: block;
     width: 100%;
 }
 
 .nav ul {
     width: 620px;
 }
 
 .nav ul li {}
 
 .nav ul li a {
     font-size: 20px;
 }
 
 .nav ul li a:link {
     color: #000
 }
 
 .nav ul li a:visited {
     color: #000
 }
 
 .nav ul li a:hover {
     color: #8e3334;
 }
 
 .nav ul li a:active {
     color: #8e3334;
 }
 
 .nav ul li.cnavON a {
     color: #8e3334;
 }
 
 .nav dd {
     width: 45px;
 }
 
 .nav dd a.a_music {
     display: block;
 }
 
 .nav dd i.icon_music {
     display: block;
     width: 45px;
     height: 45px;
     background: url(../images/icon_music.png) no-repeat;
 }
 
 .nav dd i.icon_music.musicRotate {
     width: 45px;
     height: 45px;
     /*  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);
     }
 }
 
 .aNav {
     display: none;
     width: 70px;
     height: 70px;
     padding: 22px 0 0 0;
     position: relative;
     margin-left: 30px;
     box-sizing: border-box;
 }
 
 @media (max-width: 767px) {
     .aNav {
         display: block;
     }
 }
 
 .aNav .icon_bar {
     display: block;
     width: 28px;
     height: 3px;
     background: #fff;
     /*  margin: 0 auto;
  margin-top: 7px;*/
     position: absolute;
     left: 9px;
     top: 7px;
     -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: 10px;
 }
 
 .aNav .icon_bar:nth-of-type(2) {
     top: 21px;
 }
 
 .aNav .icon_bar:nth-of-type(3) {
     top: 21px;
 }
 
 .aNav .icon_bar:nth-of-type(4) {
     top: 32px;
 }
 
 .aNav.aNavOn {
     position: fixed;
     right: 40px;
     top: 27px;
     z-index: 8000;
     background: #fff;
     width: 45px;
     height: 45px;
 }
 
 .aNav.aNavOn .icon_bar {
     background: #9c050c;
     left: 6px;
 }
 
 .aNav.aNavOn .icon_bar:nth-of-type(1) {
     top: 10px;
     width: 0;
 }
 
 .aNav.aNavOn .icon_bar:nth-of-type(2) {
     top: 21px;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg);
 }
 
 .aNav.aNavOn .icon_bar:nth-of-type(3) {
     top: 21px;
     -webkit-transform: rotate(-45deg);
     transform: rotate(-45deg);
 }
 
 .aNav.aNavOn .icon_bar:nth-of-type(4) {
     top: 32px;
     width: 0;
 }
 
 .layerBg {
     position: fixed;
     left: 0;
     top: 0;
     z-index: 5000;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.45);
     padding: 0 64px;
     display: none;
 }
 
 .layerNav {
     position: fixed;
     right: 0;
     top: 0;
     z-index: 6000;
     width: 360px;
     height: 100%;
     background: #9c050c;
     padding: 0 64px;
     display: none;
 }
 
 .layerNav dl {
     width: 100%;
     height: 630px;
     position: absolute;
     left: 0;
     top: calc(50% - 315px);
 }
 
 .layerNav a {
     display: block;
     padding: 30px 0 30px;
     text-align: center;
     font-size: 26px;
     /*border-bottom: 1px solid #adadad;*/
     color: #fff;
 }
 
 .layerNav a i {
     margin: 0 auto;
 }
 
 @media (max-width: 767px) {
     body {
         width: 100%;
         height: auto;
         overflow-x: hidden;
     }
     img {
         display: block;
         width: 100%;
     }
     .headerWrp {
         width: 100%;
         height: 1rem;
         position: fixed;
         /*position: absolute;*/
         left: 0;
         top: 0;
         z-index: 800;
         padding: 0 .4rem 0;
         background: #8a2400;
     }
     .headPos {
         background: #8a2400;
     }
     .header {
         height: 1rem;
     }
     .nav {}
     .nav .logo {
         display: block;
         width: 3.3rem;
         margin-right: 39px;
     }
     .header dd {
         width: auto;
     }
     .header dd a {
         /*display: block;*/
         width: .7rem;
         height: .7rem;
     }
     .header dd i.icon_music {
         display: block;
         width: .45rem;
         height: .45rem;
         background: url(../images/icon_music.png) no-repeat;
         background-size: 100% 100%;
     }
     .header dd i.icon_music.musicRotate {
         width: .45rem;
         height: .45rem;
         /*  background: url(../images/icon_music.png) no-repeat;
    background-size: 100% 100%;*/
         animation: musicRotate 2s linear infinite;
         -webkit-animation: musicRotate 2s linear infinite;
     }
     .aNav {
         /*display: block;*/
         width: .7rem;
         height: .7rem;
         padding: .22rem 0 0 0;
         position: relative;
         margin-left: .3rem;
         box-sizing: border-box;
     }
     .aNav .icon_bar {
         display: block;
         width: 55%;
         height: .05rem;
         background: #fff;
         position: absolute;
         left: .16rem;
         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;
         position: fixed;
         right: .3rem;
         top: .15rem;
         z-index: 8000;
         background: #fff;
     }
     .aNav.aNavOn .icon_bar {
         background: #9c050c;
     }
     .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(74, 19, 0, 0.9);
         display: none;
     }
     .layerNav dl {
         width: 100%;
         height: 11rem;
         position: absolute;
         left: 0;
         top: calc(50% - 5.5rem);
     }
     .layerNav a {
         display: block;
         width: 100%;
         height: 1.5rem;
         line-height: 1.5rem;
         text-align: center;
         font-size: .42rem;
         border-bottom: 1px solid #ac9389;
         color: #fff;
         padding: 0;
         /*font-weight: bold;*/
     }
     .layerNav a i {
         margin: 0 auto;
     }
 }
 /*---------------------------------------------------------- 底部 -------------------------------------------------------------- */
 
 .footer {
     width: 100%;
     height: 225px;
     background: #eee3c6;
 }
 
 .footer dd {
     position: relative;
 }
 
 .footer dd a {
     position: absolute;
     left: 9px;
     top: 18px;
     width: 419px;
     height: 57px;
 }
 
 @media (max-width: 767px) {
     .footer {
         width: 100%;
         height: 2.2rem;
         line-height: 2.2rem;
         background: #eee3c6;
         text-align: center;
         font-size: .26rem;
         color: #476472;
         margin: 0;
         position: relative;
         z-index: 10;
     }
     .footer dd {
         width: 5.4rem;
     }
 }
 /*------------------------------------------------------ 主体 -------------------------------------------------------- */
 
 .main {}
 
 .area {}
 
 .area .container {}
 
 .title {}
 
 .areaWrp {}
 /* 轮播滑动 */
 
 .imgswitWrp {}
 
 .imgswitCon {}
 
 .imgswitUl {}
 
 .aIsLeft {}
 
 .aIsRight {}