@charset "UTF-8";
html, body {
  height: 100%;
  overflow: hidden;
}

h1 {
  font-size: 6em;
  font-weight: normal;
}

#container, .section {
  height: 100%;
  position: relative;
}

.intro {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.min {
  width: 62.5%;
  min-width: 62.5%;
  margin: 0 auto;
  /* display: flex;
  flex-flow: row nowrap;	*/
}

.music {
  width: 34px;
  height: 28px;
  position: fixed;
  top: 150px;
  right: 160px;
  z-index: 100;
  cursor: pointer;
}

.music audio {
  display: none;
}

.music img {
  width: 34px;
  height: 28px;
}

.nav {
  height: 69px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
  background: #d11a25;
  padding-top: 29px;
  display: none;
}

.nav .logo {
  width: 299px;
  height: 48px;
}

.nav .cdlogo {
  width: 187px;
  height: 31px;
  padding-top: 5px;
}

.page {
  cursor: pointer;
  color: #670a0f;
  padding-top: 9px;
  font-weight: bold;
  font-size: 22px;
}

.btn {
  width: 174px;
  height: 129px;
  position: absolute;
  left: 50%;
  margin-left: -87px;
  bottom: 7%;
  -webkit-animation: twinkling 1s infinite ease-in-out;
}

.section + .section {
  background: url(../img/bg.png) no-repeat center;
  background-size: cover;
}

.page_sel {
  color: #fff;
}

#page1 {
  z-index: 2;
}

#page1 .bigimg {
  position: relative;
  width: 100%;
  height: auto;
}

#page3, #page4, #page5, #page6 {
  position: relative;
  background: url(../img/bg2.png) no-repeat center;
  background-size: cover;
  height: 100%;
}

#page3 .intro, #page4 .intro, #page5 .intro, #page6 .intro {
  padding-top: 98px;
}

#page3 .button, #page4 .button, #page5 .button, #page6 .button {
  width: 100%;
  height: 79px;
  position: absolute;
  top: 50%;
  margin-top: -49.5px;
  z-index: 15;
}

#page3 .btn_l, #page4 .btn_l, #page5 .btn_l, #page6 .btn_l {
  margin-left: 44px;
  cursor: pointer;
}

#page3 .btn_r, #page4 .btn_r, #page5 .btn_r, #page6 .btn_r {
  cursor: pointer;
  margin-right: 44px;
}

#page3 .bigimg, #page4 .bigimg, #page5 .bigimg, #page6 .bigimg {
  width: 100%;
  height: 100%;
  top: 15%;
  background: url(../img/img5.png) no-repeat;
  position: absolute;
  background-position: 50% 0%;
  transition: all 0.4s ease-out;
  overflow: hidden;
}

#page3 .imgbox, #page4 .imgbox, #page5 .imgbox, #page6 .imgbox {
  width: 100%;
  height: 98px;
  position: absolute;
  bottom: 0;
  background: url(../img/lb_bg.png) no-repeat center;
  background-size: cover;
  display: flex;
  flex-flow: row nowrap;
  padding-top: 25%;
  z-index: 10;
}

#page3 .imgbox .s_img, #page3 .imgbox img, #page4 .imgbox .s_img, #page4 .imgbox img, #page5 .imgbox .s_img, #page5 .imgbox img, #page6 .imgbox .s_img, #page6 .imgbox img {
  width: 150px;
  height: 84px;
  cursor: pointer;
}

#page3 .imgbox .lbbtn, #page4 .imgbox .lbbtn, #page5 .imgbox .lbbtn, #page6 .imgbox .lbbtn {
  width: 134px;
  height: 51px;
  position: absolute;
  right: 37px;
  bottom: 137px;
}

#page3 .imgbox .lbbtn .btnl, #page3 .imgbox .lbbtn .btnr, #page4 .imgbox .lbbtn .btnl, #page4 .imgbox .lbbtn .btnr, #page5 .imgbox .lbbtn .btnl, #page5 .imgbox .lbbtn .btnr, #page6 .imgbox .lbbtn .btnl, #page6 .imgbox .lbbtn .btnr {
  width: 51px;
  height: 51px;
  float: left;
  margin-left: 12px;
}

