.white {
  color: #cacaca;
}

.lightwhite {
  color: #fff;
}

.gray1 {
  color: #333;
}

.gray2 {
  color: #ccc;
}

.gray3 {
  color: #666;
}

.grey1 {
  color: #d3d3d3;
}

.grey2 {
  color: #999;
}

.grey3 {
  color: #aaa;
}

.black {
  color: #000;
}

.black2 {
  color: #2D2D2D;
}

.red {
  color: #BE1E21;
}

.f16 {
  font-size: 0.66rem;
}

.f18 {
  font-size: 0.75rem;
}

.f20, .official .choice .container .item .en {
  font-size: 0.83rem;
}

.f22, .official .online_order .title_bj .concept, .official .advantage .concept, .official .choice .concept, .official .design .catering .title .more, .official .design .coffee .title .more, .official .design .hotle .title .more, .official .design .complex .title .more, .official .trends .trend .box .slide_trend .container .content .txt {
  font-size: 0.9rem;
}

.f24, .official .banner .system_banner .order, .official .founder .content .details, .official .advantage .container .item span, .official .choice .content .box, .official .design .catering .container .item .project, .official .design .coffee .container .item .project, .official .design .hotle .container .item .project, .official .design .complex .container .item .project, .official .tab_show .tabs_container .container .content .item .project {
  font-size: 1rem;
}

.f26, .official .kind .content .item .icon, .official .founder .order, .official .choice .container .item .discribe, .official .choice .illustrate, .official .tab_show .tabs_container .more, .official .trends .trend .box .slide_trend .container .content .details, .official .trends .more {
  font-size: 1.1rem;
}

.f27 {
  font-size: 1.125rem;
}

.f28, .official .founder .content .subtitle, .official .tab_show .tabs_container .tab_nav .tab, .official .trends .trend .box .slide_trend .container .content .subtitle, .official .trends .trend .tab_bar .swiper-pagination-bullet .tab, .official .trends .trend .tab_bar .swiper-pagination-bullet-active .tab {
  font-size: 1.16rem;
}

.f30, .official .nav_sidebar .container .item .nav_name {
  font-size: 1.25rem;
}

.f32 {
  font-size: 1.33rem;
}

.f33 {
  font-size: 1.375rem;
}

.f34 {
  font-size: 1.4rem;
}

.f36, .official .online_order .title_bj .caption {
  font-size: 1.5rem;
}

.f38 {
  font-size: 1.58rem;
}

.f40 {
  font-size: 1.66rem;
}

.f42, .official .design .catering .title, .official .design .coffee .title, .official .design .hotle .title, .official .design .complex .title, .official .tab_show .tabs_container .title {
  font-size: 1.75rem;
}

.f48, .official .founder .title, .official .advantage .title, .official .choice .title, .official .customer .title, .official .trends .title {
  font-size: 2rem;
}

.f100 {
  font-size: 4.16rem;
}

.bg1 {
  background-color: #BE1E21;
}

.bg2 {
  background-color: #373C42;
}

.bg3 {
  background-color: #FFB401;
}

.bg4 {
  background-color: #fff;
}

.bg5 {
  background-color: #F5F5F5;
}

.bg6 {
  background-color: #1B1B1B;
}

.bg7 {
  background-color: #6C0137;
}

.bg8 {
  background-color: #03446E;
}

.bg9 {
  background-color: #9D5F4A;
}

.bg10 {
  background-color: #0A6568;
}

.jx-block {
  display: block;
}

.jx-inline {
  display: inline;
}

.jx-middle {
  vertical-align: middle;
}

.jx-inlineB {
  display: inline-block;
}

.jx-none {
  display: none;
}

.jx-center {
  text-align: center;
}

.jx-auto, .official .kind .content, .official .online_order .title_bj, .official .advantage .container, .official .choice .content .box, .official .choice .illustrate, .official .design .catering .title, .official .design .catering .container, .official .design .coffee .title, .official .design .coffee .container, .official .design .hotle .title, .official .design .hotle .container, .official .design .complex .title, .official .design .complex .container, .official .tab_show .tabs_container .container .content, .official .tab_show .tabs_container .more, .official .customer .swiper-client .box, .official .trends .trend .box .slide_trend .container, .official .trends .more, .official .nav_sidebar .container {
  margin: 0 auto;
}

