@charset "UTF-8";
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, img{
  border:medium none;
  margin: 0;
  padding: 0;
  font-size: 100%;
}
body,button, input, select, textarea{
  font-size: 14px;
  line-height: 1.5;
  color: #2c2c2c;
  font-family: "宋体","PingFang SC Regular",Helvetica,Tahoma,Arial,Microsoft YaHei,Hiragino Sans GB,WenQuanYi Micro Hei,sans-serif;
}
h1, h2, h3, h4, h5, h6{
  font-weight: normal;
  line-height:1.5;
}
input,button,img{
  border: none;
  background: none;
}
input[type="text"],
input[type="password"],button{
  outline: none;
  -webkit-appearance:none;
}
em,i{
  font-style:normal;
}
ul, ol{
  list-style: none;
}
a{
  text-decoration: none;
  color:#333;
}
a,a:hover,a:active,a:visited,a:link,a:focus{
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  -webkit-tap-highlight-color: transparent;
  outline:none;
  text-decoration: none;
}
img{
  border:0px;
  outline-width:0px;
  vertical-align:top;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before, .clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}
.clearfix:after {
  clear: both;
}
.fl {
  float:left;
}
.fr {
  float:right;
}
.hide {
  display:none !important;
}
.show {
  display: block !important;
}
@font-face {
  font-family: TimesNewRoman;
  src: url('//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgMmEB4PVAAAAAIwwD30377.ttf'), url('//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgNyEPW5YAAAAANZMed4877.eot');
}
@font-face {
  font-family: HelveticaBold;
  src: url('//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgNOEDc1WAAAAAA303Q4784.ttf'), url('//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgOSEeuTEAAAAABpNIQ8780.eot');
}
* {
  box-sizing: border-box;
}
html,
body {
  height: 100%;
  overflow: hidden;
}
.full-height {
  height: 100%;
}
.filter-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1005;
  background: rgba(0, 0, 0, .7);
  display: none;
}
.header {
  height: 80px;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: #fff;
  font-family: TimesNewRoman, "Microsoft Yahei";
}
.header .hd-bar {
  position: absolute;
  height: 30px;
  left: 3%;
  top: 50%;
  margin-top: -15px;
}
.header .hd-bar .type-btn {
  width: 30px;
  height: 30px;
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgSSEZyn1AAAAABrX2mA502.png);
  background-size: 100% 100%;
  margin-right: 40px;
  transition: .4s;
}
.header .hd-bar .type-btn:hover {
  transform: translateY(-5px);
  transition: .4s;
}
.header .hd-bar .lang h3 {
  line-height: 30px;
}
.header .hd-bar .lang h3 a {
  transition: .4s;
}
.header .hd-bar .lang h3 a:hover {
  color: #a58f65;
  transition: .4s;
}
.header .hd-logo {
  display: block;
  width: 154px;
  margin: 0 auto;
  height: 100%;
  line-height: 80px;
}
.header .hd-logo img {
  vertical-align: middle;
  transition: .4s;
  max-width: 100%;
}
.header .hd-logo:hover img {
  transition: .4s;
  transform: translateY(-5px);
}
.header .menu-btn {
  display: block;
  height: 40px;
  position: absolute;
  right: 3%;
  top: 50%;
  margin-top: -20px;
}
.header .menu-btn em {
  float: left;
  line-height: 40px;
  margin-right: 20px;
}
.header .menu-btn:hover em {
  color: #a58f65;
  transition: .4s;
}
.header .menu-btn span {
  float: left;
  width: 40px;
  height: 40px;
  transition: .4s;
  position: relative;
}
.header .menu-btn span::before,
.header .menu-btn span::after {
  display: block;
  content: '';
  width: 100%;
  height: 2px;
  background: #2c2c2c;
  transition: .4s;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -1px;
}
.header .menu-btn span::before {
  transform: translateY(-2px);
}
.header .menu-btn span::after {
  transform: translateY(2px);
}
.header .menu-btn:hover span::before,
.header .menu-btn:hover span::after {
  transition: .4s;
  background: #a58f65;
  transform: translateY(0);
}
.header .menu-btn.menuon span::before {
  transform: rotate(-45deg) translateY(0);
}
.header .menu-btn.menuon span::after {
  transform: rotate(45deg) translateY(0);
}
.footer {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  padding: 12px 3% 18px;
  z-index: 15;
}
.footer .copyright {
  line-height: 24px;
  color: #888;
}
.footer .shares {
  height: 24px;
}
.footer .shares .share-item {
  float: left;
  margin: 0 5px;
}
.footer .shares .share-item a {
  display: block;
  width: 24px;
  height: 24px;
  transition: .4s;
}
.footer .shares .share-item a:hover {
  transition: .4s;
}
.footer .shares .share-item .tmail {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgTWEJbJ4AAAAAIwCvmw639.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .tmail:hover {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgXGEaOR-AAAAAHDUCkQ047.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .jd {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgZCEC3hGAAAAAMSrIGo963.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .jd:hover {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgYaEZKk7AAAAAOyrW6A996.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .wechat {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgZmEMWpNAAAAAP5NCvw987.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .wechat:hover {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgdeEGGnbAAAAAPmJq0I913.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .sina {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgc2Ef0HaAAAAANw4Xnc714.png);
  background-size: 100% 100%;
}
.footer .shares .share-item .sina:hover {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrggCEMoEmAAAAAI2Lxms290.png);
  background-size: 100% 100%;
}
.footer .shares .erweima {
  position: relative;
}
.footer .shares .erweima-box {
  position: absolute;
  width: 100px;
  height: 100px;
  top: -110px;
  left: 50%;
  margin-left: -50px;
  box-shadow: 0 0 5px rgba(0, 0, 0, .1);
  transform: translateY(-10px);
  opacity: 0;
  transition: .4s;
  display: none;
}
.footer .shares .erweima-box.erweima-show {
  transition: .4s;
  opacity: 1;
  transform: translateY(0);
}
.footer .shares .erweima-box img {
  width: 100%;
}
.menubox {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 991;
  background: rgba(0, 0, 0, .9);
  display: none;
}
.menubox ul {
  width: 540px;
  height: 540px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -230px 0 0 -270px;
}
.menubox ul li {
  float: left;
  width: 180px;
  height: 180px;
  padding: 8px;
}
.menubox ul li a {
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(255, 255, 255, .8);
  position: relative;
  transition: .4s;
  overflow: hidden;
}
.menubox ul li .icon {
  display: table-cell;
  width: 162px;
  height: 162px;
  text-align: center;
  vertical-align: middle;
  transition: .4s;
}
.menubox ul li .text {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding-top: 46px;
  opacity: 0;
  transition: .4s;
  top: 100%;
}
.menubox ul li .text h4 {
  font-size: 20px;
  line-height: 36px;
  text-align: center;
  color: #fff;
}
.menubox ul li .text h5 {
  width: 80px;
  margin: 10px auto 0;
  background: #86651c;
  text-align: center;
  line-height: 24px;
  font-size: 12px;
  color: #fff;
}
.menubox ul li a:hover {
  background: rgba(134, 101, 28, .5);
  border-color: rgba(134, 101, 28, .5);
  transition: .4s;
}
.menubox ul li a:hover .icon {
  opacity: 0;
  transition: .4s;
  transform: translateY(-100%);
}
.menubox ul li a:hover .text {
  opacity: 1;
  transition: .4s;
  transform: translateY(-100%);
}
.navbox {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 991;
  background: rgba(0, 0, 0, .9);
  margin-top: 40px;
  display: none;
}
.navbox .bg-img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.navbox .bg-img img {
  width: 100%;
  height: 100%;
}
.navbox .nav-wrapper {
  position: absolute;
  width: 90%;
  left: 5%;
  top: 44%;
  height: 280px;
  margin-top: -120px;
  z-index: 3;
}
.navbox ul {
  height: 100%;
}
.navbox ul li {
  float: left;
  width: 25%;
  padding: 76px 0;
  position: relative;
  height: 280px;
}
.navbox ul li::before {
  display: block;
  content: '';
  width: 1px;
  height: 280px;
  position: absolute;
  top: 50%;
  margin-top: -120px;
  background: rgba(129, 103, 43, .5);
}
.navbox ul li:first-child::before {
  display: none;
}
.navbox ul li a {
  display: block;
  text-align: center;
  color: #fff;
}
.navbox ul li span {
  letter-spacing: 3px;
}
.navbox ul li h4 {
  display: block;
  font-size: 20px;
}
.navbox ul li h5 {
  font-size: 12px;
  color: #81672b;
  font-family: TimesNewRoman, "Microsoft Yahei";
}
.navbox ul li .sub-nav {
  padding: 30px 0;
  opacity: 0;
  visibility: hidden;
  transition: .4s;
  transform: translate3d(0, 30%, 0);
}
.navbox ul li .sub-nav a {
  display: block;
  font-size: 16px;
  line-height: 52px;
  transition: .4s;
}
.navbox ul li .sub-nav a:hover {
  color: #c5b07b;
  transition: .4s;
}
.navbox ul li:hover .sub-nav {
  opacity: 1;
  visibility: visible;
  transition: .8s;
  transform: translate3d(0, 0, 0);
}
.navbox ul li .nav-item {
  transition: .4s;
}
.navbox ul li:hover .nav-item {
  transform: translate3d(0, -32%, 0);
  transition: .6s;
}


.navbox .menu-search{margin: 3% auto 0;padding: 3% 0;position: relative;z-index: 11;background: rgba(0,0,0,0);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.navbox .menu-search input{display: block;width: 220px;height: 26px;border: 1px solid #81672b;padding: 0 15px;line-height: 24px;color: #bda46b;margin-right: 10px;}
.navbox .menu-search input::placeholder{color: #bda46b;}
.navbox .explore-btn{display: block;width: 116px;height: 26px;line-height: 24px;border: 1px solid #81672b;text-align: center;color: #81672b;transition: .4s;position: relative;z-index: 15;}
.navbox .explore-btn:hover{background: #81672b;color: #fff;transition: .4s;} 

/*#fp-nav ul li {
  width: 20px;
  height: 20px;
  margin: 20px 0;
}
#fp-nav ul li a {
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
}

#fp-nav ul li .fp-tooltip {
  color: #b7a584;
  line-height: 20px;
  top: 0;
  font-size: 16px;
}
#fp-nav ul li .fp-tooltip.fp-right {
  right: 30px;
}*/
@media screen and (min-width: 2000px) {
  .header {
    height: 108px;
  }
  .header .hd-logo {
    line-height: 108px;
  }
  .footer {
    padding: 20px 3% 30px;
  }
}
@media screen and (max-width: 1440px) {
  .header {
    height: 64px;
  }
  .header .hd-logo {
    line-height: 64px;
    width: 136px;
  }
  .footer {
    position: fixed;
    width: 100%;
    left: 0;
    padding: 10px 3% 14px;
  }
  .menubox ul {
    width: 450px;
    height: 450px;
    margin: -215px 0 0 -225px;
  }
  .menubox ul li {
    width: 150px;
    height: 150px;
    padding: 6px;
  }
  .menubox ul li .icon {
    width: 136px;
    height: 136px;
  }
  .menubox ul li .icon img {
    width: 44px;
  }
  .menubox ul li .text {
    padding-top: 38px;
  }
  .menubox ul li .text h4 {
    font-size: 18px;
    line-height: 30px;
  }
  .menubox ul li .text h5 {
    margin: 6px auto 0;
  }
}
@media screen and (max-width: 1366px) {
  .header {
    height: 56px;
  }
  .header .hd-logo {
    line-height: 56px;
    width: 120px;
  }
  .footer {
    position: fixed;
    width: 100%;
    left: 0;
    padding: 10px 3%;
  }
}
@media screen and (max-width: 768px) {
  .header {
    height: 50px;
  }
  .header .hd-logo {
    line-height: 50px;
    width: 100px;
  }
  .header .hd-bar {
    height: 24px;
    margin-top: -12px;
  }
  .header .hd-bar .type-btn {
    width: 24px;
    height: 24px;
    margin-right: 15px;
  }
  .header .hd-bar .lang h3 {
    line-height: 24px;
    font-size: 12px;
  }
  .header .menu-btn {
    height: 28px;
    margin-top: -14px;
  }
  .header .menu-btn em {
    font-size: 12px;
    margin-right: 10px;
    line-height: 28px;
  }
  .header .menu-btn span {
    width: 28px;
    height: 28px;
  }
  /* .footer{display: flex;justify-content: space-between;align-items: center;padding: 5px 3%;} */
  .footer .copyright {
    font-size: 12px;
    line-height: 18px;
    display: none;
  }
  /* .footer .shares{display: flex;flex-shrink: 0;}
  .footer .shares .share-item{margin: 0 3px;}
  .footer .shares .share-item a{width: 20px;height: 20px;} */
  #fp-nav.fp-right {
    display: none;
  }
  .menubox ul {
    width: 300px;
    height: 300px;
    margin: -150px 0 0 -150px;
  }
  .menubox ul li {
    width: 100px;
    height: 100px;
    padding: 4px;
  }
  .menubox ul li .icon {
    width: 90px;
    height: 90px;
  }
  .menubox ul li .icon img {
    width: 40px;
  }
  .menubox ul li .text {
    padding-top: 20px;
  }
  .menubox ul li .text h4 {
    font-size: 14px;
    line-height: 24px;
  }
  .menubox ul li .text h5 {
    margin: 4px auto 0;
    width: 72px;
    line-height: 22px;
  }
  .navbox .bg-img {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  .navbox .bg-img img {
    width: auto;
    height: 100%;
  }
  .navbox .nav-wrapper {
    position: absolute;
    width: 100%;
    left: 0;
    top: 44%;
    height: 280px;
    margin-top: -120px;
    z-index: 3;
  }
  .navbox ul li {
    padding: 12px 0 0;
    height: 280px;
  }
  .navbox ul li::before {
    display: block;
    content: '';
    width: 1px;
    height: 220px;
    position: absolute;
    top: 50%;
    margin-top: -120px;
    background: rgba(129, 103, 43, .5);
  }
  .navbox ul li:first-child::before {
    display: none;
  }
  .navbox ul li a {
    display: block;
    text-align: center;
    color: #fff;
  }
  .navbox ul li span {
    letter-spacing: 3px;
  }
  .navbox ul li h4 {
    font-size: 14px;
  }
  .navbox ul li h5 {
    font-size: 10px;
    color: #81672b;
    font-family: TimesNewRoman, "Microsoft Yahei";
  }
  .navbox ul li .sub-nav {
    padding: 20px 0;
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  .navbox ul li .sub-nav a {
    font-size: 14px;
    line-height: 36px;
  }
  .navbox ul li:hover .nav-item {
    transform: translate3d(0, -0, 0);
  }
}
/* ==========================================================================
首页样式
============================================================================ */
/* ==========================================================================
内页样式
============================================================================ */
.section-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.section-bg img {
  width: 100%;
  height: 100%;
}
.section-cont {
  position: relative;
  z-index: 3;
}
.public-top {
  padding: 80px 0 54px;
}
/* 关于品牌
============================================================================ */
.brand-page h1 {
  font-size: 64px;
  line-height: 100px;
  font-weight: lighter;
}
.brand-page h1 span {
  display: inline-block;
  vertical-align: top;
}
.brand-page p {
  line-height: 28px;
  margin-bottom: 24px;
}
.brand-page h2 {
  font-size: 64px;
  line-height: 96px;
  color: #a58f65;
  font-style: italic;
}
.brand-page h2 small {
  font-size: 40px;
  color: #6a6a6a;
}
.brand-sec1 .section-bg {
  width: 44.6%;
  overflow: hidden;
}
.brand-sec1 .section-bg img {
  transform: scale(1.5);
}
.animation-action.brand-sec1 .section-bg img {
  transform: scale(1);
  transition: 10s cubic-bezier(.59, .5, .41, .92);
}
.brand-history {
  width: 75%;
  margin: 0 auto;
}
.brand-history .img {
  width: 50%;
  overflow: hidden;
}
.brand-history .img img {
  width: 100%;
}
.brand-history .text {
  width: 44%;
}
.brand-idea .text {
  width: 444px;
  margin-right: 4.5%;
  margin-top: -1.4%;
}
.brand-idea .img {
  width: calc(85.6% - 444px);
  height: 640px;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.brand-idea .img img {
  min-width: 100%;
  min-height: 100%;
}
.brand-sec3 .block {
  width: 230px;
  height: 427px;
  background: #ececec;
  position: absolute;
  bottom: 0;
  right: 9.8%;
}
.brand-esthetics {
  width: 80.4%;
  margin: 0 auto;
}
.brand-esthetics .img {
  width: 34.6%;
}
.brand-esthetics .img img {
  width: 100%;
}
.brand-esthetics .text {
  width: 60.4%;
  padding-right: 8.4%;
  position: relative;
  z-index: 3;
}
.brand-esthetics .text p {
  margin-bottom: 10px;
}
.brand-esthetics .text h1 {
  line-height: 1;
  margin-bottom: 20px;
}
.brand-esthetics .img-group div {
  width: 45.5%;
}
.brand-esthetics .img-group img {
  width: 100%;
}
.brand-innovate {
  width: 81.6%;
  margin: 0 auto;
  position: relative;
}
.brand-innovate .img1 {
  width: 32.5%;
}
.brand-innovate .img1 img {
  width: 100%;
}
.brand-innovate .img2 {
  width: 31.2%;
  position: absolute;
  left: 38.3%;
  ;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.brand-innovate .img2 img {
  width: 100%;
}
.brand-innovate .img2 .img-inner {
  position: relative;
}
.brand-innovate .img2 .img-inner::after {
  display: block;
  content: '';
  width: 100%;
  height: 24px;
  background: #e7e7e7;
  position: absolute;
  left: 0;
  bottom: -64px;
}
.brand-innovate .text {
  width: 23.3%;
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.brand-sec5 .section-bg {
  width: 44.8%;
  left: auto;
  right: 0;
  overflow: hidden;
}
.brand-sec5 .section-bg img {
  transform: scale(1.5);
}
.animation-action.brand-sec5 .section-bg img {
  transform: scale(1);
  transition: 10s cubic-bezier(.59, .5, .41, .92);
}
.brand-future {
  width: 80.2%;
  margin: 0 auto;
  position: relative;
}
.brand-future .text {
  width: 40.2%;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.brand-future .img {
  width: 46.8%;
  margin-right: 7.2%;
}
.brand-future .img img {
  width: 100%;
}
.video-player {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #000;
  overflow: hidden;
}
.video-player video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  outline: none;
}
.video-close {
  width: 40px;
  height: 40px;
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgh6EJ4r0AAAAADfTg8M162.png);
  background-size: 100% 100%;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 15;
  transition: .4s;
  cursor: pointer;
}
.video-close:hover {
  transition: .4s;
  transform: rotate(180deg);
}
@media screen and (min-width: 2000px) {
  .public-top {
    padding: 108px 0 74px;
  }
}
@media screen and (max-width: 1440px) {
  .public-top {
    padding: 64px 0 48px;
  }
  .brand-page h1 {
    font-size: 50px;
    line-height: 80px;
  }
  .brand-page p {
    line-height: 22px;
    margin-bottom: 14px;
  }
  .brand-page h2 {
    font-size: 50px;
    line-height: 72px;
  }
  .brand-page h2 small {
    font-size: 32px;
  }
  .brand-idea .text .text-img {
    height: 340px;
    overflow: hidden;
  }
  .brand-idea .img {
    height: 560px;
  }
  .brand-sec3 .block {
    width: 200px;
    height: 360px;
  }
  .brand-innovate .img2 .img-inner::after {
    height: 18px;
    bottom: -48px;
  }
}
@media screen and (max-width: 1366px) {
  .public-top {
    padding: 56px 0 44px;
  }
  .brand-page h1 {
    font-size: 40px;
    line-height: 64px;
  }
  .brand-page p {
    margin-bottom: 8px;
    line-height: 20px;
  }
  .brand-page h2 {
    font-size: 40px;
    line-height: 60px;
  }
  .brand-page h2 small {
    font-size: 26px;
  }
  .brand-esthetics .img {
    width: 32%;
  }
  .brand-esthetics .img-group div {
    width: 43%;
  }
  .brand-idea .text .text-img {
    height: 280px;
  }
  .brand-idea .img {
    height: 500px;
  }
  .brand-sec3 .block {
    width: 172px;
    height: 220px;
  }
  .brand-innovate .img2 .img-inner::after {
    height: 18px;
    bottom: -48px;
  }
}
@media screen and (max-width: 768px) {
  .public-top {
    padding: 50px 0 44px;
  }
  .brand-page h1 {
    font-size: 22px;
    line-height: 32px;
    margin-bottom: 12px;
  }
  .brand-page p {
    font-size: 12px;
  }
  .brand-page h2 {
    font-size: 22px;
    line-height: 32px;
  }
  .brand-page h2 small {
    font-size: 16px;
  }
  .brand-sec1 .section-bg {
    width: 100%;
  }
  .brand-history {
    width: 90%;
  }
  .brand-history .img {
    display: none;
  }
  .brand-history .text {
    width: 100%;
  }
  .brand-history .text p {
    line-height: 18px;
  }
  .brand-idea .img {
    display: none;
  }
  .brand-idea .text {
    width: 90%;
    margin: 0 auto;
    float: none;
  }
  .brand-esthetics .img {
    display: none;
  }
  .brand-esthetics {
    width: 90%;
  }
  .brand-esthetics .text {
    float: none;
    width: 100%;
    margin: 0;
    padding-right: 0;
  }
  .brand-esthetics .text h1 {
    margin-bottom: 12px;
  }
  .brand-esthetics .img-group {
    margin-top: 10px;
  }
  .brand-esthetics .img-group div {
    width: 46%;
  }
  .brand-sec3 .block {
    width: 120px;
    height: 80px;
    right: 0;
    bottom: 20%;
  }
  .brand-innovate {
    width: 90%;
    margin: 0 auto;
  }
  .brand-innovate .text {
    position: static;
    float: left;
    width: 100%;
    margin: 20px auto 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  .brand-innovate .img1 {
    width: 45%;
  }
  .brand-innovate .img2 {
    position: static;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    float: left;
    width: 45%;
    margin-left: 10%;
  }
  .brand-sec5 .section-bg {
    width: 100%;
  }
  .brand-future {
    width: 90%;
    margin: 0 auto;
  }
  .brand-future .img {
    float: none;
    margin-right: 0;
    width: 100%;
    height: 160px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
  }
  .brand-future .text {
    float: left;
    position: static;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    width: 100%;
  }
}
/* 新闻聚合
============================================================================ */
.page-back-btn.news-back-btn {
  top: 86px;
  z-index: 85;
}
.page-back-btn.list-back-btn {
  z-index: 17;
}
.news-page h3 {
  font-size: 36px;
  line-height: 56px;
  font-weight: bold;
}
.news-page h5 {
  font-size: 22px;
  line-height: 28px;
}
.news-page h4 {
  font-size: 20px;
  line-height: 32px;
  margin-top: 20px;
}
.news-page p {
  font-family: "Microsoft Yahei";
  line-height: 24px;
  color: #999;
}
.link-style {
  display: block;
  width: 120px;
  margin: 64px auto 0;
  line-height: 36px;
  position: relative;
  position: relative;
  text-align: center;
}
.link-style .bdt,
.link-style .bdr,
.link-style .bdb,
.link-style .bdl {
  display: block;
  position: absolute;
  background-color: #7d7d7d;
  z-index: 10;
}
.link-style .bdt {
  width: 0;
  height: 1px;
  top: 0;
  left: 0;
}
.link-style .bdr {
  width: 1px;
  height: 0;
  top: 0;
  right: 0;
}
.link-style .bdb {
  width: 0;
  height: 1px;
  bottom: 0;
  right: 0;
}
.link-style .bdl {
  width: 1px;
  height: 0;
  bottom: 0;
  left: 0;
}
.link-style:hover .bdt {
  -webkit-animation: bdA1 1.5s ease-out 0s infinite;
  animation: bdA1 1.5s ease-out 0s infinite;
}
.link-style:hover .bdr {
  -webkit-animation: bdA2 1.5s ease-out 0s infinite;
  animation: bdA2 1.5s ease-out 0s infinite;
}
.link-style:hover .bdb {
  -webkit-animation: bdA3 1.5s ease-out 0s infinite;
  animation: bdA3 1.5s ease-out 0s infinite;
}
.link-style:hover .bdl {
  -webkit-animation: bdA4 1.5s ease-out 0s infinite;
  animation: bdA4 1.5s ease-out 0s infinite;
}
.link-style::before,
.link-style::after {
  display: block;
  content: '';
  width: 100%;
  height: 1px;
  background: #7d7d7d;
  position: absolute;
  left: 0;
}
.link-style::before {
  top: 0;
  transform: translateX(20px);
}
.link-style::after {
  bottom: 0;
  transform: translateX(-20px);
}
.link-style:hover::before,
.link-style:hover::after {
  opacity: 0;
}
.news-sec1 {
  position: relative;
}
.news-sec1 .img {
  overflow: hidden;
}
.news-sec1 .img img {
  transform: scale(1.5);
  width: 100%;
}
.animation-action .news-sec1 .img img {
  transform: scale(1);
  transition: 10s cubic-bezier(.59, .5, .41, .92);
}
.news-sec1 .text {
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  text-align: center;
  color: #fff;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.news-sec1 .text a {
  display: block;
  width: 142px;
  line-height: 32px;
  border: 1px solid #fff;
  color: #fff;
  margin: 64px auto 0;
  transition: .4s;
}
.news-sec1 .text a:hover {
  background: #fff;
  color: #000;
  transition: .4s;
}
.news-sec2 {
  position: relative;
}
.news-sec2 .img {
  width: 50%;
}
.news-sec2 .img img {
  width: 100%;
}
.news-sec2 .text {
  width: 50%;
  position: absolute;
  left: 0;
  top: 50%;
  text-align: center;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.news-sec2 .text h5 {
  color: #6b6b6b;
}
.news-sec2 .text h4 {
  margin-bottom: 24px;
}
.news-sec3 {
  position: relative;
  width: 76%;
  margin: 0 auto;
}
.news-sec3 .back-list {
  display: block;
  width: 124px;
  line-height: 38px;
  text-align: center;
  background: #9e8549;
  position: absolute;
  left: 0;
  top: -38px;
  color: #fff;
}
.news-sec3 .back-list:hover {
  transition: .4s;
  background: #654b0b;
}
.news-sec3 .back-list img {
  height: 20px;
  vertical-align: top;
  margin: 9px 12px 0 0;
}
.news-sec3 .sec-title {
  text-align: center;
  margin-bottom: 30px;
}
.news-sec3 .title-bottom {
  margin-bottom: 80px;
}
.news-sec3 .sec-title h5 {
  color: #828282;
}
.news-sec3 .news-wrapper {
  position: relative;
}
.news-sec3 .media-list {
  margin: 0 -40px;
}
.news-sec3 .media-list li {
  float: left;
  padding: 0 40px;
}
.news-sec3 .media-list .img {
  overflow: hidden;
}
.news-sec3 .media-list .img img {
  width: 100%;
  transition: .4s;
}
.news-sec3 .media-list .img:hover img {
  transition: .4s;
  transform: scale(1.1);
}
.news-sec3 .media-list .text {
  margin-top: 22px;
}
.news-sec3 .media-list .text h5 {
  line-height: 32px;
  height: 64px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin-bottom: 16px;
}
.news-sec3 .media-list .text p {
  height: 48px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.news-sec3 .media-list .link-style {
  text-align: center;
  margin: 30px 0 0 20px;
}
.news-sec3 .news-prev {
  background-image: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgm6EGaHPAAAAANMms6c551.png);
  left: -10%;
}
.news-sec3 .news-next {
  background-image: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgmKEb-FQAAAAANLl0bE969.png);
  right: -10%;
}
.news-sec3 .news-prev,
.news-sec3 .news-next {
  width: 50px;
  height: 50px;
  transition: .4s;
  outline: none;
  position: absolute;
  top: 50%;
  margin-top: -25px;
  z-index: 15;
  cursor: pointer;
}
.news-sec3 .news-prev:hover {
  background-image: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgpmEcK90AAAAAKcj71k289.png);
}
.news-sec3 .news-next:hover {
  background-image: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgo6EAIV5AAAAAHuKEek735.png);
}
.news-sec3 .news-prev:hover,
.news-sec3 .news-next:hover {
  transition: .4s;
}
@media screen and (min-width: 2000px) {
  .news-sec3 .title-bottom {
    margin-bottom: 120px;
  }
  .news-sec3 .media-list li {
    padding: 0 2.4%;
  }
  .news-sec3 .media-list .text {
    margin-top: 32px;
  }
  .news-sec3 .media-list .text h5 {
    font-size: 26px;
    height: 80px;
    line-height: 40px;
  }
  .news-sec3 .media-list .text p {
    font-size: 16px;
    line-height: 28px;
    height: 56px;
  }
  .news-sec3 .media-list .link-style {
    margin-top: 50px;
  }
}
@media screen and (max-width: 1440px) {
  .link-style {
    margin-top: 48px;
  }
  .news-page h3 {
    font-size: 30px;
    line-height: 44px;
  }
  .news-page h5 {
    font-size: 18px;
    line-height: 24px;
  }
  .news-page h4 {
    font-size: 16px;
    line-height: 28px;
    margin-top: 14px;
  }
  .news-page p {
    line-height: 22px;
  }
  .news-page .link-style {
    margin: 48px auto 0;
  }
  .news-sec1 .text a {
    width: 136px;
    margin: 44px auto 0;
  }
  .news-sec2 .text h4 {
    margin-bottom: 20px;
  }
  .news-sec3 {
    margin-top: -40px;
  }
  .news-sec3 .sec-title {
    margin-bottom: 24px;
  }
  .news-sec3 .media-list {
    margin: 0 -24px;
  }
  .news-sec3 .media-list li {
    float: left;
    padding: 0 24px;
  }
  .news-sec3 .media-list .text {
    margin-top: 16px;
  }
  .news-sec3 .media-list .text h5 {
    line-height: 28px;
    height: 56px;
    margin-bottom: 12px;
  }
  .news-sec3 .media-list p {
    height: 44px;
    line-height: 22px;
  }
  .news-sec3 .media-list .link-style {
    margin: 22px 0 0 20px;
  }
}
@media screen and (max-width: 1366px) {
  .link-style {
    margin-top: 40px;
  }
  .news-page h3 {
    font-size: 26px;
    line-height: 38px;
  }
  .news-page .link-style {
    margin: 40px auto 0;
  }
  .news-sec1 .text a {
    width: 136px;
    margin: 44px auto 0;
  }
  .news-sec2 .text h4 {
    margin-bottom: 20px;
  }
  .news-sec3 {
    margin-top: -10px;
  }
  .news-sec3 .sec-title {
    margin-bottom: 16px;
  }
  .news-sec3 .media-list {
    margin: 0 -24px;
  }
  .news-sec3 .media-list .img {
    max-height: 180px
  }
  .news-sec3 .media-list .text {
    margin-top: 12px;
  }
  .news-sec3 .media-list .text h5 {
    line-height: 24px;
    height: 48px;
    margin-bottom: 8px;
  }
  .news-sec3 .media-list p {
    height: 44px;
  }
  .news-sec3 .media-list .link-style {
    margin: 22px 0 0 20px;
  }
}
@media screen and (max-width: 768px) {
  .link-style {
    line-height: 28px;
    font-size: 14px;
    width: 100px;
  }
  .link-style::before {
    transform: translateX(8px);
  }
  .link-style::after {
    transform: translateX(-8px);
  }
  .news-page .link-style {
    margin-top: 20px;
  }
  .news-page h3 {
    font-size: 24px;
    line-height: 36px;
  }
  .news-sec1 .img {
    height: 360px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  .news-sec1 .img img {
    height: 100%;
    width: auto;
  }
  .news-sec1 .text a {
    width: 108px;
    line-height: 26px;
  }
  .news-sec2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .news-sec2 .text {
    width: 90%;
    margin-top: 16px;
    position: static;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  .news-sec2 .text h4 {
    margin: 4px 0 10px;
  }
  .news-sec3 {
    width: 100%;
  }
  .news-sec3 .news-wrapper {
    padding: 0 50px;
  }
  .news-sec3 .media-list .text h5 {
    font-size: 16px;
  }
  .news-sec3 .news-prev,
  .news-sec3 .news-next {
    width: 30px;
    height: 30px;
    margin-top: 15px;
    top: 30%;
  }
  .news-sec3 .news-prev {
    left: 5px;
    background-size: 100% 100%;
  }
  .news-sec3 .news-next {
    right: 5px;
    background-size: 100% 100%;
  }
}
/* 新闻详情页
============================================================================ */
.news-article {
  height: 100%;
  position: relative;
  padding-bottom: 60px;
}
.news-article .relative-link {
  position: absolute;
  width: 70%;
  left: 15%;
  bottom: 12px;
}
.news-article .relative-link a {
  display: block;
  width: 49%;
  font-size: 18px;
  line-height: 34px;
  transition: .4s;
}
.news-article .relative-link a:last-child {
  text-align: right;
}
.news-article .relative-link a:hover {
  color: #c5b07c;
  transition: .4s;
}
.news-article .relative-link a .back-icon {
  display: inline-block;
  vertical-align: top;
  line-height: 34px;
  ;
  background: #c5b07b;
  padding: 0 18px;
  color: #fff;
}
.news-article .relative-link a .back-icon::before {
  display: inline-block;
  content: '';
  vertical-align: top;
  width: 28px;
  height: 16px;
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgteEdjEDAAAAAB5Z8xU039.png);
  background-size: 100% 100%;
  margin: 8px 12px 0 0;
}
.news-article .relative-link a .back-icon:hover {
  background: #654b0b;
  transition: .4s;
}
.news-article .relative-link a:hover .back-icon {
  background-position: 0 -16px;
  transition: .4s;
}
.scroll-view {
  height: 100%;
}
.news-detial {
  width: 76%;
  margin: 0 auto;
}
.news-detial .news-title {
  text-align: center;
  margin: 0 5.5% 32px;
}
.news-detial .news-title h3 {
  font-size: 30px;
  line-height: 42px;
  padding: 40px 0 24px;
  border-bottom: 1px solid #bfcfd3;
}
.news-detial .news-title .news-info {
  margin-top: 24px;
}
.news-detial .news-title .news-info span {
  margin: 0 5px;
}
.news-detial .news-cont p {
  line-height: 24px;
}
.news-detial .news-cont .img {
  margin: 20px 0;
  text-align: center;
}
.news-detial img {
  max-width: 100%;
}
@media screen and (min-width: 2000px) {
  .news-detial .news-title h3 {
    font-size: 36px;
    line-height: 50px;
    padding: 60px 0 36px;
  }
  .news-detial .news-title .news-info {
    margin-top: 30px;
    font-size: 16px;
  }
  .news-detial .news-cont p {
    line-height: 30px;
    font-size: 18px;
  }
  .news-detial .news-cont .img {
    margin: 32px 0;
  }
}
@media screen and (max-width: 1440px) {
  .news-article {
    padding-bottom: 50px;
  }
  .news-article .relative-link {
    bottom: 8px;
  }
  .news-detial .news-title {
    margin-bottom: 24px;
  }
  .news-detial .news-title h3 {
    font-size: 24px;
    line-height: 32px;
    padding: 30px 0 18px;
  }
  .news-detial .news-title .news-info {
    margin-top: 16px;
  }
}
@media screen and (max-width: 768px) {
  .page-back-btn.detail-page-back {
    left: 10px;
  }
  .news-article {
    padding-bottom: 56px;
  }
  .news-detial {
    width: 100%;
    padding: 0 5%;
  }
  .news-detial .news-title {
    margin: 0 0 15px;
  }
  .news-detial .news-title h3 {
    font-size: 18px;
    line-height: 24px;
    padding-bottom: 12px;
  }
  .news-article .relative-link {
    bottom: 0;
    width: 90%;
    left: 5%;
  }
  .news-article .relative-link a {
    width: 100%;
    font-size: 12px;
    line-height: 24px;
    height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .news-article .relative-link a:last-child {
    text-align-last: left;
  }
}
/* 品牌大事记
============================================================================ */
.history {
  height: 100%;
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgtWEJMGlAAAAAI-QNVM578.jpg);
  background-size: 100% 100%;
}
.history .history-wp {
  padding-top: 40px;
  position: relative;
}
#historySwiper {
  height: 638px;
  padding: 120px 0 72px;
}
#historySwiper .item {
  width: 72%;
  height: 260px;
  transition: .4s;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}
#historySwiper .item .item-main {
  height: 100%;
  position: relative;
}
#historySwiper .item .img {
  height: 100%;
  position: relative;
}
#historySwiper .item .img img {
  width: 100%;
  height: 100%;
}
#historySwiper .item h1 {
  position: absolute;
  width: 100%;
  text-align: center;
  font-size: 48px;
  line-height: 96px;
  top: -96px;
  transition: .4s;
}
#historySwiper .item .text {
  position: absolute;
  width: 100%;
  top: 80%;
  left: 0;
  transform: translateY(-50%);
  color: #fff;
  line-height: 24px;
  padding: 0 80px;
  font-family: "Microsoft Yahei";
  text-align: center;
  opacity: 0;
  transition: .4s;
  z-index: 3;
}
#historySwiper .item .filter {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: #000;
  opacity: 0;
  transition: .4s;
}
#historySwiper .item h5 {
  position: absolute;
  width: 100%;
  line-height: 72px;
  left: 0;
  bottom: -72px;
  text-align: center;
  font-size: 18px;
  transition: .4s;
}
#historySwiper .swiper-slide-active .item {
  transition: .4s;
  width: 110%;
  height: 446px;
}
#historySwiper .swiper-slide-active h1 {
  font-size: 48px;
  line-height: 120px;
  top: -120px;
  transition: .4s;
}
#historySwiper .swiper-slide-active .text {
  opacity: 1;
  transition: .4s .4s;
  top: 50%;
}
#historySwiper .swiper-slide-active .filter {
  opacity: .56;
  transition: .4s;
}
#historySwiper .swiper-slide-active .item h5 {
  font-size: 24px;
  transition: .4s;
}
#historySwiper .prev-section,
#historySwiper .next-section {
  position: absolute;
  width: 28.9%;
  height: 100%;
  top: 0;
  z-index: 15;
  cursor: pointer;
}
#historySwiper .prev-section {
  left: 0;
}
#historySwiper .next-section {
  right: 0;
}
.history-btns {
  text-align: center;
  margin-top: 20px;
  position: relative;
  z-index: 99;
}
.history-btns .history-prev {
  background-image: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgvWEearYAAAAAHMDT1w815.png);
}
.history-btns .history-next {
  background-image: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgzqEekUNAAAAAJUcC3c668.png);
}
.history-btns span {
  display: inline-block;
  vertical-align: middle;
  width: 50px;
  height: 50px;
  background-color: #efefef;
  border-radius: 100%;
  box-shadow: 0 6px 9px 2px rgba(0, 0, 0, .22);
  cursor: pointer;
  position: relative;
  z-index: 3;
  background-repeat: no-repeat;
  background-position: center center;
  transition: .4s;
  outline: none;
}
.history-btns i {
  display: inline-block;
  vertical-align: middle;
  width: 140px;
  height: 2px;
  background: #000;
  opacity: .3;
  margin: 0 -8px;
}
.history-btns .history-prev:hover {
  background-image: url(//dfs.yun300.cn/group1/M00/17/4A/rBQBHF0Mnf-EVdZ7AAAAABoA-QY264.png);
}
.history-btns .history-next:hover {
  background-image: url(//dfs.yun300.cn/group1/M00/17/35/rBQBHV0D9CWEH4lYAAAAAOgvqNw534.png);
}
.history-btns span:hover {
  background-color: #81672b;
  transition: .4s;
}
@media screen and (max-width: 1440px) {
  .history .history-wp {
    padding-top: 40px;
  }
  #historySwiper {
    height: 496px;
    padding: 96px 0 50px;
  }
  #historySwiper .item {
    height: 202px;
  }
  #historySwiper .item h1 {
    font-size: 36px;
    line-height: 72px;
    top: -72px;
  }
  #historySwiper .item .text {
    padding: 0 60px;
  }
  #historySwiper .item h5 {
    line-height: 50px;
    bottom: -50px;
  }
  #historySwiper .swiper-slide-active .item {
    width: 110%;
    height: 350px;
  }
  #historySwiper .swiper-slide-active h1 {
    font-size: 56px;
    line-height: 96px;
    top: -96px;
  }
  .history-btns {
    margin-top: 16px;
  }
  .history-btns span {
    width: 44px;
    height: 44px;
  }
}
@media screen and (max-width: 1366px) {
  .history .history-wp {
    padding-top: 20px;
  }
  #historySwiper {
    height: 400px;
    padding: 60px 0 40px;
  }
  #historySwiper .item {
    height: 176px;
  }
  #historySwiper .item h1 {
    font-size: 24px;
    line-height: 48px;
    top: -48px;
  }
  #historySwiper .item .text {
    padding: 0 48px;
  }
  #historySwiper .item h5 {
    line-height: 40px;
    bottom: -40px;
    font-size: 14px;
  }
  #historySwiper .swiper-slide-active .item {
    width: 110%;
    height: 300px;
  }
  #historySwiper .swiper-slide-active h1 {
    font-size: 28px;
    line-height: 60px;
    top: -60px;
  }
  #historySwiper .swiper-slide-active .item h5 {
    font-size: 18px;
  }
  .history-btns {
    margin-top: 16px;
  }
  .history-btns span {
    width: 44px;
    height: 44px;
  }
}
@media screen and (max-width: 768px) {
  #historySwiper {
    width: 90%;
    margin: 0 auto;
  }
  #historySwiper .item {
    width: 100%;
    height: 300px;
  }
  #historySwiper .swiper-slide-active .item {
    width: 100%;
    transition: none;
  }
  #historySwiper .item .text {
    padding: 0 20px;
  }
  #historySwiper .item h1 {
    font-size: 28px;
    line-height: 60px;
    top: -60px;
  }
  #historySwiper .item h5 {
    font-size: 18px;
  }
}
/* 样例展示
============================================================================ */
.page-back-btn.example-back-btn {
  top: auto;
  bottom: 54px;
  z-index: 89;
  left: 6%;
}
.example-pagination {
  position: absolute;
  width: 88%;
  left: 6%;
  top: 61%;
  z-index: 15;
  transform: translateY(50px);
  opacity: 0;
  visibility: hidden;
  transition: .8s;
}
.example-pagination.example-pagination-show {
  opacity: 1;
  transform: translateY(0);
  transition: .8s;
  visibility: visible;
}
.example-pagination .thumbnail a {
  float: left;
  width: 240px;
  height: 136px;
  margin-right: 10px;
  position: relative;
}
.example-pagination .thumbnail a .border {
  position: absolute;
  background: #a98f5f;
  z-index: 5;
}
.example-pagination .thumbnail a .border1 {
  width: 0;
  height: 5px;
  top: 0;
  left: 0;
  transition: .2s .6s;
}
.example-pagination .thumbnail a .border2 {
  width: 5px;
  height: 0;
  top: 0;
  right: 0;
  transition: .2s .4s;
}
.example-pagination .thumbnail a .border3 {
  width: 0;
  height: 5px;
  bottom: 0;
  right: 0;
  transition: .2s .2s;
}
.example-pagination .thumbnail a .border4 {
  width: 5px;
  height: 0;
  bottom: 0;
  left: 0;
  transition: .2s;
}
.example-pagination .thumbnail a .img {
  height: 100%;
  overflow: hidden;
}
.example-pagination .thumbnail a .img img {
  width: 100%;
  height: 100%;
  transition: .4s;
}
.example-pagination .thumbnail a .filter {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: rgba(0, 0, 0, .5);
  transition: .4s;
}
.example-pagination .thumbnail a h4 {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 3;
  line-height: 40px;
  text-align: center;
  font-size: 20px;
  color: #fff;
}
.example-pagination .thumbnail a.active .border1 {
  width: 100%;
  transition: .2s;
}
.example-pagination .thumbnail a.active .border2 {
  height: 100%;
  transition: .2s .2s;
}
.example-pagination .thumbnail a.active .border3 {
  width: 100%;
  transition: .2s .3s;
}
.example-pagination .thumbnail a.active .border4 {
  height: 100%;
  transition: .2s .6s;
}
.example-pagination .thumbnail a.active .filter {
  background: rgba(0, 0, 0, .1);
  transition: .4s;
}
.example-pagination .thumbnail a.active .img img {
  transition: .4s;
  transform: scale(1.2);
}
.example-pagination .order-text {
  margin-top: 36px;
  font-size: 40px;
  line-height: 68px;
  font-style: italic;
}
.example-pagination .order-text span {
  font-size: 68px;
  color: #a98f5f;
}
.example-title {
  height: 100%;
  padding-bottom: 0;
  position: relative;
}
.example-title .left-text {
  float: left;
  height: 100%;
  position: relative;
}
.example-title .left-text .text {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -moz-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
}
.example-title .left-text .text h4 {
  font-size: 36px;
  line-height: 48px;
}
.example-title .left-text .text h5 {
  font-size: 34px;
  line-height: 44px;
  margin-bottom: 24px;
}
.example-title .left-text .text p {
  line-height: 24px;
  color: #999;
  font-family: "Microsoft Yahei";
}
/* .example-title .right-img{float: right;height: 100%;transform: translateX(100px);opacity: 0;transition: 0s .7s;} */
.example-title .right-img {
  float: right;
  height: 100%;
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrg2-EShCrAAAAAMzfSbA291.jpg) no-repeat center center;
  background-size: cover;
  padding: 8px;
  overflow: hidden;
}
.example-title .right-img .img-group{
  height: 100%;
}
.example-title .right-img .img{
  padding: 8px;
  perspective: 0;
  position: relative;
}
.example-title .right-img .img span{
  display: block;
  height: 100%;
  overflow: hidden;
}
/* .example-title .right-img img{width: 100%;height: 100%;transition: .6s;} */
/* .example-title .right-img .img:hover img{transition: .6s;transform: scale(1.2);} */
.example-title .right-img {
  width:100%;
  height: 100%;
  float: left;
  position: relative;
}
.example-title .right-img .swiper-slide .img{
  width: 17%;
  height: 25%;
  position: absolute;
}
.example-title .right-img .swiper-slide .img:nth-child(1){
  width:32%;
  height: 50%;
  right: 0;
}
.example-title .right-img .swiper-slide .img:nth-child(2){
  width:32%;
  height: 50%;
  left: 0;
  top: 50%;
}
.example-title .right-img .swiper-slide .img:nth-child(3){
  top: 0;
  left: 0;
}
.example-title .right-img .swiper-slide .img:nth-child(4){
  top: 0;
  left: 17%;
}
.example-title .right-img .swiper-slide .img:nth-child(5){
  top: 0;
  left: 34%;
}
.example-title .right-img .swiper-slide .img:nth-child(6){
  top: 0;
  left: 51%;
}
.example-title .right-img .swiper-slide .img:nth-child(7){
  top:25%;
  left: 0%;
}
.example-title .right-img .swiper-slide .img:nth-child(8){
  top:25%;
  left: 17%;
}
.example-title .right-img .swiper-slide .img:nth-child(9){
  top:25%;
  left: 34%;
}
.example-title .right-img .swiper-slide .img:nth-child(10){
  top:25%;
  left: 51%;
}