#page3 .imgbox .lbbtn .btnl img, #page3 .imgbox .lbbtn .btnr img, #page4 .imgbox .lbbtn .btnl img, #page4 .imgbox .lbbtn .btnr img, #page5 .imgbox .lbbtn .btnl img, #page5 .imgbox .lbbtn .btnr img, #page6 .imgbox .lbbtn .btnl img, #page6 .imgbox .lbbtn .btnr img {
  width: 51px;
  height: 51px;
}

#page3 .imgbox .content, #page4 .imgbox .content, #page5 .imgbox .content, #page6 .imgbox .content {
    width: 62.5%;
    padding-left: 95px;
    position: absolute;
    left: 50%;
    margin-left: -37%;
    box-sizing: border-box;
    bottom: 30%;
}

#page3 .imgbox .content p, #page4 .imgbox .content p, #page5 .imgbox .content p, #page6 .imgbox .content p {

}

#page3 .imgbox .content .title, #page4 .imgbox .content .title, #page5 .imgbox .content .title, #page6 .imgbox .content .title {
  font-family: '微软雅黑';
  font-size: 18px;
  color: #fff;
 margin-bottom: 15px;
}

#page3 .imgbox .content .text, #page4 .imgbox .content .text, #page5 .imgbox .content .text, #page6 .imgbox .content .text {
  font-family: 'Myriad Pro';
  font-size: 18px;
  color: #fff;
margin-bottom:15px;
}

#page3 .imgbox .content .writer, #page4 .imgbox .content .writer, #page5 .imgbox .content .writer, #page6 .imgbox .content .writer {
  font-family: 'Helvetica';
  font-size: 22px;
  color: #fff;
}

#page3 .imgbox .img_sel, #page4 .imgbox .img_sel, #page5 .imgbox .img_sel, #page6 .imgbox .img_sel {
  border: 5px solid #d9303a;
}

#page3 .imgbox .s_imgbox, #page4 .imgbox .s_imgbox, #page5 .imgbox .s_imgbox, #page6 .imgbox .s_imgbox {
  display: flex;
  flex-flow: row nowrap;
  position: absolute;
}

#page2 .info_img, #page7 .info_img {
  width: 113px;
  height: 150px;
  margin-right: 23px;
}

#page2 .intro, #page7 .intro {
  padding-top: 98px;
}

#page2 .intro .infobtn, #page7 .intro .infobtn {
  position: absolute;
  width: 282px;
  left: 50%;
  margin-left: -141px;
  bottom: 5%;
}

#page2 .intro .infobtn div, #page7 .intro .infobtn div {
  width: 118px;
  height: 80px;
  cursor: pointer;
}

#page2 .intro .infobtn .up, #page7 .intro .infobtn .up {
  margin-right: 45px;
  background: url(../img/up0.png) no-repeat center;
}

#page2 .intro .infobtn .down, #page7 .intro .infobtn .down {
  background: url(../img/down1.png) no-repeat center;
}

#page2 .info, #page7 .info {
  color: #9e672d;
  height: 50%;
  overflow: hidden;
  position: relative;
  margin-top: 6%;
}

#page2 .info .roll, #page7 .info .roll {
  position: absolute;
}

#page2 .info .introduce p, #page7 .info .introduce p {
  font-size: 24px;
  text-indent: 0em;
}

#page2 .name, #page7 .name {
  margin-top: 55px;
}

#page2 .info .text p, #page7 .info .text p {
  font-size: 28px;
  text-indent: 2em;
  margin-top: 35px;
  line-height: 38px;
}
#page2 .info .text p, #page7 .info .text figure{
  float:right;
  clear:both;
}
#page8 .intro, #page9 .intro {
  padding-top: 228px;
}

#page8 .intro p, #page9 .intro p {
  font-size: 28px;
  font-family: '微软雅黑';
  color: #aa8761;
  line-height: 37px;
}

#page8 .intro .border, #page9 .intro .border {
  border-top: 1px solid #9e672d;
  border-bottom: 1px solid #9e672d;
  padding: 30px 0;
  margin-top: 20px;
  margin-bottom: 20px;
}
#page8 .intro .min hr{  
  margin-top: 20px;
  margin-bottom: 20px;
  color:#9e672d;
}
#page8 .info{
    color: #9e672d;
    height: 50%;
    overflow: hidden;
    position: relative;
}
#page8 .roll{
    position: absolute;
}
#page8 .intro .infobtn, #page9 .intro .infobtn {
  position: absolute;
  width: 282px;
  left: 50%;
  margin-left: -141px;
  bottom: 5%;
}