.jx-hidden, .official, .official .banner, .official .kind, .official .online_order, .official .founder, .official .advantage, .official .choice, .official .choice .content, .official .design, .official .design .catering, .official .design .coffee, .official .design .hotle, .official .design .complex, .official .tab_show, .official .tab_show .tabs_container, .official .tab_show .tabs_container .tab_nav, .official .tab_show .tabs_container .container, .official .customer, .official .trends, .official .nav_sidebar {
  overflow: hidden;
}

.jx-visible {
  overflow: visible;
}

.jx-repeat {
  background: no-repeat;
}

.jx-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

body {
  background: #f9f9f9;
}

.official {
  width: 100%;
  height: auto;
  background:#f5f5f5;
  padding-bottom:1.2rem;
}

.official .banner {
  width: 100%;
  height: auto;
}

.official .banner .system_banner {
  width: 100%;
  height: 280px;
}

.official .banner .system_banner img {
  width: 100%;
  height: 280px;
}

.official .banner .system_banner .order {
  position: absolute;
  right: auto;
  bottom: 4.375rem;
  left: 50%;
  background-color:#BE1E21;
  color:  #fff;
  width: 9.33rem;
  height: 2.08rem;
  line-height: 2.20rem;
  border-radius: .16rem;
  margin-left: -4.665rem;
  text-align: center;
}

.official .banner .system_banner .swiper-pagination-bullets .swiper-pagination-bullet {
  width: 0.66rem;
  height: 0.66rem;
  background: rgba(255, 255, 255, 0.4);
  opacity: 1;
}

.official .banner .system_banner .swiper-pagination-bullets .swiper-pagination-bullet-active {
  width: 0.66rem;
  height: 0.66rem;
  background-color: #fff;
}

.official .kind {
  width: 100%;
  height: auto;
  background-color: #fff;
  color: #000;
}

.official .kind .content {
  width: 85%;
  height: auto;
  display: flex;
  justify-content: space-between;
  padding: 20px 0 22px 0;
}

.official .kind .content .item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0;
}

/*.official .kind .content .item:first-child img {
  width: 2.375rem;
  height: 2.3rem;
}

.official .kind .content .item:nth-child(2) img {
  width: 2.45rem;
  height: 2.3rem;
}

.official .kind .content .item:nth-child(3) img {
  width: 2.58rem;
  height: 2.2rem;
}*/

.official .kind .content .item:last-child img {
  width: 26px;
  height: 28px;
}

.official .kind .content .item .icon {
  line-height: 1;
  padding-top: 12px;
  font-size: 14px;
}

.official .online_order {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  margin-top: .5rem;
  padding-top: 1.125rem;
}

.official .online_order .title_bj {
  width: 28.75rem;
  height: 7.95rem;
  color: #fff;
  background: url("../img/form-bj.png") no-repeat 50% 50%/100% 100%;
  margin-bottom: .91rem;
  border-radius: .8rem .8rem 0 0;
}

.official .online_order .title_bj .caption {
  line-height: 1;
  padding-top: 2.2rem;
  text-align: center;
  font-weight: bold;
  letter-spacing: .1rem;
}

.official .online_order .title_bj .concept {
  line-height: 1;
  padding: 0.79rem 0 2.66rem 0;
  text-align: center;
}

.official .online_order .form-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.official .online_order .form-content .form-type1 {
  width: 28.75rem;
  height: 3.7rem;
  outline: none;
  border: 0.1rem solid #bebebe;
  border-radius: .5rem;
  margin-bottom: .83rem;
  color: #666;
}

.official .online_order .form-content .form-type1 input {
  width: 100%;
  height: 100%;
  background: none;
  border: 0;
  padding-left: 3.25rem;
  font-size: 1.25rem;
}

.official .online_order .form-content .form-type1:first-child {
  position: relative;
}

.official .online_order .form-content .form-type1:first-child:before {
  content: '';
  width: 1.83rem;
  height: 2rem;
  position: absolute;
  top: 0.8rem;
  left: 1.5rem;
  background: url("../img/icon-me.png") no-repeat 50% 50%/1.83rem, 2rem;
}

