﻿/* public */
html,body,form,ol,ul,li,div,p,dl,dt,dd,h1,h2,h3,h4,h5,h6,table,th,td,font,em,ins,span,a{margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-size:100%;font-weight:normal}
html{_filter:expression(document.execCommand("BackgroundImageCache",false,true));}
ul,li,div,dl,dt,dd{list-style:none;}
h1.wm-public{height:0px; line-height:0px; font-size:0px;}
a{text-decoration:none;}
a{blr:expression(this.onFocus=this.blur());outline:none;}
a:hover{text-decoration:underline;}
img{border:0;}
font,em{font-style:normal; font-family:\5b8b\4f53;}
label{vertical-align:middle; font-family:tahoma;}
textarea,input{resize:none; outline:none;}
textarea{overflow:auto;}
ins{float:right; text-decoration:none; font-weight:normal;}
.pub_wsp{word-wrap:break-word; word-break:break-all;}
.pub_abso{vertical-align:middle;}
.pub_clr{clear:both;font-size:0;height:0;line-height:0;overflow:hidden;}
.pub_ani{-webkit-transition:0.3s;-moz-transition:0.3s;-ms-transition:0.3s;-o-transition:0.3s;transition:0.3s;}
.pub_yh{font-family:"Microsoft YaHei";}
.none{display:none;}
body{background:none; font-size:24px; font-family: 'Noto Serif', serif;}
/* header */
.header{width: 100%;min-width: 1260px;height: 43px;padding: 6px 0;background: #fff;}
.head{width: 1080px;height: 43px;margin: 0 auto;}
.news_head{width: 800px;padding-left: 0;}
.icon_logo{width: 50px;height: 43px;float: left;background:url(../../../../web201611/images/main/icon_logo.png) center center no-repeat;}
.news_head .icon_logo{margin-right: 0;}
.head_txt{width: 77px;height: 43px;margin-right: 60px; float: left;background:url(../../../../web201611/images/main/headtxt.html) center center no-repeat;}
.head_menu{margin-right: 45px;padding-top: 12px;float: left;}
.news_head .head_menu{margin-right: 15px;}
.head_menu li{width: 117px;height: 20px;float: left;font-size: 18px;line-height: 20px;text-align: center;border-left: 1px solid #a83b3b; cursor: pointer;}
.head_menu li a{width: 117px;height: 20px;display: block;font-size: 18px;line-height: 20px;text-align: center;color: #a83b3b;}
.head_menu li.fir{border: 0;}
.head_menu li.on a,
.head_menu li:hover a{color: #a68763;}
.head_wx{width: 102px;height: 35px;padding: 4px 0 4px 50px;float: left;position: relative;background:url(../../../../web201611/images/cover1701/wx_head.png) 5px center no-repeat;}
.head_wx p{line-height: 17px;font-size: 14px;color: #a83b3b;}
.wx_hover{display: none;width: 134px;height: 184px;padding: 0 9px;position: absolute;top: 48px;left: 0;background: #fff;z-index: 99;}
.head_wx:hover .wx_hover{display: block;}
.qrcode_wx{width: 134px;height: 133px;margin-bottom: 8px;background:url(../../../../web201611/images/main/qrcode_wx.jpg) center center no-repeat;background-size: 100%;}
.wx_hover p{padding-left: 14px;color: #585858;font-size: 14px;}
.wx_hover p.color{color: #bd465a;}

#content{background: url(../images/bg.jpg) no-repeat center 0 / cover; height: 960px; position: relative; width: 100%; overflow: hidden;}
#content:before{
  width:100%;
  height:150px;
  position: absolute;
  bottom:0;
  left:0;right:0;
  content:"";
  z-index: 3;
  background: url(../images/line.png) repeat-x top center;
  -webkit-animation: wave-animation1 75s infinite linear; /* Safari 4+ */
  -moz-animation:    wave-animation1 75s infinite linear; /* Fx 5+ */
  -o-animation:      wave-animation1 75s infinite linear; /* Opera 12+ */
  animation:         wave-animation1 75s infinite linear; /* IE 10+ */
}

@-webkit-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@-moz-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@-o-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% {background-position: 1601px 0;}
}

#content:after{
  width:100%;
  height:170px;
  position: absolute;
  bottom:170px;
  left:0;right:0;
  content:"";
  z-index: 2;
  background: url(../images/lua.png) repeat-x top center / 100%;
}
.logoImg{display: block; position: absolute; left: 150px; top: 10px;}
.mImg{display: block; width:100%; height: 877px; background: url(../images/nv1.png) no-repeat 0 0; z-index: 2; position: absolute; left:-6%; top: 0; filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}
.wImg{display: block; width:100%; height: 877px; background: url(../images/nv2.png) no-repeat right 0; z-index: 2; position: absolute; right:-6%; top: 0; filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}

.main{width: 1200px; height: 960px; position: absolute; left: calc(50% - 600px); top: 0; z-index:10;}
.yuan{width: 920px;height: 920px;position: absolute;left: 175px;top: 20px;}
.yuan img{display: block; width: 100%;}

.showBox{width: 596px; height: 387px;}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}

.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

.btnBox a:hover{
    -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: tada;
  animation-name: tada;
}
.btnBox{width: 1100px;display: flex;justify-content: center;position: relative;z-index: 20;margin: 0 auto;}
.btnBox a{
 margin: 0 -40px;/*
 transition: all .4s linear;*/
}
.btnBox a:hover{
/* margin: -15px -40px 0;*/
/* transition: all .4s linear;*/
 }
.btnBox img{display: block; width: 216px; filter:alpha(opacity=0);-moz-opacity:0; opacity:0; cursor: pointer;}
.slogan{
  text-align: center;
}

.slgImg{display: block;
  margin:0 auto;
  -webkit-transform: translate(0,-10px); -webkit-transition: all .4s ease-in-out 1.1s;
  -moz-transform: translate(0,-10px); -moz-transition: all .4s ease-in-out 1.1s;
  -ms-transform: translate(0,-10px); -ms-transition: all .4s ease-in-out 1.1s;
  -o-transform: translate(0,-10px); -o-transition: all .4s ease-in-out 1.1s;
  transform: translate(0,-10px); transition: all .4s ease-in-out 1.1s;
 filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}

.perBox{background: url(../images/p2.png) no-repeat center 0; width: 100%; height: 960px; position: absolute; left: 0; top: 0; filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.first{filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}

.popBg{position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 998;  background: #000; filter:alpha(opacity=80);-moz-opacity:0.8; opacity:0.8; display: none;}
.popBox{background: url(../images/bg-popup.png) no-repeat 0 0;width: 860px;height: 659px;position: fixed;left: calc(50% - 430px);top: calc(50% - 330px);z-index: 999;display: none;}
.closeBtn{display: block; cursor: pointer; width: 57px; height: 58px; position: absolute; right: -75px; top:21px; background: url(../images/close.png) no-repeat 0 0;}
.prev{display: block; width: 77px; height: 77px; background:url(../images/left.png) no-repeat 0 0; position: absolute; left: -104px; top: 50%; margin-top: -38px; cursor: pointer;}
.next{display: block; width: 77px; height: 77px; background:url(../images/right.png) no-repeat 0 0; position: absolute; right: -104px; top: 50%; margin-top: -38px; cursor: pointer;}
.popBox .bd{width: 470px;height: 350px;position: absolute;    left: calc(50% - 240px);
    top: calc(50% - 170px);overflow: hidden;}
.popBox .bd li{float: left; width:930px; height: 550px;}
.titleBox{height:62px; text-align: center; line-height: 62px; font-size: 24px; color: #d7b462; font-weight: normal; margin-bottom: 28px;}
.titleBox span.s1{display: inline-block; height: 62px; background: url(../images/s1.png) no-repeat left center; padding-left: 125px;}
.titleBox span.s2{display: inline-block; height: 62px; background: url(../images/s2.png) no-repeat right center; padding-right: 125px;}
.listScroll{width: 930px; height: 462px; overflow: hidden; overflow-y: scroll;}
.listShow{line-height: 24px; color: #938378; font-size: 16px; width: 898px;}
.listShow h3,.listShow p{padding-bottom: 10px;}

.listImg{overflow: hidden; padding-bottom: 20px; width:930px; overflow: hidden; padding: 16px 0;}
.listImg dl{width:960px;}
.listImg dt{float: left; width: 284px; margin-right: 20px;}
.listImg img{display: block;}


.listScroll::-webkit-scrollbar{width:10px;height:10px;background-color:rgba(0,0,0,0);}
.listScroll::-webkit-scrollbar-track{background-color:none;}
.listScroll::-webkit-scrollbar-thumb{border-radius:0px;background-color:#f91e3f;} 
.listScroll::-webkit-scrollbar-thumb:hover{background-color:rgba(143,143,148,1);}
.listScroll::-webkit-scrollbar-thumb:active{background-color:rgba(106,106,112,1);}
.listScroll::-webkit-scrollbar-track-piece{margin:0;}




.moveleft{-webkit-transform: translate3d(-100%,0,0);-moz-transform: translate3d(-100%,0,0);-ms-transform: translate3d(-100%,0,0);-o-transform: translate3d(-100%,0,0);transform: translate3d(-100%,0,0); filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.moveright{-webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.moveup{-webkit-transform: translate3d(0,-100%,0);-moz-transform: translate3d(0,-100%,0);-ms-transform: translate3d(0,-100%,0);-o-transform: translate3d(0,-100%,0);transform: translate3d(0,-100%,0); filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.movedown{-webkit-transform: translate3d(0,100%,0);-moz-transform: translate3d(0,100%,0);-ms-transform: translate3d(0,100%,0);-o-transform: translate3d(0,100%,0);transform: translate3d(0,100%,0); filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}

.moveyuan{
  -webkit-animation: moveyuan 15s linear infinite;
  -moz-animation: moveyuan 15s linear infinite;
  -o-animation: moveyuan 15s linear infinite;
  -ms-animation: moveyuan 15s linear infinite;
  animation: moveyuan 15s linear infinite;
}
.moveyuan2{
  -webkit-animation: moveyuan2 5s linear infinite;
  -moz-animation: moveyuan2 5s linear infinite;
  -o-animation: moveyuan2 5s linear infinite;
  -ms-animation: moveyuan2 5s linear infinite;
  animation: moveyuan2 5s linear infinite;
}
@-webkit-keyframes moveyuan{
  0%{-webkit-transform: rotate(0deg);}
  100%{-webkit-transform: rotate(-360deg);}
}
@-moz-keyframes moveyuan{
  0%{-moz-transform: rotate(0deg);}
  100%{-moz-transform: rotate(-360deg);}
}
@-ms-keyframes moveyuan{
  0%{-ms-transform: rotate(0deg);}
  100%{-ms-transform: rotate(-360deg);}
}
@-o-keyframes moveyuan{
  0%{-o-transform: rotate(0deg);}
  100%{-o-transform: rotate(-360deg);}
}
@keyframes moveyuan{
  0%{transform: rotate(0deg);}
  100%{transform: rotate(-360deg);}
}

@-webkit-keyframes moveyuan2{
  0%{-webkit-transform: rotate(0deg);}
  100%{-webkit-transform: rotate(360deg);}
}
@-moz-keyframes moveyuan2{
  0%{-moz-transform: rotate(0deg);}
  100%{-moz-transform: rotate(360deg);}
}
@-ms-keyframes moveyuan2{
  0%{-ms-transform: rotate(0deg);}
  100%{-ms-transform: rotate(360deg);}
}
@-o-keyframes moveyuan2{
  0%{-o-transform: rotate(0deg);}
  100%{-o-transform: rotate(360deg);}
}
@keyframes moveyuan2{
  0%{transform: rotate(0deg);}
  100%{transform: rotate(360deg);}
}

.listLink{text-align: center; height: 36px; padding-top: 20px;}
.check_btn{
    display:inline-block;
    width: 100px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    background: #e83962;
    color: #fff;
    font-size: 16px;
    margin: 0 15px;
}

.mCS_img_loaded{
  
    display: block;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
  width:800px;}
.bd .content {
  padding:0 30px 0 60px;
}
.bd .content .nhiemvu {
  color: #fff;
  margin-bottom: 30px;
  font-style: italic;
  font-size: 16px;
}
.bd .content .phanthuong {
  color: #fff;

}
.floatBox {
    position: fixed;
    top: 0;
    right: 0;
    width: 190px;
    height: 770px;
    overflow: hidden;
    /* background: url(../images/floatBoxBg.png); */
    z-index:  99;
}
.floatBox .publicBtn {
    position: absolute;
    left: 7px;
    top: 50%;
    margin-top: -78px;
    width: 29px;
    height: 165px;
    background: url(../images/floatBtn.png) -31px 0 no-repeat;
    cursor: pointer;
}
.floatBox .linksBox {
    position: absolute;
    left: 30px;
    top: 0;
    width: 160px;
    height: 770px;
    padding-top: 190px;
    width: 160px;
    height: 770px;
    /* overflow: hidden; */
    background: url(../images/floatBoxBg.png)no-repeat top center;
}
.floatBox .linksBox a {
    line-height: 100%;
    display: inline-block;
    /* margin: 0 10px 7px; */
    text-align: center;
}

.floatBox img {
    line-height: 100%;
    display: inline-block;
    margin: 0 10px 7px;
    text-align: center;
    transition: all 1s ease;
}
.floatBox img:hover {
  filter: brightness(1.3);
}
.floatBox .qrcode {
  margin-left: 30px;
}
@media (min-width: 1024px) and (max-width: 1400px) {
  .floatBox {
    top: -100px;
  }
}


.top-head{
  text-align:center;
  display: flex;
  justify-content: center;
  max-width: 800px;
  margin:0 auto;
}
.top-head > a{
width:33.333%;
}
.top-head .logo{
  margin-top:40px;
}

footer{
      background: #171717;
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 13px;
    padding:0 15px;
}
footer .container{
  width:1200px;
  margin: 0 auto;
}
footer .site-info {
    position: relative;
    padding: 20px 0;
    border: none;
    overflow: inherit;
    text-align: center;
}
footer .site-info .clients {
    vertical-align: middle;
    width: 15%;
    margin-right: 0;
    margin-bottom: 0!important;
    text-align: center!important;
    display: inline-block;
}
footer .site-info .clients a {
    display: inline-block;
    padding: 0!important;
    margin: 10px 0;
}
.img-fluid {
    max-width: 100%;
    display: inline-block;
    height: auto;
}
footer .site-info .copyright {
    vertical-align: middle;
    text-align: center!important;
    width: calc(70% - 30px);
    display: inline-block;
    padding:0 15px;
}
footer .site-info .copyright a {
    color: #62875e;
    text-decoration: none;
}
footer .site-info .logo18 {
    vertical-align: middle;
    display: inline-block;
    width: 14%;
    text-align: center;
}

@media(max-width: 1400px){
  #content{
    height:710px;
  }
  .slogan{
    width: 450px;
    margin:0 auto;
  }
  .wImg{
    right: -14%;
  }
  .mImg{
    left: -14%;
  }
  .btn-thele{
    width:100px;
  }
  .top-head .logo{
    margin-top:20px;
    width: 180px;
  }
  #content:before{
    height: 68px;
    background-size: 900px;
  }
  #content:after{
    bottom:80px;
  }
  .btnBox{
    width:860px;
    margin-top:-30px;
  }
  .btnBox img{
    max-width: 100%;
    display: block;
  }
}

@media(max-width: 1100px){
  .main{
    width:100%;
    left:auto;
  }
  footer .container{
    width:100%;
  }
  .mImg{
    left: -14%;
    background-size: 100%;
    width: 47%;
  }
  .wImg{
    right: -24%;
    background-size: 100%;
    width: 57%;
  }
}

@media(max-width: 800px){
  .nv{
    display: none;
  }
  .slogan{
    margin-top:10%;
  }
  #content{
    background: url(../images/bg-mob.jpg) no-repeat top center / 100%, #941c11;
    height:auto;
  }
  .btnBox{
    width:700px;
    margin-top:10%;
    margin-bottom: 15%;
  }
  .slogan{
    width:50%;
  }
  .main{
    position: relative;
    height:auto;
  }
}

@media(max-width: 576px){
  .btn-thele{
    width:60px;
  }
  .top-head .logo{
    width:130px;
    margin-top:10px;
  }
  .slogan{
    width:65%;
  }
  .btnBox{
    width:100%;
    flex-wrap:wrap;
    margin-bottom: 20%;
  }
  .btnBox a{
    width:33.3333%;
    margin:-15px -20px;
  }
  #content:before {
    height: 48px;
    background-size: 650px;
  }
  footer .site-info .clients{
    width:100%;
  }
  footer .site-info .clients a{
    width:40%;
  }
  footer .site-info .copyright{
    width:100%;
    padding:0;
  }
  footer .site-info .logo18{
    width:100%;
    margin-top:15px;
  }
  footer .site-info .logo18 img{
    width:100px;
  }
  .popBox{
    transform: scale(.6);
  }
  .closeBtn{
    right:150px;
    top:-40px;
    width:45px;
    background-size: 100%;
  }
}
@media(max-width: 360px){
  .popBox{
    transform: scale(.55);
  }
}