#page8 .intro .infobtn div, #page9 .intro .infobtn div {
  width: 118px;
  height: 80px;
  cursor: pointer;
}

#page8 .intro .infobtn .up, #page9 .intro .infobtn .up {
  margin-right: 45px;
  background: url(../img/up0.png) no-repeat center;
}

#page8 .intro .infobtn .down, #page9 .intro .infobtn .down {
  background: url(../img/down1.png) no-repeat center;
}
#page9 .min .logo_box{padding-left:10%;}
#page9 .min img{width:350px;height:100px;margin:20px 50px 50px 0}
@-webkit-keyframes twinkling {
  0% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes sectitle0 {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes sectitle0 {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes sec0 {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes sec0 {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@media screen and (max-width: 750px) {
  .music {
    display: none;
  }
  .nav {
    display: none;
  }
  #container {
    display: none;
  }
  #m_container, .section {
    height: 100%;
    position: relative;
  }
  .intro {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .mulu {
    background: url(../img/mulu.png) no-repeat center;
    background-size: cover;
    width: 1.47rem;
    height: 0.6rem;
    position: fixed;
    top: 0.52rem;
    left: 0.47rem;
    z-index: 10;
    cursor: pointer;
  }
  .m_nav {
    width: 4.8rem;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #efefef;
    z-index: 10;
  }
  .shadow {
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    z-index: 20;
    position: fixed;
    display: none;
  }
  .m_music {
    width: 0.69rem;
    height: 0.69rem;
    position: fixed;
    right: 0.53rem;
    top: 1.8rem;
    z-index: 10;
  }
  img {
    width: 100%;
    height: 100%;
  }
  .list {
    display: flex;
    flex-flow: row nowrap;
    height: 0.66rem;
    line-height: 0.66rem;
    border-bottom: 0.01rem solid #d1995f;
  }
  .list .list_nmb {
    width: 0.33rem;
    height: 0.32rem;
    line-height: 0.32rem;
    text-align: center;
    border-radius: 0.01rem;
    background: #d70d19;
    font-family: '黑体';
    font-size: 0.29rem;
    color: #d2a362;
    margin-top: 0.18rem;
    margin-left: 0.45rem;
    margin-right: 0.11rem;
  }
  .list .zi {
    font-family: '微软雅黑';
    font-size: 0.42rem;
    color: #d2a362;
  }
  .list .first {
    background: url(../img/list_f.png) no-repeat center;
    background-size: cover;
  }
  .m_logo {
    width: 4.75rem;
    height: 0.91rem;
    margin-top: 0.68rem;
  }
  #m_page1 {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .m_btn {
    width: 1.18rem;
    height: 1.69rem;
    position: fixed;
    bottom: 1.1rem;
    left: 50%;
    margin-left: -0.59rem;
    -webkit-animation: twinkling 1s infinite ease-in-out;
    z-index: 10;
  }
  .logo1 {
    width: 2.88rem;
    height: 0.31rem;
    position: fixed;
    right: 0.6rem;
    top: 1rem;
    z-index: 10;
  }
  #m_page2, #m_page7 {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
  }
  #m_page2 .intro, #m_page7 .intro {
    position: relative;
  }
  #m_page2 .intro .infobtn, #m_page7 .intro .infobtn {
    position: absolute;
    width: 3.4rem;
    left: 50%;
    margin-left: -1.7rem;
    bottom: 18%;
  }
  #m_page2 .intro .infobtn div, #m_page7 .intro .infobtn div {
    width: 1.18rem;
    height: 0.8rem;
    cursor: pointer;
  }
  #m_page2 .intro .infobtn .up, #m_page7 .intro .infobtn .up {
    margin-right: 0.98rem;
    background: url(../img/up0.png) no-repeat center;
    background-size: cover;
  }
  #m_page2 .intro .infobtn .down, #m_page7 .intro .infobtn .down {
    background: url(../img/down1.png) no-repeat center;
    background-size: cover;
  }
  #m_page2 .bigimg, #m_page7 .bigimg {
    position: relative;
    top: 0;
    left: 0;
  }
  #m_page2 .m_info, #m_page7 .m_info {
    height: 46%;
    position: absolute;
    width: 6.25rem;
    left: 50%;
    margin-left: -3.125rem;
    top: 26%;
    overflow: hidden;
    box-sizing: border-box;
  }
  #m_page2 .m_info .info_img, #m_page7 .m_info .info_img {
    width: 1.53rem;
    height: 2.03rem;
    border: 0.01rem solid #c5c9cc;
  }
  #m_page2 .m_info .introduce, #m_page7 .m_info .introduce {
    font-family: '微软雅黑';
    font-size: 0.22rem;
    line-height: 0.32rem;
    color: #9e672b;
    margin-top: 1.1rem;
    margin-left: 0.2rem;
  }
  #m_page2 .m_info .text, #m_page7 .m_info .text {
    font-family: '微软雅黑';
    font-size: 0.26rem;
    color: #9e672b;
    margin-top: 0.1rem;
    line-height: 0.46rem;
  }
  #m_page2 .m_info .text p, #m_page7 .m_info .text p {
    text-indent: 2em;
  }
  #m_page2 .m_info .roll, #m_page7 .m_info .roll {
    position: absolute;
    width: 6.25rem;
    padding: 0 0.4rem;
    box-sizing: border-box;
  }
   #m_page3 .intro .sroll, #m_page4 .intro .sroll, #m_page5 .intro .sroll, #m_page6 .intro .sroll {
    height: 3.25rem;
    overflow: hidden;
    position: relative;
  }