.official .online_order .form-content .form-type1:nth-child(2) {
  position: relative;
}

.official .online_order .form-content .form-type1:nth-child(2):before {
  content: '';
  width: 1.25rem;
  height: 2rem;
  position: absolute;
  top: 0.8rem;
  left: 1.8rem;
  background: url("../img/icon-tel.png") no-repeat 50% 50%/1.25rem, 2rem;
}

.official .online_order .form-content .form-type2 {
  display: flex;
  justify-content: space-between;
  width: 28.75rem;
  margin-bottom: 0.91rem;
}

.official .online_order .form-content .form-type2 .form-set {
  display: flex;
  width: 14rem;
  height: 3.7rem;
  border-radius: 0.58rem;
  border: 0.1rem solid #bebebe;
}

.official .online_order .form-content .form-type2 .form-set input {
  width: 100%;
  height: 100%;
  background: none;
  border: 0;
  font-size: 0.26rem;
  color: #666;
  font-size: 1.25rem;
  text-indent: .7em;
}

.official .online_order .form-content .form-area {
  display: flex;
  text-indent: 0.6em;
  width: 28.75rem;
  height: 9.7rem;
  outline: none;
  resize: none;
  margin-bottom: 1.5rem;
  border-radius: 0.58rem;
  border: 0.1rem solid #bebebe;
}

.official .online_order .form-content .form-area textarea {
  width: 21.5rem;
  background: transparent;
  font-size: 1.25rem;
  margin-top:0;
  line-height: 1.3;
  font-family: "pingfang";
  padding-left: .8rem;
}

.official .online_order .form-content .btn {
  display: flex;
  justify-content: center;
  width: 28.75rem;
  border-radius: 0.4rem;
  background: #BE1E21;
  font-size: 1.41rem;
  color: #fff;
  line-height: 1;
  font-family: "pingfang";
  padding: 1.08rem 0 1.25rem 0;
  letter-spacing: .1rem;
}

.official .online_order .form-content .explain {
  display: flex;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
  transform: scale(0.83);
  color: #999;
  padding: 1.3rem 0 1.7rem 0;
}

.official .founder {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
  color: #333;
  padding-bottom: 2.3rem;
  margin-bottom: .5rem;
  border-top: 0.1rem solid #d3d3d3;
}

.official .founder .title {
  display: flex;
  line-height: 1;
  padding: 3.3rem 0 2.5rem 0;
}

.official .founder .title em {
  color: #BE1E21;
}

.official .founder .photo {
  display: flex;
  width: 100%;
  height: 38rem;
}

.official .founder .content {
  display: flex;
  flex-direction: column;
  width: 28.125rem;
  height: auto;
}

.official .founder .content .subtitle {
  line-height: 1;
  color: #333;
  padding: 2.3rem 0 0 0;
  text-align:center;
}

.official .founder .content .details {
  line-height: 1.8;
  color: #666;
  text-align: justify;
  padding: 2rem 0 3rem 0;
}

.official .founder .order {
  width: 11.7rem;
  height: 2.7rem;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  color: #BE1E21;
  border: 0.1rem solid #BE1E21;
  /*border-radius: .3rem;*/
}

.official .advantage {
  width: 100%;
  height: auto;
  background: #fff;
  margin-top: .5rem;
}

.official .advantage .title {
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: 3.3rem 0 0 0;
  position: relative;
}

.official .advantage .title:after {
  content: '';
  width: 2.16rem;
  height: 0.1rem;
  background: #BE1E21;
  position: absolute;
  top: 6rem;
  left: 50%;
  margin-left: -1.08rem;
}

.official .advantage .title em {
  color: #BE1E21;
}

.official .advantage .concept {
  width: 23.75rem;
  line-height: 1.5;
  color: #666;
  text-align: center;
  padding: 1.25rem 0 2.08rem 0;
  margin: auto;
}

.official .advantage .container {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 28.3rem;
  padding-bottom: .8rem;
}

.official .advantage .container .item {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin-bottom: .83rem;
  box-shadow: 0.2rem 0.2rem 0.5rem rgba(0, 0, 0, 0.3);
}

.official .advantage .container .item span {
  line-height: 1;
}