.example-title .right-img .swiper-slide .img:nth-child(11){
  left:32%;
  top: 50%;
}
.example-title .right-img .swiper-slide .img:nth-child(12){
  left:49%;
  top: 50%;
}
.example-title .right-img .swiper-slide .img:nth-child(13){
  left:66%;
  top: 50%;
}
.example-title .right-img .swiper-slide .img:nth-child(14){
  left:83%;
  top: 50%;
}
.example-title .right-img .swiper-slide .img:nth-child(15){
  left:32%;
  top: 75%;
}
.example-title .right-img .swiper-slide .img:nth-child(16){
  left:49%;
  top: 75%;
}
.example-title .right-img .swiper-slide .img:nth-child(17){
  left:66%;
  top: 75%;
}
.example-title .right-img .swiper-slide .img:nth-child(18){
  left:83%;
  top: 75%;
}
.example-title .link-style {
  margin-left: 0;
}
.example-title .example-back-btn {
  left: 18%;
  top: 5%;
  
  opacity: 0;
}
.example-title .example-back-btn img {
  height: 20px;
  vertical-align: top;
  margin: 9px 12px 0 0;
}
.example-page .upIn {
  transform: translateY(100%);
  opacity: 0;
}
.example-page .leftIn {
  transform: translateX(-100%);
  opacity: 0;
}
.example-page .rightIn {
  transform: translateX(100%);
  opacity: 0;
}
/* .active.animation-action .swiper-slide-active .example-title .right-img{transform: translateX(0);opacity: 1;transition: .8s .4s;} */
.active.animation-action .swiper-slide-active .upIn {
  transform: translateY(0);
  opacity: 1;
  transition: .8s;
}
.active.animation-action .swiper-slide-active .leftIn {
  transform: translateX(0);
  opacity: 1;
  transition: 1s .4s;
}
.active.animation-action .swiper-slide-active .rightIn {
  transform: translateX(0);
  opacity: 1;
  transition: 1s .4s;
}
.active.animation-action .swiper-slide-active .example-title h4 {
  transition-delay: .4s;
}
.active.animation-action .swiper-slide-active .example-title h5 {
  transition-delay: .6s;
}
.active.animation-action .swiper-slide-active .example-title p {
  transition-delay: .8s;
}
.active.animation-action .swiper-slide-active .example-title .btn-wrapper {
  transition-delay: 1s;
}
.active.animation-action .swiper-slide-active .example-title .example-back-btn {
  opacity: 1;
  transition: .8s;
}
.example-title .img-roll {
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transform-origin: center center 75px;
  background: #fff;
}
.example-title .img-roll.roll-step0 {
  transform: rotateY(0deg);
  transition: 0s;
}
.example-title .img-roll.roll-step1 {
  transform: rotateY(90deg);
  transition: .8s;
}
.example-title .img-roll.roll-step2 {
  transform: rotateY(180deg);
  transition: .8s;
}
.example-title .img-roll.roll-step3 {
  transform: rotateY(270deg);
  transition: .8s;
}
.example-title .img-roll.roll-step4 {
  transform: rotateY(360deg);
  transition: .8s;
}
.example-title .img-roll img {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
}
.example-title .img-roll .img1 {
  z-index: 3;
}
.example-title .img-roll .img2 {
  transform-origin: 100% 0 0;
  transform: rotateY(90deg);
}
.example-title .img-roll .img3 {
  transform-origin: 0 100% 0;
  transform: rotateY(-90deg);
}
.example-title .img-roll.roll-step1 .img2 {
  z-index: 4;
}
.example-title .img-roll.roll-step2 .img4 {
  z-index: 4;
}
.example-title .left-text {
  width: 48%;
}
.example-title .left-text .text {
  width: 572px;
}
.example-title .right-img {
  width: 52%;
}
.example-title .right-img .imgview-swiper {
  height: 100%;
}
.example-inner{
  position: relative;
  height: 100%;
}
.example-inner .inner-bg{
  position: absolute;
  z-index: 1;
  transform: translateX(100px);
  opacity: 0;
  font-family: TimesNewRoman;
  display: flex;
  font-weight: bold;
}
.example-inner .inner-bg span{
  display: block;
}
.example-inner .inner-bg img{
  width: 100%;
  height: 100%;
}
.example-inner .bg-ss{
  right: -24%;
  bottom: -4.8%;
  font-size: 1280px;
  line-height: 960px;
}
.example-inner .bg-ss span:first-child{
  margin-right: -12%;
}
.example-inner .bg-aw{
  right: -58%;
  bottom: -4.8%;
  font-size: 1280px;
  line-height: 960px;
}
.example-inner .bg-aw span:first-child{
  margin-right: -26%;
}
.example-inner .bg-clip{-webkit-background-clip: text;background-clip: text;background-position: center center;color:transparent;background-size: 100%;}
.animation-action .example-inner .bg-clip{-webkit-animation: aitf 5s ease-out .5s 1;animation: aitf 5s ease-out .5s 1;-webkit-animation-fill-mode: forwards;animation-fill-mode: forwards;}