#m_page3 .intro .infobtn, #m_page4 .intro .infobtn, #m_page5 .intro .infobtn, #m_page6 .intro .infobtn {
    position: absolute;
    width: 3.4rem;
    left: 50%;
    margin-left: -1.7rem;
    bottom: -15%;
}
#m_page3 .intro .infobtn div, #m_page4 .intro .infobtn div, #m_page5 .intro .infobtn div, #m_page6 .intro .infobtn div {
    width: 1.18rem;
    height: 0.8rem;
    cursor: pointer;
  }
  #m_page3 .intro .infobtn .up, #m_page4 .intro .infobtn .up, #m_page5 .intro .infobtn .up, #m_page6 .intro .infobtn .up {
    margin-right: 0.98rem;
    background: url(../img/up0.png) no-repeat center;
    background-size: cover;
  }
  #m_page3 .intro .infobtn .down, #m_page4 .intro .infobtn .down, #m_page5 .intro .infobtn .down, #m_page6 .intro .infobtn .down {
    background: url(../img/down1.png) no-repeat center;
    background-size: cover;
  }
  #m_page3 .intro, #m_page4 .intro, #m_page5 .intro, #m_page6 .intro {
    position: relative;
  }
  #m_page3 .intro .lunbo, #m_page4 .intro .lunbo, #m_page5 .intro .lunbo, #m_page6 .intro .lunbo {
    height: 60%;
    position: absolute;
    width: 6.22rem;
    left: 50%;
    margin-left: -3.125rem;
    top: 26%;
    overflow: hidden;
    box-sizing: border-box;
  }
  #m_page3 .intro .lunbo .lunbo_box, #m_page4 .intro .lunbo .lunbo_box, #m_page5 .intro .lunbo .lunbo_box, #m_page6 .intro .lunbo .lunbo_box {
    position: absolute;
    left: 50%;
    margin-left: -2.59rem;
    display:none;
  }
  #m_page3 .intro .lunbo .m_button, #m_page4 .intro .lunbo .m_button, #m_page5 .intro .lunbo .m_button, #m_page6 .intro .lunbo .m_button {
    display: flex;
    flex-flow: row nowrap;
    height: 2.92rem;
    justify-content: space-between;
    position: absolute;
    width: 100%;
    z-index: 10;
  }
  #m_page3 .intro .lunbo .m_button div, #m_page4 .intro .lunbo .m_button div, #m_page5 .intro .lunbo .m_button div, #m_page6 .intro .lunbo .m_button div {
    width: 0.8rem;
    height: 0.8rem;
    margin-top: 1.1rem;
  }
  #m_page3 .intro .lunbo .lbimg, #m_page4 .intro .lunbo .lbimg, #m_page5 .intro .lunbo .lbimg, #m_page6 .intro .lunbo .lbimg {
    width: auto;
    height: 2.92rem;
    margin: 0 auto;
    text-align:center;
    margin-bottom: 0.36rem;
  }
  #m_page3 .intro .lunbo .lbimg img, #m_page4 .intro .lunbo .lbimg img, #m_page5 .intro .lunbo .lbimg img, #m_page6 .intro .lunbo .lbimg img {
    width: auto;
    height: 2.92rem;
  }
  #m_page3 .intro .lunbo .box_zi, #m_page4 .intro .lunbo .box_zi, #m_page5 .intro .lunbo .box_zi, #m_page6 .intro .lunbo .box_zi {
    width: 5.18rem;
    margin: 0 auto;
  }
  #m_page3 .intro .lunbo .box_zi .text, #m_page4 .intro .lunbo .box_zi .text, #m_page5 .intro .lunbo .box_zi .text, #m_page6 .intro .lunbo .box_zi .text {
    color: #9e672d;
    position: absolute;
  }
  #m_page3 .intro .lunbo .box_zi .text .title, #m_page4 .intro .lunbo .box_zi .text .title, #m_page5 .intro .lunbo .box_zi .text .title, #m_page6 .intro .lunbo .box_zi .text .title {
    font-family: '微软雅黑';
    font-size: 0.26rem;
   /* line-height:0.46rem;
    margin-top: 0.36rem;	*/
    border-bottom: 0.01rem solid #9e672d;
    padding-bottom: 0.22rem;
    box-sizing: border-box;
  }
  #m_page3 .intro .lunbo .box_zi .text .en, #m_page4 .intro .lunbo .box_zi .text .en, #m_page5 .intro .lunbo .box_zi .text .en, #m_page6 .intro .lunbo .box_zi .text .en {
    font-family: 'Myriad Pro';
    font-size: 0.26rem;
    padding: 0.2rem 0;
  }
  #m_page3 .intro .lunbo .box_zi .text .cn, #m_page4 .intro .lunbo .box_zi .text .cn, #m_page5 .intro .lunbo .box_zi .text .cn, #m_page6 .intro .lunbo .box_zi .text .cn {
    font-family: 'Myriad Pro';
    font-size: 0.26rem;
  /*  line-height: 0.46rem;	*/
  }
  #m_page8 .intro {
    position: relative;
  }
  #m_page8 .intro .relevant {
    height: 50%;
    position: absolute;
    width: 6.22rem;
    left: 50%;
    margin-left: -3.125rem;
    top: 22%;
    box-sizing: border-box;
    color: #9e672d;
    font-size: 0.26rem;
    line-height: 0.46rem;
    font-family: '微软雅黑';
    padding: 0 0.65rem;
    overflow: hidden;
  }
  #m_page8 .intro .relevant .border {
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
    padding: 0.3rem 0;
    border-top: 0.01rem solid #9e672d;
    border-bottom: 0.01rem solid #9e672d;
  }
  #m_page8 .intro .relevant hr{
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
    color:#9e672d;
  }
  #m_page8 .intro .sroll_1 {
    position: absolute;