.official .advantage .container .item span:last-child {
  padding-top: .5rem;
}


.official .advantage .container .item:first-child {
  position: relative;
  background: url("../img/ad_bj1.jpg") no-repeat 50% 50%/120% 120%;
}


.official .advantage .container .item:first-child:after {
  content: '';
  width: 5.6rem;
  height: 5.6rem;
  border: 0.1rem solid #fff;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  border-radius: 50%;
}

.official .advantage .container .item:nth-child(2) {
  background: url("../img/ad_bj2.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:nth-child(3) {
  position: relative;
  background: url("../img/ad_bj3.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:nth-child(3):after {
  content: '';
  width: 5.6rem;
  height: 5.6rem;
  border: 0.1rem solid #fff;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  border-radius: 50%;
}


.official .advantage .container .item:nth-child(4) {
  background: url("../img/ad_bj4.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:nth-child(5) {
  background: url("../img/ad_bj5.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:nth-child(6) {
  position: relative;
  background: url("../img/ad_bj6.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:nth-child(6):after {
  content: '';
  width: 5.6rem;
  height: 5.6rem;
  border: 0.1rem solid #fff;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  border-radius: 50%;
}


.official .advantage .container .item:nth-child(7) {
  background: url("../img/ad_bj7.jpg") no-repeat 50% 50%/120% 120%;
}

.official .advantage .container .item:last-child {
  position: relative;
  background: url("../img/ad_bj8.jpg") no-repeat 50% 50%/120% 120%;
}


.official .advantage .container .item:last-child:after {
  content: '';
  width: 5.6rem;
  height: 5.6rem;
  border: 0.1rem solid #fff;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  border-radius: 50%;
}

.official .choice {
  width: 100%;
  height: auto;
  border-top: 0.1rem solid #d3d3d3;
  background: #fff;
}

.official .choice .title {
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: 3.3rem 0 0 0;
  position: relative;
}

.official .choice .title:after {
  content: '';
  width: 2.16rem;
  height: 0.1rem;
  background: #BE1E21;
  position: absolute;
  top: 6rem;
  left: 50%;
  margin-left: -1.08rem;
}

.official .choice .title em {
  color: #BE1E21;
}

.official .choice .concept {
  width: 23.75rem;
  line-height: 1.5;
  color: #666;
  text-align: center;
  padding: 1.25rem 0 1.5rem 0;
  margin: auto;
}

.official .choice .content {
  width: 100%;
  height: 20.58rem;
  background: url("../img/choice_bj.jpg") no-repeat 47% 50%;
}

.official .choice .content .box {
  width: 27.75rem;
  height: 15.25rem;
  background: url("../img/choice_mask.png") no-repeat 50% 50%/100% 100%;
  line-height: 1.5;
  text-align: center;
  margin-top: 2.75rem;
  padding: 4rem 3.25rem 0 3.25rem;
  box-sizing: border-box;
}

.official .choice .container {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.official .choice .container .item {
  width: 25%;
  height: 6.33rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
}

.official .choice .container .item .en {
  display: flex;
  line-height: 1;
  padding-top: 1.5rem;
  padding: 1.5rem 0 0.5rem 0;
}

.official .choice .container .item .discribe {
  width: 6.5rem;
  display: flex;
  justify-content: center;
  line-height: 1.3;
}

.official .choice .container .item:first-child {
  background: #6C0137;
}

.official .choice .container .item:nth-child(2) {
  background: #03446E;
}

.official .choice .container .item:nth-child(3) {
  background: #9D5F4A;
}

.official .choice .container .item:last-child {
  background: #0A6568;
}

.official .choice .illustrate {
  width: 26.83rem;
  line-height: 1.5;
  padding: 1rem 0 2rem 0;
  text-align: justify;
}

.official .design {
  width: 100%;
  height: auto;
  background: #fff;
  margin-top: .5rem;
}

.official .design .catering {
  width: 100%;
  height: auto;
  border-bottom: 0.1rem solid #d3d3d3;
}

.official .design .catering .title {
  position: relative;
  text-align: center;
  padding-top: 2.9rem;
}

.official .design .catering .title .more {
  color: #666;
  position: absolute;
  right: 0.9rem;
  bottom: 0;
}

.official .design .catering .container {
  width: 95.7%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-top: 2.08rem;
  padding-bottom: .33rem;
}

.official .design .catering .container .item {
  width: 49%;
  height: 130px;
  display: flex;
  align-items: flex-end;
  margin-bottom: .66rem;
}

.official .design .catering .container .item .project {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 2.08rem;
  line-height: 2.08rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
}

/*.official .design .catering .container .item:first-child {
  background: url("../img/catering1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .catering .container .item:nth-child(2) {
  background: url("../img/catering2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .catering .container .item:nth-child(3) {
  background: url("../img/catering3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .catering .container .item:last-child {
  background: url("../img/catering4.jpg") no-repeat 50% 50%/100% 100%;
}*/

.official .design .coffee {
  width: 100%;
  height: auto;
  border-bottom: 0.1rem solid #d3d3d3;
}

.official .design .coffee .title {
  position: relative;
  text-align: center;
  padding-top: 2.08rem;
}

.official .design .coffee .title .more {
  color: #666;
  position: absolute;
  right: 0.9rem;
  bottom: 0;
}

.official .design .coffee .container {
  width: 95.7%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-top: 2.08rem;
  padding-bottom: .33rem;
}

.official .design .coffee .container .item {
  width: 49%;
  height: 130px;
  display: flex;
  align-items: flex-end;
  margin-bottom: .66rem;
}

.official .design .coffee .container .item .project {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 2.08rem;
  line-height: 2.08rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
}

.official .design .coffee .container .item:first-child {
  background: url("../img/coffee1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .coffee .container .item:nth-child(2) {
  background: url("../img/coffee2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .coffee .container .item:nth-child(3) {
  background: url("../img/coffee3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .coffee .container .item:last-child {
  background: url("../img/coffee4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .hotle {
  width: 100%;
  height: auto;
  border-bottom: 0.1rem solid #d3d3d3;
}

.official .design .hotle .title {
  position: relative;
  text-align: center;
  padding-top: 2.08rem;
}

.official .design .hotle .title .more {
  color: #666;
  position: absolute;
  right: 0.9rem;
  bottom: 0;
}

.official .design .hotle .container {
  width: 95.7%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-top: 2.08rem;
  padding-bottom: .33rem;
}

.official .design .hotle .container .item {
  width: 49%;
  height: 130px;
  display: flex;
  align-items: flex-end;
  margin-bottom: .66rem;
}

.official .design .hotle .container .item .project {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 2.08rem;
  line-height: 2.08rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
}

.official .design .hotle .container .item:first-child {
  background: url("../img/hotle1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .hotle .container .item:nth-child(2) {
  background: url("../img/hotle2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .hotle .container .item:nth-child(3) {
  background: url("../img/hotle3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .hotle .container .item:last-child {
  background: url("../img/hotle4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .complex {
  width: 100%;
  height: auto;
}

.official .design .complex .title {
  position: relative;
  text-align: center;
  padding-top: 2.08rem;
}

.official .design .complex .title .more {
  color: #666;
  position: absolute;
  right: 0.9rem;
  bottom: 0;
}

.official .design .complex .container {
  width: 95.7%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-top: 2.08rem;
}

.official .design .complex .container .item {
  width: 49%;
  height: 130px;
  display: flex;
  align-items: flex-end;
  margin-bottom: .66rem;
}

.official .design .complex .container .item .project {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 2.08rem;
  line-height: 2.08rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
}

.official .design .complex .container .item:first-child {
  background: url("../img/complex1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .complex .container .item:nth-child(2) {
  background: url("../img/complex2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .complex .container .item:nth-child(3) {
  background: url("../img/complex3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .design .complex .container .item:last-child {
  background: url("../img/complex4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show {
  width: 100%;
  height: auto;
  background:#f5f5f5;
}

.official .tab_show .tabs_container {
  padding-bottom: 1.9rem;
  margin-bottom: .5rem;
  width: 100%;
  height: auto;
  background: #fff;
}

.official .tab_show .tabs_container .title {
  line-height: 1;
  padding: 2.33rem 0 1.25rem 0;
  text-align: center;
}

.official .tab_show .tabs_container .tab_nav {
  display: flex;
  justify-content: space-between;
  border-top: 0.1rem solid #d3d3d3;
  border-bottom: 0.1rem solid #d3d3d3;
}

.official .tab_show .tabs_container .tab_nav .tab {
  width: 25%;
  display: flex;
  justify-content: center;
  padding: 0.5rem 0 0.5rem 0;
  margin: 0.66rem auto 0.66rem auto;
  line-height: 1;
  color: #666;
  border-right: 0.1rem solid #d3d3d3;
}

.official .tab_show .tabs_container .tab_nav .tab:last-child {
  border-right: none;
}

.official .tab_show .tabs_container .tab_nav .tab_active {
  margin: 0;
  padding: 0;
  height: 3.51rem;
  line-height: 3.51rem;
  background: #BE1E21;
  background-color: #BE1E21;
  color: #fff;
  border-right: none;
}

.official .tab_show .tabs_container .container {
  width: 100%;
  height: auto;
}

.official .tab_show .tabs_container .container .content {
  width: 95.7%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 1.9rem;
  padding-top: .66rem;
}

.official .tab_show .tabs_container .container .content .item {
  width: 49%;
  height: 130px;
  display: flex;
  align-items: flex-end;
  margin-bottom: .66rem;
}

.official .tab_show .tabs_container .container .content .item .project {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 2.08rem;
  line-height: 2.08rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
}

/*.official .tab_show .tabs_container .container .content .item:first-child {
  background: url("../img/office1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content .item:nth-child(2) {
  background: url("../img/office2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content .item:nth-child(3) {
  background: url("../img/office3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content .item:last-child {
  background: url("../img/office4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(2) .item:first-child {
  background: url("../img/internet1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(2) .item:nth-child(2) {
  background: url("../img/internet2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(2) .item:nth-child(3) {
  background: url("../img/internet3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(2) .item:last-child {
  background: url("../img/internet4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(3) .item:first-child {
  background: url("../img/bar1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(3) .item:nth-child(2) {
  background: url("../img/bar2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(3) .item:nth-child(3) {
  background: url("../img/bar3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:nth-child(3) .item:last-child {
  background: url("../img/bar4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:last-child .item:first-child {
  background: url("../img/club1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:last-child .item:nth-child(2) {
  background: url("../img/club2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:last-child .item:nth-child(3) {
  background: url("../img/club3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container .container .content:last-child .item:last-child {
  background: url("../img/club4.jpg") no-repeat 50% 50%/100% 100%;
}*/

.official .tab_show .tabs_container .more {
  width: 11.7rem;
  height: 2.7rem;
  line-height: 2.44rem;
  display: flex;
  justify-content: center;
  border: 0.1rem solid #BE1E21;
  /*border-radius: .3rem;*/
  color: #BE1E21;
}

/*.official .tab_show .tabs_container:nth-child(2) .content:first-child .item:first-child {
  background: url("../img/homestay1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:first-child .item:nth-child(2) {
  background: url("../img/homestay2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:first-child .item:nth-child(3) {
  background: url("../img/homestay3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:first-child .item:last-child {
  background: url("../img/homestay4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(2) .item:first-child {
  background: url("../img/town1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(2) .item:nth-child(2) {
  background: url("../img/town2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(2) .item:nth-child(3) {
  background: url("../img/town3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(2) .item:last-child {
  background: url("../img/town4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(3) .item:first-child {
  background: url("../img/country1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(3) .item:nth-child(2) {
  background: url("../img/country2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(3) .item:nth-child(3) {
  background: url("../img/country3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:nth-child(3) .item:last-child {
  background: url("../img/country4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:last-child .item:first-child {
  background: url("../img/sight1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:last-child .item:nth-child(2) {
  background: url("../img/sight2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:last-child .item:nth-child(3) {
  background: url("../img/sight3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:nth-child(2) .content:last-child .item:last-child {
  background: url("../img/sight4.jpg") no-repeat 50% 50%/100% 100%;
}*/

.official .tab_show .tabs_container:last-child {
  margin-bottom: 0;
}

.official .tab_show .tabs_container:last-child .tab_nav .tab {
  width: 33.33%;
}

/*.official .tab_show .tabs_container:last-child .content:first-child .item:first-child {
  background: url("../img/container1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:first-child .item:nth-child(2) {
  background: url("../img/container2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:first-child .item:nth-child(3) {
  background: url("../img/container3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:first-child .item:last-child {
  background: url("../img/container4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(2) .item:first-child {
  background: url("../img/soft1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(2) .item:nth-child(2) {
  background: url("../img/soft2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(2) .item:nth-child(3) {
  background: url("../img/soft3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(2) .item:last-child {
  background: url("../img/soft4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(3) .item:first-child {
  background: url("../img/vi1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(3) .item:nth-child(2) {
  background: url("../img/vi2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(3) .item:nth-child(3) {
  background: url("../img/vi3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:nth-child(3) .item:last-child {
  background: url("../img/vi4.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:last-child .item:first-child {
  background: url("../img/sight1.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:last-child .item:nth-child(2) {
  background: url("../img/sight2.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:last-child .item:nth-child(3) {
  background: url("../img/sight3.jpg") no-repeat 50% 50%/100% 100%;
}

.official .tab_show .tabs_container:last-child .content:last-child .item:last-child {
  background: url("../img/sight4.jpg") no-repeat 50% 50%/100% 100%;
}*/

.official .customer {
  width: 100%;
  height: 17.4rem;
  background: url("../img/customer_bj.jpg") no-repeat 50% 50%/100% 100%;
  padding-bottom: 1.75rem;
}

.official .customer .title {
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: 2.5rem 0 2.08rem 0;
  color: #fff;
}

.official .customer .title em {
  color: #BE1E21;
}

.official .customer .swiper-client {
  position: relative;
}

.official .customer .swiper-client .box {
  width: 22.25rem;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-rows: 2.58rem 2.58rem 2.58rem;
  grid-gap: .75rem;
}

.official .customer .swiper-client .box img {
  width: 100%;
  height: 100%;
}

.official .customer .swiper-client .prev {
  width: 1rem;
  height: 1.9rem;
  position: absolute;
  top: 50%;
  right: auto;
  left: 1.25rem;
  margin-top: -1.3rem;
  z-index: 10;
}

.official .customer .swiper-client .prev img {
  width: 100%;
  height: 100%;
}

.official .customer .swiper-client .next {
  width: 1rem;
  height: 1.9rem;
  position: absolute;
  top: 50%;
  right: 1.25rem;
  left: auto;
  margin-top: -1.3rem;
  z-index: 10;
}

.official .customer .swiper-client .next img {
  width: 100%;
  height: 100%;
}

.official .trends {
  width: 100%;
  height: auto;
  background: #fff;
  padding-bottom: 3.16rem;
}

.official .trends .title {
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: 2.5rem 0 2.08rem 0;
}

.official .trends .title em {
  color: #BE1E21;
}

.official .trends .trend {
  position: relative;
  padding-top: 3.41rem;
}

.official .trends .trend .box {
  border-top: 0.1rem solid #444;
}

.official .trends .trend .box .slide_trend .container {
  width: 93.6%;
  display: flex;
  justify-content: space-between;
  padding-top: 1.66rem;
}

.official .trends .trend .box .slide_trend .container .trends_img {
  display: flex;
  width: 11.16rem;
  height: 9.16rem;
}

.official .trends .trend .box .slide_trend .container .content {
  width: 60%;
  display: flex;
  flex-direction: column;
}

.official .trends .trend .box .slide_trend .container .content .subtitle {
  display: flex;
  justify-content: flex-start;
  line-height: 1;
  color: #000;
  white-space: nowrap;
  padding: 0.4rem 0 0.83rem 0;
  margin: 0;
}

.official .trends .trend .box .slide_trend .container .content .txt {
  line-height: 1.3;
  color: #444;
}

.official .trends .trend .box .slide_trend .container .content .details {
  width: 6.66rem;
  height: 1.75rem;
  line-height: 1.57rem;
  color: #666;
  border: 0.1rem solid #999;
  position: relative;
  text-align: center;
  box-sizing: border-box;
  margin-top: 1.64rem;
}

.official .trends .trend .box .slide_trend .container .content .details:after {
  width: 1rem;
  height: 0.5rem;
  content: "";
  position: absolute;
  top: 50%;
  right: 1rem;
  /*background: url("../img/arrow.png") no-repeat 50% 50%/100% 100%;*/
  margin-top: -.25rem;
  text-align:center;
  box-sizing: border-box;
}

.official .trends .trend .box .slide_trend .container:last-child {
  padding-bottom: 3.25rem;
}

.official .trends .trend .tab_bar {
  width: 23.8rem;
  display: flex;
  justify-content: space-between;
  color: #666;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -11.9rem;
}

.official .trends .trend .tab_bar .swiper-pagination-bullet {
  width: 7.3rem;
  height: 2.08rem;
  display: flex;
  opacity: 1;
  background: transparent;
  margin: 0;
}

.official .trends .trend .tab_bar .swiper-pagination-bullet .tab {
  width: 7.3rem;
  height: 1.9rem;
  line-height: 1.9rem;
  display: flex;
  justify-content: center;
  border: 1px solid #999;
  color: #666;
}

.official .trends .trend .tab_bar .swiper-pagination-bullet-active .tab {
  width: 7.3rem;
  height: 2.08rem;
  line-height: 2.08rem;
  display: flex;
  border: 0;
  background-color: #BE1E21;
  color: #fff;
}

.official .trends .more {
  width: 10.83rem;
  height: 2.44rem;
  line-height: 2.4rem;
  display: flex;
  justify-content: center;
  border: 0.1rem solid #BE1E21;
 
  color: #BE1E21;
}

.official .nav_sidebar {
  width: 100%;
  height: auto;
  background: url("../img/nav_bj.jpg") no-repeat 50% 50%/100% 100%;
}

.official .nav_sidebar .container {
  width: 97.3%;
  margin: 1.66rem auto 1.66rem auto;
  display: grid;
  grid-gap: .5rem;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 7.9rem 7.9rem 7.9rem 7.9rem;
}

.official .nav_sidebar .container .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  border: 0.1rem solid #fff;
  margin: 0;
}

.official .nav_sidebar .container .item .nav_img {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
}

.official .nav_sidebar .container .item .nav_name {
  display: flex;
  padding-top: .9rem;
  line-height: 1;
}

.official .nav_sidebar .container .item:nth-child(7) .nav_img {
  width: 2.66rem;
  height: 2.5rem;
}

.official .nav_sidebar .container .item:nth-child(9) .nav_img {
  width: 2.83rem;
  height: 2.5rem;
}

.official .nav_sidebar .container .item:last-child {
  flex-direction: row;
}

.official .nav_sidebar .container .item:last-child .nav_img {
  width: 1.5rem;
  height: 1.5rem;
}

.official .nav_sidebar .container .item:last-child .nav_name {
  padding-left: .625rem;
  padding-top: 0;
}

.official .bot_form {
  padding-top: 2.08rem;
  margin-top: 0;
}
.official footer{
  width: 100%;
}
.official footer .qrcode{
  width: 100%;
  background: #e3e3e3;
}

.official footer .qrcode .content{
  width: 15.25rem;
  margin: auto;
  display: flex;
  justify-content: space-between;
}
.official footer .qrcode .content .item{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 3.6rem;
  padding-bottom: 2.375rem;
}
.official footer .qrcode .content .item span{
  font-size: 1rem;
  color: #676767;
  line-height: 1;
  display: inline-block;
  padding-top: 1.5rem;
}
.official footer .qrcode .content .item img{
  width: 6.5rem;
  height: 6.5rem;
}
.official footer .tel{
  color: #E50202;
  font-size: 1rem;
  line-height: 1;
  text-align: center;
  padding: .75rem 0 .65rem 0;
}
.official footer .tel span:before{
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  display: inline-block;
  background: url('../img/footer_tel.png') no-repeat 50% 50% / 1.5rem 1.5rem;
  margin-top: -.2rem;
  vertical-align: middle;
  margin-right: .75rem;
}
.official footer .tel span{
  color: #676767;
  display: inline-block;
}

.official footer .record{
  width: 100%;
  background: #e3e3e3;
  padding-bottom: .625rem;
}
.official footer .record p{
  font-size: 1rem;
  color: #676767;
  line-height: 1;
  text-align: center;
}
.official footer .record p:first-child{
  padding: 1rem 0 0.5rem 0;
}