.example-inner .text {
  width: 88%;
  margin: 0 auto;
  position: relative;
  z-index: 3;
  padding-top: 48px;
}
.example-inner .text p {
  line-height: 32px;
}
.example-inner .text h1 {
  font-size: 120px;
  line-height: 140px;
  margin-top: 20px;
  transform: translateY(100px);
  opacity: 0;
}
.example-inner .text .p {
  transform: translateY(-100px);
  opacity: 0;
}
.example-inner .title {
  width: 44.9%;
  height: 80px;
  line-height: 80px;
  position: absolute;
  z-index: 3;
  bottom: 39%;
  right: 18.9%;
  background: #fff;
  margin-bottom: 10px;
  transform: translateX(-200px);
  opacity: 0;
}
.example-inner .title h3 {
  font-size: 24px;
  padding-left: 15%;
  float: left;
  white-space: nowrap;
  line-height: 80px;
}
.example-inner .title h3 span {
  font-size: 36px;
  display: inline-block;
  vertical-align: top;
  margin-right: 50px;
}
.example-inner .title h4 {
  font-size: 16px;
  font-family: HelveticaBold;
}
.example-inner .title .text-horn {
  position: absolute;
  line-height: 1;
  top: -16px;
  right: -112px;
  letter-spacing: 5px;
}
.example-inner .title .text-horn span {
  color: #fff;
}
.example-inner .title .text-inner {
  float: left;
  margin-left: 13%;
}
.active.animation-action .swiper-slide-active .example-inner .inner-bg {
  transform: translateX(0);
  opacity: 1;
  transition: .8s .4s;
}
.active.animation-action .swiper-slide-active .example-inner .title {
  transform: translateX(0);
  opacity: 1;
  transition: .8s .4s;
}
.active.animation-action .swiper-slide-active .example-inner .text h1 {
  transform: translateY(0);
  opacity: 1;
  transition: 1s .8s;
}
.active.animation-action .swiper-slide-active .example-inner .text .p {
  transform: translateY(0);
  opacity: 1;
  transition: 1s .8s;
}
.example-view-inner {
  position: relative;
  width: 100%;
  height: 100%;
}
.poster-main {
  position: absolute;
  width: 1420px;
  height: 540px;
  top: 50%;
  left: 50%;
  margin: -270px 0 0 -710px;
}
.poster-main .poster-list {
  width: 1420px;
  height: 540px;
}
.poster-main .poster-list .poster-item {
  position: absolute;
  top: 0;
}
.poster-main .poster-list .poster-item img {
  width: 100%;
  height: 100%;
}
.poster-main .poster-btn {
  position: absolute;
  top: 0;
  z-index: 10;
  cursor: pointer;
}
.poster-main .poster-prev-btn {
  left: 0;
}
.poster-main .poster-next-btn {
  right: 0;
}
.example-controls {
  position: absolute;
  width: 240px;
  height: 30px;
  bottom: 8%;
  left: 50%;
  margin-left: -120px;
}
.example-controls a {
  display: block;
  width: 96px;
  height: 30px;
}
.example-controls .example-img-prev {
  float: left;
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrg7SEb822AAAAAMEjKTA113.png) no-repeat;
  background-size: contain;
}
.example-controls .example-img-next {
  float: right;
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrg6aECeWPAAAAAI1yD7A300.png) no-repeat;
  background-size: contain;
}
.img-cube {
  height: 100%;
  width: 100%;
}
.img-cube img {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1680px) {
  .example-inner .bg-ss{
    font-size: 1160px;
    line-height: 900px;
  }
  .example-inner .bg-aw{
    font-size: 1160px;
    line-height: 900px;
  }
}
@media screen and (max-width: 1440px) {
  .example-title .example-back-btn{
    left: 14%;
  }
  .example-pagination .thumbnail a{
    float: left;
    width: 200px;
    height: 114px;
    margin-right: 8px;
  }
  .example-pagination .thumbnail a h4{
    font-size: 18px;
  }
  .example-pagination .thumbnail a.active::after{
    border-width: 3px;
  }
  .example-pagination .order-text{
    margin-top: 30px;
    font-size: 36px;
    line-height: 60px;
  }
  .example-pagination .order-text span{
    font-size: 60px;
  }
  .example-title .left-text .text h4{
    font-size: 32px;
    line-height: 44px;
  }
  .example-title .left-text .text h5{
    font-size: 28px;
    line-height: 36px;
    margin-bottom: 20px;
  }
  .example-inner .text{
    width: 88%;
    margin: 0 auto;
    position: relative;
    z-index: 3;
    padding-top: 44px;
  }
  .example-inner .text p{
    line-height: 28px;
  }
  .example-inner .text h1{
    font-size: 96px;
    line-height: 120px;
    margin-top: 16px;
  }
  .example-inner .title{
    height: 70px;
    line-height: 70px;
  }
  .example-inner .title h3{
    font-size: 20px;
    line-height: 70px;
  }
  .example-inner .title h3 span{
    font-size: 32px;
    margin-right: 44px;
  }
  .example-inner .title .text-horn{
    right: -104px;
  }
  .example-inner .bg-ss{
    font-size: 940px;
    line-height: 780px;
  }
  .example-inner .bg-aw{
    font-size: 940px;
    line-height: 780px;
  }
  .poster-main{
    width: 1068px;
    height: 406px;
    margin: -203px 0 0 -534px;
  }
  .poster-main .poster-list{
    width: 1068px;
    height: 406px;
  }
  .example-controls{
    width: 180px;
    height: 22px;
    margin-left: -90px;
  }
  .example-controls a{
    width: 70px;
    height: 22px;
  }
}
@media screen and (max-width: 1366px) {
  .example-title .example-back-btn{
    left: 10%;
  }
  .example-pagination .thumbnail a{
    width: 158px;
    height: 90px;
    margin-right: 5px;
  }
  .example-pagination .thumbnail a h4{
    font-size: 16px;
  }
  .example-pagination .order-text{
    margin-top: 16px;
    font-size: 24px;
    line-height: 44px;
  }
  .example-pagination .order-text span{
    font-size: 44px;
  }
  .example-title .left-text .text h4{
    font-size: 28px;
    line-height: 38px;
  }
  .example-title .left-text .text h5{
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 16px;
  }
  .example-inner .text{
    padding-top: 28px;
  }
  .example-inner .text p{
    line-height: 24px;
  }
  .example-inner .text h1{
    font-size: 80px;
    line-height: 96px;
    margin-top: 14px;
  }
  .example-inner .title{
    height: 56px;
    line-height: 56px;
  }
  .example-inner .title h3{
    font-size: 18px;
    line-height: 56px;
  }
  .example-inner .title h3 span{
    font-size: 28px;
    margin-right: 30px;
  }
  .example-inner .bg-ss{
    font-size: 750px;
    line-height:600px;
  }
  .example-inner .bg-ss span:first-child{
    margin-right: -12%;
  }
  .example-inner .bg-aw{
    right: -50%;
    font-size: 750px;
    line-height: 600px;
  }
}
@media screen and (max-width: 1280px) {
  .poster-main{
    width: 800px;
    height: 304px;
    margin: -152px 0 0 -400px;
  }
  .poster-main .poster-list{
    width: 800px;
    height: 304px;
  }
  .example-controls{
    width: 150px;
    height: 18px;
    margin-left: -75px;
  }
  .example-controls a{
    width: 56px;
    height: 18px;
  }
}
@media screen and (max-width: 992px) {
  .poster-main{
    width: 700px;
    height: 266px;
    margin: -133px 0 0 -350px;
  }
  .poster-main .poster-list{
    width: 700px;
    height: 266px;
  }
  .example-inner .bg-ss{
    right: -36%;
  }
  .example-inner .bg-aw{
    right: -72%;
  }
}
@media screen and (max-width: 768px) {
  .example-inner .inner-bg{
    display: flex;
    align-items: center;
    overflow: hidden;
    justify-content: flex-end;
  }
  .example-inner .inner-bg img{
    height: auto;
    width: 120%;
  }
  .poster-main{
    margin: 0;
    top: 0;
    left: 0;
    position: relative;
  }
  .example-view-inner{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
  }
  .example-controls{
    position: relative;
    top: 0;
    left: 0;
    margin: 40px 0 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .example-pagination{
    width: 90%;
    left: 5%;
    top: auto;
    bottom: 44px;
  }
  .example-pagination .thumbnail{
    display: flex;
    justify-content: space-between;
  }
  .example-pagination .thumbnail a{
    width: 32%;
    height: 50px;
  }
  .example-pagination .thumbnail a:last-child{
    margin-right: 0;
  }
  .example-pagination .thumbnail a h4{
    display: none;
  }
  .example-pagination .thumbnail a .border1{
    height: 3px;
  }
  .example-pagination .thumbnail a .border2{
    width: 3px;
  }
  .example-pagination .thumbnail a .border3{
    height: 3px;
  }
  .example-pagination .thumbnail a .border4{
    width: 3px;
  }
  .example-inner .title{
    width: 90%;
    right: 5%;
  }
  .example-inner .title h3{
    padding-left: 3%;
  }
  .example-inner .title h4{
    font-size: 14px;
  }
  .example-inner .title .text-horn{
    right: -10px;
  }
  .example-inner .text{
    padding-right: 20px;
    font-size: 12px;
    line-height: 18px;
  }
  .example-inner .text h1{
    font-size: 50px;
    line-height: 56px;
  }
  .example-inner .text p{
    line-height: 20px;
  }
  .example-title .left-text .text{
    width: 90%;
    position: static;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }
  .example-inner .bg-ss{
    right: -16%;
    bottom: auto;
    font-size: 320px;
    line-height: 320px;
    top: 50%;
    margin-top: -160px;
  }
  .example-inner .bg-ss span:first-child{
    margin-right: -12%;
  }
  .example-inner .bg-aw{
    right: -38%;
    bottom: auto;
    font-size: 320px;
    line-height: 320px;
    top: 50%;
    margin-top: -160px;
  }
  .example-inner .bg-aw span:first-child{
    margin-right: -26%;
  }
  .example-title .right-img .imgview-swiper{
    width: 100%;
  }
  .example-title{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  .example-title .right-img{
    width: 100%;
    height: 50%;
    padding: 2px;
    display: flex;
    flex-shrink: 0;
  }
  .example-title .right-img .img{
    padding: 2px;
  }
  .example-title .left-text{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .example-item1 .example-title .left-text .text{
    width: 90%;
    position: static;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }
  .example-title .left-text .text p{
    font-size: 12px;
    line-height: 18px;
    height: 54px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
  .example-title .left-text .text h4{
    font-size: 20px;
    line-height: 24px;
  }
  .example-title .left-text .text h5{
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 8px;
  }
  .example-title .link-style{
    margin-top: 15px;
    margin-left: 8px;
  }
  .active.animation-action .swiper-slide-active .example-title .example-back-btn{
    left: auto;
    right: 5%;
  }
}
/* 定制流程
============================================================================ */
.customized-page .title {
  font-size: 64px;
  margin-bottom: 18px;
  line-height: 80px;
}
.customized-page p {
  line-height: 32px;
}
.customized-page .sec-order {
  font-size: 40px;
  color: #6a6a6a;
  line-height: 72px;
  font-style: italic;
  margin-top: 25px;
}
.customized-page .sec-order span {
  font-size: 64px;
  color: #a58f65;
}
#customizedSwiper1 .customized-pagination {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 54px;
  z-index: 15;
  text-align: center;
}
#customizedSwiper1 .swiper-pagination-bullet {
  width: 18px;
  height: 18px;
  background: none;
  border-radius: 0;
  opacity: 1;
  border: 3px solid #fff;
  margin: 0 8px;
}
#customizedSwiper1 .swiper-pagination-bullet-active {
  border-color: #a58f65;
  background: #a58f65;
  cursor: pointer;
}
.customized-liang {
  position: relative;
  height: 100%;
}
.customized-liang .bg-img {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 40%;
}
.customized-liang .bg-img img {
  width: 100%;
}
.customized-liang .pic {
  position: absolute;
  width: 100%;
  height: 42%;
  left: 0;
  bottom: 0;
  z-index: 3;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.customized-liang .pic img {
  min-height: 100%;
  min-width: 100%;
}
.customized-liang .text {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 42%;
  z-index: 5;
  padding: 0 16.5% 72px;
}
.customized-liang .text h1 {
  font-size: 140px;
  font-style: italic;
  line-height: 1;
}
.customized-liang .text h1 span {
  display: inline-block;
  vertical-align: top;
}
.customized-liang .text h3 {
  font-size: 36px;
}
.customized-liang .text p {
  margin-top: 10px;
}
.btn-style {
  display: block;
  width: 220px;
  line-height: 50px;
  background: #000;
  font-size: 16px;
  color: #fff;
  box-shadow: 0 5px 5px rgba(0, 0, 0, .2);
  text-align: center;
  margin-top: 48px;
}
.customized-page .leftIn {
  opacity: 0;
  transform: translateX(-100px);
  transition: 0s .7s;
}
.customized-page .rightIn {
  opacity: 0;
  transform: translateX(100px);
  transition: 0s .7s;
}
.customized-page .upIn {
  opacity: 0;
  transform: translateY(100px);
  transition: 0s .7s;
}
.active .swiper-slide-active .swimming {
  animation: swimming 10s linear infinite
}
.customized-page .active .swiper-slide-active .leftIn {
  opacity: 1;
  transform: translateX(0);
  transition: 600ms .7s;
}
.customized-page .active .swiper-slide-active .rightIn {
  opacity: 1;
  transform: translateX(0);
  transition: 600ms .7s;
}
.customized-page .active .swiper-slide-active .upIn {
  opacity: 1;
  transform: translateY(0);
  transition: 600ms .7s;
}
.customized-page .active .swiper-slide-active .delay-400 {
  transition-delay: 400ms;
}
.customized-page .active .swiper-slide-active .delay-600 {
  transition-delay: 600ms;
}
.customized-page .active .swiper-slide-active .delay-800 {
  transition-delay: 800ms;
}
.customized-page .active .swiper-slide-active .delay-1000 {
  transition-delay: 1000ms;
}
.customized-page .active .swiper-slide-active .slower {
  transition-duration: 1.6s;
}
.customized-sec2 .text {
  width: 25%;
  margin-left: 10%;
}
.customized-sec2 .img {
  width: 65%;
  margin: -10px -10px 0 0;
}
.customized-sec2 .img .img-left {
  width: 17.2%;
  float: left;
}
.customized-sec2 .img .img-right {
  width: 82.8%;
  float: left;
}
.customized-sec2 .img .img-wp {
  padding: 10px;
}
.customized-sec2 .img .img-wp img {
  width: 100%;
}
.customized-sec3 .sec-left {
  width: 66%;
  position: absolute;
  left: 0;
  bottom: 54px;
}
.customized-sec3 .sec-left .img {
  margin-top: 32px;
}
.customized-sec3 .sec-left .img img {
  width: 100%;
}
.customized-sec3 .sec-left h5 {
  font-size: 22px;
  line-height: 32px;
  padding: 0 5.6%;
}
.customized-sec3 .sec-right {
  width: 28%;
}
.customized-page .customized-sec3 .sec-order {
  margin: 20px 0;
}
.customized-sec4 .sec-inner {
  position: relative;
}
.customized-sec4 .sec-left {
  width: 70%;
  margin: -10px 0 0 -10px;
}
.customized-sec4 .sec-left .img {
  float: left;
  width: 33.33%;
  position: relative;
  padding: 10px;
}
.customized-sec4 .sec-left .img:nth-child(even) {
  top: 80px;
}
.customized-sec4 .sec-left .img img {
  width: 100%;
}
.customized-sec4 .sec-right {
  position: absolute;
  width: 30%;
  height: 100%;
  right: 0;
  top: 0;
}
.customized-sec4 .sec-right .text {
  position: absolute;
  width: 100%;
  padding-left: 12%;
  left: 0;
  top: 50%;
  -webkit-transform: translate3d(0, -50%, 0);
  -ms-transform: translate3d(0, -50%, 0);
  -moz-transform: translate3d(0, -50%, 0);
  -o-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
}
.customized-sec5 .sec-inner {
  position: relative;
}
.customized-sec5 .sec-left {
  width: 46%;
  margin-left: 16%;
}
.customized-sec5 .sec-left .img {
  float: left;
  width: 50%;
  padding: 0 10px;
}
.customized-sec5 .sec-left .img img {
  width: 100%;
}
.customized-sec5 .sec-right {
  position: absolute;
  right: 0;
  width: 38%;
  top: 0;
  height: 100%;
}
.customized-sec5 .sec-right .text {
  position: absolute;
  width: 100%;
  padding-left: 11%;
  left: 0;
  top: 50%;
  -webkit-transform: translate3d(0, -50%, 0);
  -ms-transform: translate3d(0, -50%, 0);
  -moz-transform: translate3d(0, -50%, 0);
  -o-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
}
@media screen and (max-width: 1440px) {
  .customized-page .title {
    font-size: 48px;
    margin-bottom: 12px;
    line-height: 60px;
  }
  .customized-page p {
    line-height: 24px;
  }
  .customized-page .sec-order {
    font-size: 32px;
    line-height: 52px;
    margin-top: 18px;
  }
  .customized-page .sec-order span {
    font-size: 48px;
  }
  #customizedSwiper1 .customized-pagination {
    bottom: 48px;
  }
  #customizedSwiper1 .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    border-width: 2px;
    margin: 0 5px;
  }
  .customized-liang .text {
    padding-bottom: 50px;
  }
  .customized-liang .text h1 {
    font-size: 108px;
  }
  .customized-liang .text h3 {
    font-size: 32px;
  }
  .btn-style {
    display: block;
    width: 200px;
    line-height: 44px;
    margin-top: 36px;
  }
}
@media screen and (max-width: 1366px) {
  .customized-page .title {
    font-size: 40px;
    margin-bottom: 10px;
    line-height: 56px;
  }
  .customized-page p {
    line-height: 24px;
  }
  .customized-page .sec-order {
    font-size: 28px;
    line-height: 44px;
    margin-top: 14px;
  }
  .customized-page .sec-order span {
    font-size: 48px;
  }
  .customized-page .customized-sec3 .sec-order {
    margin: 12px 0;
  }
  #customizedSwiper1 .customized-pagination {
    bottom: 48px;
  }
  #customizedSwiper1 .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
  }
  .customized-liang .text {
    padding-bottom: 50px;
  }
  .customized-liang .text h1 {
    font-size: 80px;
  }
  .customized-liang .text h3 {
    font-size: 28px;
  }
  .customized-liang .text p {
    margin-top: 6px;
  }
  .btn-style {
    width: 180px;
    line-height: 40px;
    margin-top: 22px;
  }
  .customized-sec3 .sec-left h5 {
    font-size: 18px;
  }
}
@media screen and (max-width: 768px) {
  .customized-page .title {
    font-size: 24px;
    line-height: 36px;
  }
  .customized-page p {
    font-size: 12px;
    line-height: 22px;
  }
  .customized-page .sec-order {
    font-size: 18px;
    line-height: 28px;
  }
  .customized-page .sec-order span {
    font-size: 28px;
  }
  .customized-liang .pic {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  .customized-liang .pic img {
    height: 100%;
    width: auto;
  }
  #customizedSwiper1 .customized-pagination {
    bottom: 44px;
  }
  .customized-liang .bg-img {
    top: 5%;
  }
  .customized-liang .text {
    padding: 0 10% 40px;
  }
  .customized-sec2 .text {
    width: 90%;
    left: 5%;
  }
  .customized-sec2 .img {
    width: 100%;
    margin: 20px -4px 0 0;
  }
  .customized-sec2 .img .img-wp {
    padding: 4px;
  }
  .customized-sec3 .sec-right {
    width: 90%;
    float: none;
    margin: 0 auto;
  }
  .customized-sec3 .sec-right .img {
    height: 120px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .customized-sec3 .section-cont {
    display: flex;
    flex-direction: column;
  }
  .customized-sec3 .sec-left {
    width: 100%;
    position: static;
    order: 2;
    margin-top: 15px;
  }
  .customized-sec3 .sec-left h5 {
    font-size: 14px;
    padding: 0 5%;
    line-height: 24px;
  }
  .customized-sec3 .sec-left .img {
    margin-top: 10px;
    display: none;
  }
  .customized-sec4 .sec-left {
    width: 100%;
    float: none;
    padding: 0 5px;
    margin: 0;
  }
  .customized-sec4 .sec-left .img {
    padding: 0 5px;
  }
  .customized-sec4 .sec-left .img:nth-child(even) {
    top: 30px;
  }
  .customized-sec4 .sec-right {
    width: 100%;
    position: static;
    margin-top: 50px;
  }
  .customized-sec4 .sec-right .text {
    position: static;
    padding: 0 5%;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .customized-sec5 .sec-left {
    width: 90%;
    margin: 0 auto;
    float: none;
    display: flex;
    justify-content: space-between;
  }
  .customized-sec5 .sec-left .img {
    padding: 0;
    width: 48%;
  }
  .customized-sec5 .sec-right {
    position: static;
    width: 100%;
    margin-top: 15px;
  }
  .customized-sec5 .sec-right .text {
    position: static;
    padding: 0 5%;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
/* 门店查询
============================================================================ */
.store {
  height: 100%;
}
.store .left-form {
  width: 34%;
  font-size: 20px;
  padding-left: 3%;
  padding-right: 3%;
}
.store .left-form .page-back-btn {
  top: 2%;
  left: 3%;
  margin-top: 80px;
}
.store .text-logo {
  display: block;
  width: 148px;
  margin: 6% auto 28px;
  text-align: center;
}
.store .text-logo img {
  max-width: 100%;
}
.store .search-box {
  position: relative;
  padding-right: 134px;
  margin-bottom: 8px;
}
.store .search-box input {
  display: block;
  width: 100%;
  height: 44px;
  border: 1px solid #afafaf;
  padding: 0 20px;
  line-height: 42px;
  font-size: 20px;
}
.store .search-box .search-btn {
  display: block;
  width: 104px;
  height: 44px;
  border: 1px solid #afafaf;
  text-align: center;
  line-height: 42px;
  position: absolute;
  top: 0;
  right: 0;
  transition: .4s;
}
.store .search-box .search-btn:hover {
  border-color: #86661a;
  background: #86661a;
  color: #fff;
  transition: .4s;
}
.store .screen-box .screen-title {
  line-height: 44px;
  border-bottom: 1px solid #d6d6d6;
  cursor: pointer;
}
.store .screen-box .screen-title span {
  display: inline-block;
  vertical-align: top;
  width: 18px;
  height: 18px;
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrhAuEZrAkAAAAALytdB4224.png) no-repeat;
  background-size: contain;
  margin: 13px 0 0 10px;
  transition: .4s;
}
.store .screen-box .on-close span {
  transition: .4s;
  transform: rotate(180deg);
}
.store .screen-box .area-select {
  padding: 16px 0;
  border-bottom: 1px solid #d6d6d6;
}
.store .screen-box .radio-group {
  margin-bottom: 12px;
}
.store .screen-box .radio-group input {
  display: none;
}
.store .screen-box .radio-group input+label {
  display: block;
  position: relative;
  padding-left: 38px;
  line-height: 32px;
  cursor: pointer;
}
.store .screen-box .radio-group input+label i {
  display: block;
  width: 16px;
  height: 16px;
  border: 1px solid #000;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -8px;
}
.store .screen-box .radio-group input:checked+label i::before {
  display: block;
  content: '';
  width: 24px;
  height: 21px;
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrhAuEKjQEAAAAAKA8lg8079.png) no-repeat;
  background-size: contain;
  position: absolute;
  left: 0;
  bottom: 0;
}
.store .store-info {
  margin-top: 5px;
  border-top: 3px solid #d6d6d6;
  padding-top: 36px;
}
.store .store-info h3 {
  font-size: 32px;
  margin-bottom: 20px;
}
.store .store-info p {
  font-size: 18px;
  line-height: 30px;
}
.store .right-map {
  width: 66%;
  height: 100%;
}
.anchorBL {
  opacity: 0;
}
.store .store-container {
  position: relative;
}
.store .store-cont {
  padding: 0 40px;
  position: absolute;
  visibility: hidden;
  z-index: 1;
  transform: translateY(10px);
  opacity: 0;
  width: 100%;
  top: 0;
  left: 0;
}
.store .store-cont.active {
  visibility: visible;
  z-index: 3;
  transform: translateY(0);
  opacity: 1;
  transition: .4s;
}
.store .store-swiper {
  text-align: center;
}
.store .store-swiper .swiper-slide {
  overflow: hidden;
}
.store .store-cont .store-prev,
.store .store-cont .store-next {
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 50%;
  margin-top: -15px;
  z-index: 15;
}
.store .store-cont .store-prev {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgm6EGaHPAAAAANMms6c551.png);
  background-size: 100% 100%;
  left: 0;
}
.store .store-cont .store-prev:hover {
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrgpmEcK90AAAAAKcj71k289.png);
  background-size: 100% 100%;
}
.store .store-cont .store-next {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgmKEb-FQAAAAANLl0bE969.png);
  background-size: 100% 100%;
  right: 0;
}
.store .store-cont .store-next:hover {
  background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrgo6EAIV5AAAAAHuKEek735.png);
  background-size: 100% 100%;
}
@media screen and (max-width: 1440px) {
  .store .left-form {
    width: 36%;
    font-size: 18px;
  }
  .store .text-logo {
    width: 128px;
    margin-bottom: 22px;
  }
  .store .search-box {
    padding-right: 134px;
  }
  .store .search-box input {
    height: 40px;
    padding: 0 18px;
    line-height: 38px;
    font-size: 18px;
  }
  .store .search-box .search-btn {
    width: 104px;
    height: 40px;
    line-height: 38px;
  }
  .store .screen-box .screen-title {
    line-height: 40px;
  }
  .store .screen-box .screen-title span {
    margin: 11px 0 0 10px;
  }
  .store .screen-box .area-select {
    padding: 12px 0;
  }
  .store .screen-box .radio-group {
    margin-bottom: 8px;
  }
  .store .screen-box .radio-group input+label {
    padding-left: 32px;
    line-height: 28px;
  }
  .store .screen-box .radio-group input+label i {
    width: 14px;
    height: 14px;
    margin-top: -7px;
  }
  .store .screen-box .radio-group input:checked+label i::before {
    width: 20px;
    height: 18px;
  }
  .store .store-info {
    margin-top: 4px;
    border-width: 2px;
    ;
    padding-top: 24px;
  }
  .store .store-info h3 {
    font-size: 28px;
    margin-bottom: 16px;
  }
  .store .store-info p {
    font-size: 16px;
    line-height: 24px;
  }
  .store .right-map {
    width: 64%;
  }
}
@media screen and (max-width: 1366px) {
  .store .left-form {
    width: 40%;
    font-size: 16px;
  }
  .store .text-logo {
    width: 108px;
    margin: 2% auto 12px;
  }
  .store .search-box {
    padding-right: 120px;
  }
  .store .search-box input {
    height: 32px;
    padding: 0 15px;
    line-height: 30px;
    font-size: 16px;
  }
  .store .search-box .search-btn {
    width: 100px;
    height: 32px;
    line-height: 30px;
  }
  .store .screen-box .screen-title {
    line-height: 36px;
  }
  .store .screen-box .screen-title span {
    margin: 9px 0 0 10px;
  }
  .store .screen-box .area-select {
    padding: 8px 0;
  }
  .store .screen-box .radio-group {
    margin-bottom: 5px;
  }
  .store .screen-box .radio-group input+label {
    padding-left: 28px;
    line-height: 24px;
  }
  .store .store-info {
    margin-top: 2px;
    border-width: 2px;
    ;
    padding-top: 14px;
  }
  .store .store-info h3 {
    font-size: 24px;
    margin-bottom: 6px;
  }
  .store .store-info p {
    font-size: 14px;
    line-height: 22px;
  }
  .store .right-map {
    width: 60%;
  }
}
@media screen and (max-width: 992px) {
  .store .left-form {
    width: 50%;
  }
  .store .right-map {
    width: 50%;
  }
}
@media screen and (max-width: 768px) {
  .store {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .store .left-form {
    display: flex;
    flex-shrink: 0;
    width: 100%;
    flex-direction: column;
    font-size: 14px;
    padding-bottom: 20px;
  }
  .store .text-logo {
    display: none;
  }
  .store .search-box {
    margin-top: 16px;
  }
  .store .screen-box .area-select {
    display: flex;
    flex-wrap: wrap;
  }
  .store .screen-box .radio-group {
    width: 33.33%;
  }
  .store .right-map {
    width: 100%;
    height: 100%;
  }
}
.contact-popup {
  width: 82%;
  height: 800px;
  position: absolute;
  top: 50%;
  margin-top: -400px;
  left: 9%;
  background: #fff;
  padding: 3% 7.2% 0;
}
.contact-popup h3 {
  text-align: center;
  font-size: 32px;
  line-height: 48px;
  padding-bottom: 20px;
  border-bottom: 1px solid #cbcbcb;
}
.contact-popup .form-wp {
  width: 45%;
}
.contact-popup .form-group {
  position: relative;
  display: -ms-flexbox;
  -ms-flex-pack: justify;
  display: flex;
  justify-content: space-between;
  padding: 0 0 0 20px;
}
.contact-popup .form-group span {
  display: flex;
  line-height: 80px;
  font-size: 20px;
  margin-right: 14px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: .3s;
}
.contact-popup .form-group input {
  display: block;
  width: 100%;
  height: 80px;
  line-height: 80px;
  font-size: 20px;
}
.contact-popup .textarea {
  background: #e3e3e3;
  margin-top: 20px;
  padding: 20px;
  position: relative;
  display: -ms-flexbox;
  -ms-flex-pack: justify;
  display: flex;
  justify-content: space-between;
  outline: none;
}
.contact-popup .textarea span {
  display: flex;
  line-height: 36px;
  font-size: 20px;
  margin-right: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}
.contact-popup .textarea textarea {
  display: block;
  width: 100%;
  height: 220px;
  resize: none;
  background: none;
  outline: none;
  font-size: 20px;
  line-height: 36px;
}
.contact-popup .textarea .border {
  position: absolute;
  background: #8f7d4f;
}
.contact-popup .textarea .border1 {
  width: 0;
  height: 2px;
  transition: .2s .6s;
  left: 0;
  top: 0;
}
.contact-popup .textarea .border2 {
  width: 2px;
  height: 0;
  transition: .2s .4s;
  right: 0;
  top: 0;
}
.contact-popup .textarea .border3 {
  width: 0;
  height: 2px;
  transition: .2s .2s;
  right: 0;
  bottom: 0;
}
.contact-popup .textarea .border4 {
  width: 2px;
  height: 0;
  transition: .2s;
  left: 0;
  bottom: 0;
}
.contact-popup .btns {
  margin-top: 80px;
  text-align: center;
}
.contact-popup .btns a {
  display: inline-block;
  vertical-align: top;
  width: 212px;
  line-height: 56px;
  font-size: 22px;
  margin: 0 22px;
  color: #fff;
  border-radius: 8px;
  transition: .4s;
}
.contact-popup .btns .submit-btn {
  background: #c5b07b;
}
.contact-popup .btns .clear-btn {
  background: #c1c1c1;
}
.contact-popup .btns .chat-btn {
  background: #4c4c4c;
}
.contact-popup .btns a:hover {
  transition: .4s;
}
.contact-popup .btns .submit-btn:hover {
  background: #ad892f;
}
.contact-popup .btns .clear-btn:hover {
  background: #888;
}
.contact-popup .btns .chat-btn:hover {
  background: #111;
}
.contact-popup .form-tips {
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  -webkit-transform: translate3d(0, -50%, 0);
  -ms-transform: translate3d(0, -50%, 0);
  -moz-transform: translate3d(0, -50%, 0);
  -o-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  z-index: 11;
  text-align: center;
  display: none;
}
.contact-popup .form-tips span {
  display: inline-block;
  vertical-align: top;
  padding: 20px 36px;
  background: rgba(0, 0, 0, .6);
  border-radius: 8px;
  color: #fff;
  font-size: 20px;
  line-height: 30px;
  max-width: 500px;
  min-width: 252px;
}
.contact-popup .form-group .line {
  position: absolute;
  width: 100%;
  height: 2px;
  background: #d6d6d6;
  left: 0;
  bottom: 0;
}
.contact-popup .form-group .line::before {
  display: block;
  content: '';
  width: 0;
  height: 100%;
  background: #8f7d4f;
  transition: .3s;
}
.contact-popup .form-group.form-on .line::before {
  width: 100%;
  transition: .3s;
}
.contact-popup .form-group.form-on span {
  transform: translateY(0);
  transition: .3s;
  color: #8f7d4f;
}
.contact-popup .textarea-on .border1 {
  width: 100%;
  transition: .2s;
}
.contact-popup .textarea-on .border2 {
  height: 100%;
  transition: .2s .2s;
}
.contact-popup .textarea-on .border3 {
  width: 100%;
  transition: .2s .4s;
}
.contact-popup .textarea-on .border4 {
  height: 100%;
  transition: .2s .6s;
}
.contact-popup .textarea-on span {
  color: #8f7d4f;
}
.select-group {
  cursor: pointer;
}
.select-group input {
  cursor: pointer;
}
.select-group .select-drop {
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  padding-top: 5px;
  z-index: 11;
  opacity: 0;
  transform: translateY(20px);
  display: none;
  transition: .3s;
}
.select-group .select-drop.drop-show {
  opacity: 1;
  transform: translateY(0);
  transition: .3s;
}
.select-group .select-drop .scroll-view {
  background: #fff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
  border: 1px solid #eee;
}
.select-group .select-drop .scroll-view h4 {
  line-height: 48px;
  background: #c5b07b;
  font-size: 16px;
  color: #fff;
  padding: 0 20px;
}
.select-group .select-drop ul {
  max-height: 240px;
  overflow-y: auto;
}
.select-group .select-drop ul::-webkit-scrollbar {
  width: 4px;
  background: none;
}
.select-group .select-drop ul::-webkit-scrollbar-thumb {
  width: 4px;
  background: #c5b07b;
}
.select-group .select-drop ul::-moz-scrollbar {
  width: 4px;
  background: none;
}
.select-group .select-drop ul::-moz-scrollbar-thumb {
  width: 4px;
  background: #c5b07b;
}
.select-group .select-drop ul li {
  padding: 8px 20px;
  line-height: 24px;
  cursor: pointer;
}
.select-group .select-drop ul li:hover {
  background: #eee;
  transition: .4s;
}
.contact-popup input:-webkit-autofill {
  box-shadow: 0 0 0px 1000px white inset;
}
.popup-close {
  display: none;
}
@media screen and (max-width: 1440px) {
  .contact-popup {
    height: 600px;
    margin-top: -300px;
    padding: 2% 7.2% 0;
  }
  .contact-popup h3 {
    font-size: 24px;
    line-height: 36px;
    padding-bottom: 14px;
  }
  .contact-popup .form-group span {
    line-height: 64px;
    font-size: 18px;
    margin-right: 12px;
  }
  .contact-popup .form-group input {
    height: 64px;
    line-height: 64px;
    font-size: 18px;
  }
  .contact-popup .textarea {
    padding: 16px;
  }
  .contact-popup .textarea span {
    line-height: 30px;
    font-size: 18px;
    margin-right: 12px;
  }
  .contact-popup .textarea textarea {
    height: 200px;
    font-size: 18px;
    line-height: 30px;
  }
  .contact-popup .btns {
    margin-top: 48px;
  }
  .contact-popup .btns a {
    width: 180px;
    line-height: 44px;
    font-size: 20px;
    margin: 0 18px;
    border-radius: 6px;
  }
  .select-group .select-drop .scroll-view h4 {
    line-height: 44px;
    padding: 0 18px;
  }
  .select-group .select-drop ul {
    max-height: 220px;
  }
  .select-group .select-drop ul li {
    padding: 6px 18px;
  }
}
@media screen and (max-width: 1366px) {
  .contact-popup {
    height: 540px;
    margin-top: -270px;
    padding: 2% 7.2% 0;
  }
  .contact-popup h3 {
    font-size: 20px;
    line-height: 32px;
    padding-bottom: 12px;
  }
  .contact-popup .form-group span {
    line-height: 50px;
    font-size: 16px;
    margin-right: 10px;
  }
  .contact-popup .form-group input {
    height: 50px;
    line-height: 50px;
    font-size: 16px;
  }
  .contact-popup .textarea {
    padding: 14px;
  }
  .contact-popup .textarea span {
    line-height: 28px;
    font-size: 16px;
    margin-right: 10px;
  }
  .contact-popup .textarea textarea {
    height: 180px;
    font-size: 16px;
    line-height: 28px;
  }
  .contact-popup .btns {
    margin-top: 40px;
  }
  .contact-popup .btns a {
    width: 164px;
    line-height: 40px;
    font-size: 18px;
    margin: 0 15px;
    border-radius: 4px;
  }
  .select-group .select-drop .scroll-view h4 {
    line-height: 40px;
    padding: 0 15px;
  }
  .select-group .select-drop ul {
    max-height: 200px;
  }
  .select-group .select-drop ul li {
    padding: 4px 15px;
  }
}
@media screen and (max-width: 768px) {
  .popup-close {
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    background: url(//dfs.yun300.cn/group1/M00/05/2F/rBQBHVzrhHeEfjWYAAAAAAIMiVE696.png) no-repeat;
    background-size: contain;
    top: 16px;
    left: 16px;
  }
  .contact-popup {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 0 5%;
    margin-top: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
  }
  .contact-popup h3 {
    font-size: 18px;
    line-height: 24px;
    padding-bottom: 10px;
  }
  .contact-popup .form-wp {
    width: 100%;
  }
  .contact-popup .form-group {
    padding-left: 15px;
  }
  .contact-popup .form-group span {
    line-height: 40px;
    font-size: 14px;
    margin-right: 8px;
  }
  .contact-popup .form-group input {
    height: 40px;
    line-height: 40px;
    font-size: 14px;
  }
  .contact-popup .form-group .line {
    height: 1px;
  }
  .contact-popup .textarea {
    padding: 10px 15px;
  }
  .contact-popup .textarea span {
    line-height: 22px;
    font-size: 14px;
    margin-right: 8px;
  }
  .contact-popup .textarea textarea {
    height: 88px;
    font-size: 14px;
    line-height: 22px;
  }
  .contact-popup .btns {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
  }
  .contact-popup .btns a {
    display: block;
    width: 30%;
    line-height: 32px;
    font-size: 14px;
    margin: 0;
  }
  .select-group .select-drop .scroll-view h4 {
    line-height: 40px;
    padding: 0 15px;
  }
  .select-group .select-drop ul {
    max-height: 200px;
  }
  .select-group .select-drop ul li {
    padding: 4px 15px;
  }
}
.follow-popup {
  width: 82%;
  height: 800px;
  position: absolute;
  top: 50%;
  margin-top: -400px;
  left: 9%;
  background: #fff;
  padding: 210px 7.2% 0;
}
.follow-popup ul {
  width: 1110px;
  margin: 0 auto;
  text-align: center;
}
.follow-popup ul li {
  display: inline-block;
  width: 31%;
  text-align: center;
}
.follow-popup ul li img {
  width:73%;
}
.follow-popup ul li h4 {
  font-size: 34px;
  line-height: 50px;
  padding-top: 25px;
}
.follow-popup .text {
  text-align: center;
  font-size: 24px;
  color: #c5b07b;
  margin-top: 80px;
}
@media screen and (max-width: 1440px) {
  .follow-popup {
    height: 600px;
    margin-top: -300px;
    padding-top: 150px;
  }
  .follow-popup ul {
    width: 900px;
  }
  .follow-popup ul li {
    width: 30%;
  }
  .follow-popup ul li img {
    width: 73%;
  }
  .follow-popup ul li h4 {
    font-size: 28px;
    line-height: 44px;
    padding-top: 18px;
  }
  .follow-popup .text {
    font-size: 20px;
    margin-top: 60px;
  }
}
@media screen and (max-width: 1366px) {
  .follow-popup {
    height: 520px;
    margin-top: -260px;
    padding: 105px 0 0;
  }
  .follow-popup ul {
    width: 750px;
  }
  
  .follow-popup ul li h4 {
    font-size: 22px;
    line-height: 36px;
    padding-top: 14px;
  }
  .follow-popup .text {
    font-size: 18px;
    margin-top: 48px;
    line-height: 32px;
  }
}
@media screen and (max-width: 992px) {
  .follow-popup {
    width: 94%;
    left: 3%;
  }
}
@media screen and (max-width: 768px) {
  .follow-popup {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin-top: 0;
    padding: 0 5%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .follow-popup ul {
    width: 100%;
  }
  .follow-popup ul li {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .follow-popup ul li img {
    width: 120px;
  }
  .follow-popup ul li h4 {
    font-size: 16px;
    line-height: 24px;
    min-width: 120px;
    margin-left: 20px;
    text-align-last: left;
  }
  .follow-popup .text {
    margin-top: 24px;
  }
}
/* 隐私条款
============================================================================ */
.clause .news-cont p {
  line-height: 32px;
}
.page-back-btn {
  display: block;
  width: 50px;
  height: 50px;
  background: url(//dfs.yun300.cn/group1/M00/16/EC/rBQBG1zrhMOEEH9pAAAAAAIMiVE681.png);
  background-size: 100% 100%;
  position: absolute;
  left: 5%;
  top: 5%;
  transition: .4s;
}
.page-back-btn:hover {
  transition: .4s;
  transform: rotate(360deg);
}
.news-sec3 .page-back-btn {
  top: 0;
  left: 0;
}
.clause-popup {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 993;
  background: #fff;
  display: none;
}
.clause-popup .news-article {
  padding-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .page-back-btn {
    width: 30px;
    height: 30px;
  }
  .page-back-btn:hover {
    transition: .4s;
    transform: rotate(360deg);
  }
  .clause .news-cont p {
    line-height: 24px;
  }
}





/* ==========================================================================
   2019年6月12日新增样式,用于门店查询页面修改和新增页面
============================================================================ */

/* 门店查询-新增
============================================================================ */
.area-box .area-group{font-size: 14px;}
.area-box .area-group .radio-group{margin-bottom: 10px;}
.area-box .area-group .radio-group input{display: none;}
.area-box .area-group .radio-group input+label{display: block;position: relative;height: 44px;line-height: 24px;border-bottom: 1px solid #ababab;cursor: pointer;padding: 10px 20px 10px 52px;color: #2b2b2b;}
.area-box .area-group .radio-group input+label i{display: block;width: 12px;height: 12px;border: 1px solid #7d7d7d;position: absolute;left: 20px;top: 50%;margin-top: -6px;}
.area-box .area-group .radio-group input:checked+label i::before{display: block;content: '';width: 17px;height: 15px;background: url(//dfs.yun300.cn/group1/M00/17/37/rBQBHF0Ha1GEALazAAAAAKA8lg8281.png) no-repeat;background-size: contain;position: absolute;left: 0;bottom: 0;}
.area-box .area-group .radio-group input+label span{float: left;}
.area-box .area-group .radio-group input+label h5{float: right;color: #999;}
.area-box .area-cont{padding: 16px 0;display: none;height: 200px;}
.area-box .area-cont{padding: 0 20px;}
.area-box .area-cont ul li{padding: 15px 0 15px 32px;border-bottom: 1px solid #dcdcdc;line-height: 22px;cursor: pointer;}
.area-box .area-cont ul li:last-child{border: none;}
.area-box .area-cont ul li h4{transition: .4s;}
.area-box .area-cont ul li .p{padding-right: 20px;color: #999;transition: .4s;}
.area-box .area-cont ul li:hover h4,
.area-box .area-cont ul li:hover .p{color: #B49A5A;transition: .4s;}

.infoWindow{width: 460px;transform: translate(-50%,-100%);padding-bottom: 60px;}
.infoWindow .infoInner{background: #fff;padding: 20px;box-shadow: 0 4px 10px rgba(0, 0, 0, .2);}
.infoWindow .img{float: left;width: 160px;}
.infoWindow .img img{width: 100%;}
.infoWindow .text{width: 240px;float: right;}
.infoWindow .text h4{color: #000;line-height: 1;margin-bottom: 16px;}
.infoWindow .text .address{color: #999;line-height: 20px;padding-left: 20px;position: relative;margin-bottom: 12px;}
.infoWindow .text .address::before{display: block;content: '';width: 20px;height: 20px;position: absolute;left: 0;top: 0;background: url(//dfs.yun300.cn/group1/M00/17/35/rBQBG10Ha2yEV1SOAAAAAKcEA-k666.png) no-repeat left center;}
.infoWindow .text .tell p{float: left;color: #999;line-height: 20px;padding-left: 20px;position: relative;}
.infoWindow .text .tell p::before{display: block;content: '';width: 20px;height: 20px;position: absolute;left: 0;top: 0;background: url(//dfs.yun300.cn/group1/M00/17/37/rBQBHF0Ha4GEYRI7AAAAACMYPCs707.png) no-repeat left center;}
.infoWindow .text .tell a{float: right;line-height: 20px;padding: 0 16px;background: #b49a5a;border-radius: 4px;color: #fff;}

@media screen and (max-width: 1440px) {
    .area-box .area-group .radio-group{margin-bottom: 6px;}
    .area-box .area-group .radio-group input+label{height: 38px;line-height: 24px;cursor: pointer;padding: 7px 16px 7px 44px;}
    .area-box .area-group .radio-group input+label i{left: 16px;}
    .area-box .area-cont{padding: 14px 0;height: 200px;}
    .area-box .area-cont{padding: 0 16px;}
    .area-box .area-cont ul li{padding: 15px 0 15px 28px;}
    .area-box .area-cont ul li:last-child{border: none;}
    .area-box .area-cont ul li .p{padding-right: 16px;}
}

@media screen and (max-width: 1366px) {
    .area-box .area-group .radio-group{margin-bottom: 6px;}
    .area-box .area-group .radio-group input+label{height: 32px;line-height: 24px;cursor: pointer;padding: 4px 16px 4px 44px;}
    .area-box .area-group .radio-group input+label i{left: 16px;}
    .area-box .area-cont{padding: 14px 0;height: 150px;}
    .area-box .area-cont{padding: 0 16px;}
    .area-box .area-cont ul li{padding: 8px 0 8px 28px;}
    .area-box .area-cont ul li:last-child{border: none;}
    .area-box .area-cont ul li .p{padding-right: 16px;}
}

@media screen and (max-width: 1366px) {
    .area-box .area-group .radio-group{margin-bottom: 6px;}
    .area-box .area-group .radio-group input+label{height: 32px;line-height: 24px;cursor: pointer;padding: 4px 16px 4px 44px;}
    .area-box .area-group .radio-group input+label i{left: 16px;}
    .area-box .area-cont{padding: 14px 0;height: 150px;}
    .area-box .area-cont{padding: 0 16px;}
    .area-box .area-cont ul li{padding: 8px 0 8px 28px;}
    .area-box .area-cont ul li:last-child{border: none;}
    .area-box .area-cont ul li .p{padding-right: 16px;}
}

@media screen and (max-width: 500px) {
    .store .left-form{padding-bottom: 10px;}
    .store .search-box{padding-right: 110px;}
    .store .search-box input{font-size: 14px;}
    .store .search-box .search-btn{font-size: 14px;}
    .area-box .area-group{font-size: 12px;}
    .area-box .area-group .radio-group input+label{height: 28px;line-height: 24px;cursor: pointer;padding: 2px 16px 2px 44px;}
    .area-box .area-cont{height: 120px;}
    .area-box .area-cont ul li{line-height: 20px;}
}


/* 售后服务计划
============================================================================ */
.service-padding{padding-bottom: 0;}
.service{height: 100%;padding-top: 60px;background: url(//dfs.yun300.cn/group1/M00/17/37/rBQBHF0Ha6WEZb5AAAAAAEcWDF8743.jpg) no-repeat center center;background-size: cover;}
.service .service-wp{width: 1080px;margin: 0 auto;height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;}
.service .ser-title{padding-bottom: 36px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-ms-flex-negative: 0;flex-shrink: 0;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.service .ser-title h1{font-size: 48px;line-height: 72px;margin-bottom: 14px;}
.service .ser-title h5{font-size: 16px;line-height: 30px;}
.service .ser-cont{height: 100%;}
.service .ser-cont ul li h4{height: 50px;padding-top: 9px;border-bottom: 1px solid #b6b7bb;position: relative;padding: 9px 60px 0 76px;cursor: pointer;}
.service .ser-cont ul li h4 img{width: 30px;position: absolute;left: 28px;top: 14px;}
.service .ser-cont ul li h4 span{display: block;font-size: 16px;line-height: 40px;}
.service .ser-cont ul li h4 i{display: block;width: 14px;height: 14px;position: absolute;right: 30px;top: 22px;}
.service .ser-cont ul li h4 i::before,
.service .ser-cont ul li h4 i::after{display: block;content: '';width: 100%;height: 2px;background: #7d7d7d;position: absolute;top: 50%;left: 50%;margin: -1px 0 0 -7px;transition: .4s;}
.service .ser-cont ul li h4 i::after{transform: rotate(90deg);}
.service .ser-cont ul li.on h4 i::after{transform: rotate(0deg);transition: .4s;}
.service .ser-cont .text{height: 300px;padding: 20px 30px;display: none;}
.service .ser-cont .text .text-scroll{height: 100%;padding: 0 36px 0 16px;}
.service .ser-cont .text p{padding-left: 30px;line-height: 36px;position: relative;color: #848484;}
.service .ser-cont .text p::after{display: block;content: '';width: 4px;height: 4px;background: #434343;border-radius: 100%;position: absolute;left: 0;top: 16px;}

@media screen and (max-width: 1680px) {
    .service{padding-top: 50px;}
    .service .ser-title{padding-bottom: 28px;}
    .service .ser-title h1{font-size: 40px;line-height: 60px;margin-bottom: 12px;}
}

@media screen and (max-width: 1440px) {
    .service{padding-top: 40px;}
    .service .ser-title{padding-bottom: 20px;}
    .service .ser-title h1{font-size: 32px;line-height: 48px;margin-bottom: 10px;}
    .service .ser-cont .text{height: 240px;}
}

@media screen and (max-width: 1366px) {
    .service{padding-top: 20px;}
    .service .ser-title{padding-bottom: 10px;}
    .service .ser-title h1{font-size: 30px;line-height: 40px;margin-bottom: 10px;}
    .service .ser-title h5{font-size: 14px;line-height: 24px;}
    .service .ser-cont .text{height: 240px;}
    .service .ser-cont ul li h4{height: 40px;padding-top: 5px;}
    .service .ser-cont ul li h4 img{width: 24px;top: 10px;}
    .service .ser-cont ul li h4 span{font-size: 14px;line-height: 34px;}
    .service .ser-cont ul li h4 i{top: 15px;}
    .service .ser-cont .text{padding: 14px 30px;height: 180px;}
    .service .ser-cont .text p{line-height: 28px;}
    .service .ser-cont .text p::after{top: 12px;}
}

@media screen and (max-width: 1200px) {
    .service .service-wp{width: 900px;}
}

@media screen and (max-width: 992px) {
    .service .service-wp{width: 750px;}
}

@media screen and (max-width: 768px) {
    .service .service-wp{width: 92%;}
    .service .ser-title{padding-bottom: 6px;}
    .service .ser-title h1{font-size: 18px;line-height: 24px;margin-bottom: 4px;}
    .service .ser-title h5{text-align: center;font-size: 12px;line-height: 22px;padding: 0 10%;}
    .service .ser-cont ul li h4{padding: 5px 24px 0 32px;}
    .service .ser-cont ul li h4 img{left: 0;}
    .service .ser-cont ul li h4 i{right: 0;}
    .service .ser-cont .text{padding: 12px 0;}
    .service .ser-cont .text .text-scroll{padding: 0 10px 0 0;}
    .service .ser-cont .text p{padding-left: 16px;font-size: 12px;}
}


/* 企业荣誉
============================================================================ */
.honor-padding{padding-bottom: 0;}
.honor-page{height: 100%;background: url(//dfs.yun300.cn/group1/M00/17/37/rBQBHF0Ha8SEECaGAAAAAOX-Zbs457.jpg) no-repeat center top;background-size: cover;position: relative;}
.honor-page .stripe{position: absolute;width: 100%;left: 0;top: 48%;opacity: .9;z-index: 2;}
.honor-page .text-yu{width: 30%;position: absolute;top: 0;right: 0;z-index: 1;}
#honorSwiper{width: 1380px;height: 100%;margin: 0 auto;padding-top: 9.4%;z-index: 5;}
#honorSwiper .img{width: 460px;height: 312px;position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
#honorSwiper .img img{display: block;width: 100%;height: 100%;position: relative;z-index: 3;transition: .4s;transform: scale(0.6);-webkit-box-reflect: below 0px -webkit-linear-gradient(bottom, rgba(255,255,255,0.3) 0%, transparent 20%, transparent 100%);}
#honorSwiper .swiper-slide-active .img img{transform: scale(1);transition: .4s;padding: 20px;background: url(//dfs.yun300.cn/group1/M00/17/36/rBQBHV0Ha9yEHJtuAAAAALu5s2k250.png);background-size: 100% 100%;}
#honorSwiper .text{height: 160px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding-top: 32px;}
#honorSwiper .text h4{font-size: 18px;line-height: 32px;white-space: nowrap}
#honorSwiper .text h2{font-size: 18px;line-height: 32px;white-space: nowrap}
#honorSwiper .swiper-slide-active .text h4{font-size: 22px;line-height: 40px;transition: .3s;}
#honorSwiper .swiper-slide-active .text h2{font-size: 36px;line-height: 50px;color: #86651c;transition: .3s;}

.honor-btns{position: absolute;bottom: 8%;z-index: 11;left: 50%;margin-left: -119px;}

@media screen and (max-width: 1440px) {
    #honorSwiper{width: 1140px;padding-top: 9.4%;}
    #honorSwiper .img{width: 380px;height: 258px;}
    #honorSwiper .swiper-slide-active .img img{padding: 14px;}
    #honorSwiper .text{height: 150px;padding-top: 24px;}
    #honorSwiper .text h4{font-size: 16px;line-height: 24px;}
    #honorSwiper .text h2{font-size: 16px;line-height: 24px;}
    #honorSwiper .swiper-slide-active .text h4{font-size: 18px;line-height: 36px;}
    #honorSwiper .swiper-slide-active .text h2{font-size: 30px;line-height: 44px;}
    .honor-btns{margin-left: -112px;}
}

@media screen and (max-width: 1366px) {
    .honor-page .text-yu{width: 28%;}
    #honorSwiper{padding-top: 4%;}
    #honorSwiper .text{height: 120px;padding-top: 20px;}
    .honor-btns{bottom: 5%;}
}

@media screen and (max-width: 1200px) {
    #honorSwiper{width: 900px;padding-top: 9%;}
    #honorSwiper .img{width: 300px;height: 204px;}
    #honorSwiper .text h4{font-size: 14px;line-height: 22px;}
    #honorSwiper .text h2{font-size: 14px;line-height: 22px;}
    #honorSwiper .swiper-slide-active .text h4{font-size: 16px;line-height: 28px;}
    #honorSwiper .swiper-slide-active .text h2{font-size: 22px;line-height: 32px;}
}

@media screen and (max-width: 768px) {
    .honor-page .stripe{width: 800px;left: 50%;margin-left: -400px;top: 48%;}
    .honor-page .text-yu{width: 80%;top: 10%;right: -20%;}
    #honorSwiper{width: 90%;padding-top: 0;}
    #honorSwiper .item-box{height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
    #honorSwiper .img{width: 100%;max-width: 460px;}
    #honorSwiper .text{height: auto;}
    #honorSwiper .text h4,
    #honorSwiper .text h2{white-space: pre-wrap;font-size: 12px;}
    #honorSwiper .swiper-slide-active .text h4{font-size: 14px;line-height: 24px;}
    #honorSwiper .swiper-slide-active .text h2{font-size: 18px;line-height: 28px;}
} 

@media screen and (max-width: 500px) {
    #honorSwiper .img{max-width: 300px;}
    .honor-btns{bottom: 8%;}
}


/* 人才招聘
============================================================================ */
.recruit-page{background: url(//dfs.yun300.cn/group1/M00/17/36/rBQBHV0Has-EMTtnAAAAADl-sIo872.jpg) no-repeat center center;background-size: cover;position: relative;padding-top: 12%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.recruit-page .text-ping{display: block;width: 27%;position: absolute;top: 0;right: 0;z-index: 1;}
.recruit-page .recruit-menu{position: relative;z-index: 3;margin-bottom: 2%;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-negative: 0;flex-shrink: 0;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.recruit-page .recruit-menu a{display: block;position: relative;margin: 0 28px;width: 188px;height: 36px;transition: .4s;}
.recruit-page .recruit-menu a::after{display: block;content: '';width: 100%;height: 100%;box-sizing: border-box;border: 1px solid rgba(125, 125, 125, .2);top: 4px;left: 4px;position: absolute;transition: .4s;}
.recruit-page .recruit-menu a span{display: block;width: 100%;height: 100%;border: 1px solid #535353;text-align: center;line-height: 34px;font-size: 16px;position: relative;z-index: 3;transition: .4s;}
.recruit-page .recruit-menu a:hover,
.recruit-page .recruit-menu a.on{background: #b49a5a;transition: .4s;}
.recruit-page .recruit-menu a:hover span,
.recruit-page .recruit-menu a.on span{color: #fff;border-color: transparent;transition: .4s;}
.recruit-page .recruit-menu a:hover::after,
.recruit-page .recruit-menu a.on::after{width: calc(100% - 4px);height: calc(100% - 4px);top: 2px;left: 2px;border-color: #d2d2d2;transition: .4s;}
.recruit-page .recruit-wp{position: relative;height: 100%;width: 100%;}
.recruit-page .recruit-cont{position: absolute;width: 100%;height: 100%;top: 50px;left: 0;opacity: 0;z-index: 1;}
.recruit-page .recruit-cont.active{top: 0;opacity: 1;transition: .6s;z-index: 7;}

.recruit-page .recruit-swiper{width: 80%;margin: 0 auto;height: 100%;padding-bottom: 100px;}
.recruit-page .recruit-swiper .recruit-btns{position: absolute;bottom: 40px;left: 50%;margin-left: -119px;z-index: 11;}
.recruit-page .recruit-swiper .swiper-slide{padding: 0 20px;}
.recruit-page .recruit-swiper .item-box{display: block;position: relative;padding-top: 18px;}
.recruit-page .recruit-swiper .item-box .img{position: relative;overflow: hidden;}
.recruit-page .recruit-swiper .item-box .img img{width: 100%;transition: .4s;}
.recruit-page .recruit-swiper .item-box:hover .img img{transition: .4s;transform: scale(1.1);}
.recruit-page .recruit-swiper .item-box .text{padding-top: 32px;}
.recruit-page .recruit-swiper .item-box .text h4{font-size: 20px;line-height: 30px;margin-bottom: 10px;color: #2b2b2b;transition: .4s;}
.recruit-page .recruit-swiper .item-box .text p{font-size: 16px;line-height: 24px;color: #7d7d7d;}
.recruit-page .recruit-swiper .item-box:hover .text h4{color: #b49a5a;transition: .4s;}
.recruit-page .recruit-swiper .item-box .infos{position: absolute;width: 100%;top: 0;left: 0;background: url(//dfs.yun300.cn/group1/M00/17/37/rBQBHF0HaviEUiuNAAAAALx2ZCM233.jpg) no-repeat;background-size: cover;border-top: 6px solid #b49a5a;padding: 55px 15px;line-height: 28px;display: none;}
.recruit-page .recruit-swiper .item-box .infos h5{color: #000;}
.recruit-page .recruit-swiper .item-box .infos span{color: #7d7d7d;}
.recruit-page .recruit-swiper .item-box .infos p{color: #7d7d7d;}

@media screen and (max-width: 1680px) {
    .recruit-page .recruit-swiper{width: 84%;}
    .recruit-page .recruit-swiper .swiper-slide{padding: 0 18px;}
}

@media screen and (max-width: 1440px) {
    .recruit-page .recruit-swiper{width: 86%;}
    .recruit-page .recruit-swiper .recruit-btns{margin-left: -113px;}
    .recruit-page .recruit-swiper .swiper-slide{padding: 0 16px;}
    .recruit-page .recruit-swiper .item-box .text{padding-top: 24px;}
    .recruit-page .recruit-swiper .item-box .text h4{font-size: 18px;line-height: 28px;}
    .recruit-page .recruit-swiper .item-box .text p{font-size: 14px;line-height: 22px;}
    .recruit-page .recruit-swiper .item-box .infos{border-width: 5px;padding: 40px 15px;line-height: 24px;font-size: 14px;}
}

@media screen and (max-width: 1366px) {
    .recruit-page{padding-top: 10%;}
    .recruit-page .recruit-menu{margin-bottom: 3.6%;}
    .recruit-page .recruit-swiper .recruit-btns{bottom: 20px;}
    .recruit-page .recruit-swiper .item-box .text{padding-top: 20px;}
    .recruit-page .recruit-swiper .item-box .text h4{margin-bottom: 6px;}
    .recruit-page .recruit-swiper .item-box .infos{border-width: 4px;padding: 20px 12px;line-height: 22px;font-size: 12px;}
}

@media screen and (max-width: 1200px) {
    .recruit-page .recruit-swiper .item-box{height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: stretch;}
}

@media screen and (max-width: 768px) {
    .recruit-page{padding-top: 30%;}
    .recruit-page .text-ping{width: 80%;top: 10%;right: -20%;}
    .recruit-page .recruit-menu a{margin: 0 15px;width: 140px;}
    .recruit-page .recruit-swiper .swiper-slide{padding: 0 10px;}
    .recruit-page .recruit-swiper .item-box .infos{top: 50%;transform: translateY(-50%);line-height: 30px;padding: 30px 12px;}
}

@media screen and (max-width: 500px) {
    .recruit-page{padding-top: 30%;}
    .recruit-page .recruit-menu{width: 90%;}
    .recruit-page .recruit-menu a{width: 100%;margin: 0 5px;height: 28px;}
    .recruit-page .recruit-menu a span{line-height: 26px;font-size: 12px;}
    .recruit-page .recruit-swiper{width: 90%;}
    .recruit-page .recruit-swiper .swiper-slide{padding: 0 5px;}
    .recruit-page .recruit-swiper .item-box .infos{line-height: 24px;padding: 24px 12px;}
}

#fp-nav{border-right: 1px solid #b99a4f;}
/*#fp-nav::after{display: block;content: '';width: 30px;height: 1px;background: #b99a4f;position: absolute;left: 0;bottom: 0;}
*/
#fp-nav ul li{width: 36px;height: 50px;margin: 0;padding-right: 6px;}
#fp-nav ul li a{display: block;width: 30px;height: 50px;position: relative;padding-top: 10px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: end;-ms-flex-align: end;align-items: flex-end;}
#fp-nav ul li a span{width: 10px;height: 20px;}
#fp-nav ul li a span::before,
#fp-nav ul li a span::after{display: block;content: '';height: 10px;box-sizing: border-box;border-top: 1px solid #b99a4f;}
#fp-nav ul li .fp-sr-only{position: static;color: rgba(255,255,255,0);font-size: 0;}
#fp-nav ul li a::before{display: block;content: '';width: 30px;height: 1px;background: #b99a4f;position: absolute;top: 0;left: 0;}
#fp-nav ul li a.active::before{width: 32px;height: 22px;background: url(//dfs.yun300.cn/group1/M00/17/36/rBQBHV0Hax-EZVk_AAAAAM2BqoA804.png) no-repeat center center;background-size: contain;top: -14px;left: -8px;}
#fp-nav ul li:last-child{height:0px;}
#fp-nav ul li:last-child .fp-sr-only{display: none;}
#fp-nav ul li:last-child  a span{display: none;}

.recruit-con{margin-bottom: 2%;}
.con_item{margin: 0 auto ;line-height: 34px;font-size: 16px;display: none;}
.con_item.active{display: block;}