width:80%;
  }
  #m_page8 .intro .infobtn {
    position: absolute;
    width: 3.4rem;
    left: 50%;
    margin-left: -1.7rem;
    bottom: 18%;
  }
  #m_page8 .intro .infobtn div {
    width: 1.18rem;
    height: 0.8rem;
    cursor: pointer;
  }
  #m_page8 .intro .infobtn .up {
    margin-right: 0.98rem;
    background: url(../img/up0.png) no-repeat center;
    background-size: cover;
  }
  #m_page8 .intro .infobtn .down {
    background: url(../img/down1.png) no-repeat center;
    background-size: cover;
  }
  #m_page9 .intro {
    position: relative;
  }
  
  #m_page9 .intro .logobox {
    height: 65%;
    position: absolute;
    width: 6.22rem;
    left: 50%;
    margin-left: -3.125rem;
    top: 22%;
    overflow: hidden;
    padding: 0 0.35rem;
    box-sizing: border-box;
text-align:center;
  }
  
  #m_page9 .intro .logobox p {
    font-size: 0.26rem;
    line-height: 0.46rem;
    font-family: '微软雅黑';
    color: #9e672d;
    text-align:left;
  }
  #m_page9 .intro .logobox .logo_box {
    display: inline-block;
    margin-top: 0.2rem;
    width:5.0rem;
    background: #fff;
    height: auto;
  }
  #m_page9 .intro .logobox .logo_box img {
   width:5.0rem;
  }
  #m_page9 .intro .logobox .logo_box div {
    width: 1.7rem;
/*    height: 0.96rem;	*/
    background: #fff;
  }
  .infobox{
    margin-bottom: 0.3rem;
  }
}
