/*banner*/
.ind-banner{ padding-top:110px; width: 100%; overflow: hidden; position:relative;} 
.ind-banner .swiper-slide {position: relative; }
.ind-banner .swiper-slide a{ display: block; width: 100%; height: 100%; }
.ind-banner .swiper-slide .img img{ width: 100%;}
.ind-banner .onebox{ position: absolute; right: 50%; margin-right: -7.0rem; z-index: 2; top: 30%; /*transform: translateY(-50%); */}
.ind-banner .onebox .en{ color: #544949; letter-spacing: 2px; }
.ind-banner .onebox .en em{ font-size: 0.8rem; line-height: 0.8rem; font-family:'mont'; }
.ind-banner .onebox .en span{ text-transform: uppercase; font-size: 0.16rem; line-height: 0.28rem; padding-left: 0.2rem; font-family:'exlight';}
.ind-banner .onebox .en2{ padding-left: 0.5rem; font-family:'semibold'; color: #544949; }
.ind-banner .onebox .en2 em{ font-family:'mont'; font-size: 0.8rem; line-height: 0.8rem; }
.ind-banner .onebox .cn{ padding: 0.1rem 0 0 0.5rem; color: #544949; font-size: 0.28rem; letter-spacing: 3px; font-family:'light'; }

.ind-banner .onebox{transform: translateY(50px);
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  -o-transform: translateY(50px);
  opacity: 0;
  visibility: hidden;
  transition: all 1.4s ease;
  -webkit-transition: all 1.4s ease;
  -moz-transition: all 1.4s ease;
  -ms-transition: all 1.4s ease;
  -o-transition: all 1.4s ease;
  transition-delay: 1s;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);}
.ind-banner .swiper-slide-active .onebox{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
}


.ind-banner .swiper-pagination{ width: 100%; bottom: 0.4rem; } 
.ind-banner .swiper-pagination-bullet { position: relative; display: inline-block; width: 0.16rem; height: 0.16rem; opacity: 1; background: rgba(0,0,0,0.3); box-sizing:border-box; border-radius: 50%; overflow: hidden; margin: 0 4px!important; } 
.ind-banner .swiper-pagination-bullet-active { background: #fff; } 

/*banner结束*/

.indexTit{ text-align: center; color: #000;  }
.indexTit .zi{ line-height: 0.28rem; font-size: 0.2rem; padding-bottom: 0.2rem; background: url(../images/line1.png) center bottom no-repeat; font-family:'play'; }
.indexTit .en{ font-size: 0.46rem; line-height: 0.46rem; padding: 0.2rem 0; font-family:'play'; text-transform: uppercase;}
.indexTit .cn{ font-size: 0.3rem; line-height: 0.3rem; }

.indexP1{ padding: 0.72rem 0; }
.indexP1 .mxfDiv{ margin-top: 0.5rem; overflow: hidden;}
.indexP1 .leftDiv, .indexP1 .rightDiv{ width: 3.52rem; }
.indexP1 .midDiv{ width: 6.6rem; margin-left: 0.18rem; }
.indexP1 .midDiv .imgDiv{ height: 6.6rem; border-radius: 0.24rem; overflow: hidden; }
.indexP1 .midDiv .imgDiv img{ width: 100%; height: 100%; object-fit: cover; }
.indexP1 .midDiv:hover .imgDiv img{ transform:scale(1.1);-webkit-transform:scale(1.1);}
.indexP1 li{ margin-bottom: 0.2rem; }
.indexP1 li:last-child{ margin-bottom: 0; }
.indexP1 li .box{ padding-top: 0.6rem; box-sizing: border-box; height: 3.2rem; background: #f6f6f6; border-radius: 0.24rem; position: relative; }
.indexP1 li .imgDiv{ width: 2.8rem; height: 1.9rem; margin: 0 auto; }
.indexP1 li .imgDiv img{ max-width: 2.8rem; max-height: 1.9rem; }
.indexP1 li .name{ position: absolute; left: 0; bottom: 0.2rem; font-size: 0.18rem; color: #000; text-align: center; height: 0.36rem; line-height: 0.36rem; width: 100%; box-sizing: border-box; padding: 0 0.3rem; }
.indexP1 li .box:hover .imgDiv img{ transform:scale(1.1);-webkit-transform:scale(1.1);}

.indexP1 .moreBtn{ width: 1.5rem; margin: 40px auto 0; }
.indexP1 .moreBtn a{ display: block; font-family: 'light'; width: 100%; text-align: center; color: #333; font-size: 0.15rem; line-height: 0.46rem; height: 0.48rem; box-sizing: border-box; border: #dcdcdc solid 1px; border-radius: 0.48rem; }
.indexP1 .moreBtn a:hover{ background: #333; border: #333 solid 1px; color: #fff; }

.indexP2{ background: #f4f4f4; padding: 0.8rem 0 0.32rem; }
.indexP2 .detail{ height: 5.2rem; margin-top: 0.5rem; }
.indexP2 .detail a{ height: 5.2rem; background: #fff;}
.indexP2 .detail .conDiv{ box-sizing: border-box; width: 50%; padding: 0 1.0rem; height: 5.2rem; }
.indexP2 .detail .name{ font-size: 0.34rem; line-height: 0.48rem; color: #333; font-family:'semibold'; }
.indexP2 .detail .txt{ padding-top: 0.1rem; font-size: 0.24rem; color: #333; line-height: 0.32rem; }
.indexP2 .detail .wen{ padding-top: 0.26rem; font-size: 0.18rem; line-height: 0.3rem; color: #666; font-family:'light'; }
.indexP2 .detail .price{ padding-top: 0.15rem; color: #666; font-family:'light'; font-size: 0.16rem;}
.indexP2 .detail .price del{ padding: 0 0.08rem; font-size: 0.14rem; }
.indexP2 .detail .price em{ color: #333; font-size: 0.18rem; font-family: 'misans'; }
.indexP2 .detail .more{ font-family: 'light'; margin-top: 0.65rem; width: 1.5rem; text-align: center; color: #333; font-size: 0.15rem; line-height: 0.46rem; height: 0.48rem; box-sizing: border-box; border: #dcdcdc solid 1px; border-radius: 0.48rem;}
.indexP2 .detail a:hover .more{ background: #333; border: #333 solid 1px; color: #fff;}
.indexP2 .detail .imgDiv{ width: 50%; height: 5.2rem; }
.indexP2 .detail .imgDiv img{ width: 100%; height: 100%; object-fit: cover; }
.indexP2 .list{ padding-top: 0.5rem; }
.indexP2 .list ul{ margin-right: -0.15rem; }
.indexP2 .list li{ float: left; width: 20%; padding-bottom: 0.4rem; }
.indexP2 .list li .box{ margin-right: 0.15rem; }
.indexP2 .list li .imgDiv{ height: 2.68rem; border-radius: 0.12rem; background: #fff; overflow: hidden; }
.indexP2 .list li .imgDiv img{ max-width: 2.4rem; max-height: 2.2rem; }
.indexP2 .list li .name{ margin-top: 0.25rem; line-height: 0.24rem; height: 0.24rem; overflow: hidden; font-family: 'semibold'; font-size: 0.18rem; color: #333; }
.indexP2 .list li .wen{ font-size: 0.15rem; line-height: 0.3rem; height: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: 'light'; color: #666;}
.indexP2 .list li .price{ padding-top: 0.2rem; color: rgba(51,51,51,0.6); font-family:'light'; font-size: 0.12rem;}
.indexP2 .list li .price del{ padding-left: 0.08rem; }
.indexP2 .list li .price em{ color: #333; font-size: 0.16rem; line-height: 0.16rem; font-family: 'misans'; }
.indexP2 .list li .box:hover .imgDiv img{ transform:scale(1.1);-webkit-transform:scale(1.1);}

.message{ padding: 0.8rem 0 0.9rem; }
.message .title{ text-align: center; font-size: 0.3rem; line-height: 0.3rem; color: #000; padding-bottom: 0.5rem; }
.message .list{ padding-top:0.5rem;}
.message .list ul{ margin-right: -0.6rem; }
.message .list li{ float: left; width: 50%; }
.message .list li .box{ margin-right: 0.6rem; cursor: pointer; }
.message .list li .imgDiv{ height: 3.78rem; border: #eee solid 1px; }
.message .list li .imgDiv img{ width: 100%; height: 100%; object-fit: cover; }
.message .list li .name{ margin-top: 0.3rem; height: 0.36rem; line-height: 0.36rem; font-size: 0.22rem; color: #333; font-family:'semibold'; text-transform: uppercase;}
.message .list li .msg{ margin-top: 0.1rem; }
.message .list li .msg dd{ position: relative; padding-left: 26px; font-size: 0.16rem; line-height: 0.32rem; font-family:'light'; }
.message .list li .msg dd img{ position: absolute; left: 0; top: 0.08rem; }

.cardModal-box { width: 100%; height: 100%; position: fixed; left: 0; top: 0; align-items: center; z-index: 110; background: rgba(0, 0, 0, 0.7); display: none;}
.cardModal-box.on {
  display: flex;
  display: -webkit-box;
  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box;
  /* Firefox 17- */
  display: -webkit-flex;
  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex;
  /* Firefox 18+ */
  display: -ms-flexbox;
  /* IE 10 */
}
.cardModal-box .card-box { width: 14.0rem; margin: 0 auto; background: #fff; position: relative;}
.cardModal-box .card-box .imgDiv img{ width: 100%;}
.cardModal-box .card-box .close { display: block; position: absolute; right: 50%; margin-right: -8rem; top: 0; width: 0.6rem; height: 0.6rem; border-radius: 50%; background: rgba(255,255,255,0.1); z-index: 10;}
.cardModal-box .card-box .close img { position: absolute; left: 50%; top: 50%; margin-left: -0.12rem; margin-top: -0.12rem; width: 0.24rem; }

.contact{ padding: 0.8rem 0 1.0rem; }
.contact .mxfDiv{ margin-top: 0.5rem; border: #eee solid 1px;}
.contact .conDiv{ width: 50%; box-sizing: border-box; padding: 0 0.5rem 0 0.95rem; }

.contact .imgDiv{ width: 7.12rem; }
.contact .imgDiv img{ width: 100%; }
.contact .name{ font-size: 0.3rem; line-height: 0.3rem; color: #000; }
.contact .lie{ margin-top: 0.45rem; }
.contact .lie li{ position: relative; padding-left: 0.6rem; font-size: 0.18rem; line-height: 0.4rem; margin-bottom: 0.3rem; font-family:'light';}
.contact .lie li .ico{ position: absolute; left: 0; top: 0; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: rgba(51,51,51,0.15);}
.contact .lie li .ico:after{ content: ''; position: absolute; left: 50%; top: 50%; margin-left: -0.16rem; margin-top: -0.16rem; width: 0.32rem; height: 0.32rem; background: #333; border-radius: 50%; }
.contact .lie li .ico img{ z-index: 1; position: absolute; left: 50%; top: 50%; margin-left: -8px; margin-top: -8px; }

.contactP2{ padding-top: 1.0rem; height: 7.08rem; background: url(../images/contactP2.jpg) center no-repeat; background-size: cover; box-sizing: border-box;}
.contactP2 .title{ font-size: 0.3rem; line-height: 0.3rem; color: #000; text-align: center; padding-bottom: 0.5rem; }
.contactP2 .form ul{ margin-right: -0.2rem;}
.contactP2 .form li{ float:left; width:50%; padding-bottom:0.2rem;}
.contactP2 .form .li01{ width:100%;}
.contactP2 .form li .box{ margin-right:0.2rem; background:#fff; border:#e4e8eb solid 1px; border-radius:4px;}
.contactP2 .form li .input1{ width:100%; padding-left:0.2rem; height:0.53rem; line-height:0.53rem; font-size:15px; color:#999; font-family:'light'; box-sizing:border-box;}
.contactP2 .form li .input1::-webkit-input-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li .input1:-moz-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li .input1::-moz-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li .input1:-ms-input-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li textarea{ width:100%; padding: 0.1rem 0 0 0.2rem; height:1.98rem; line-height:0.36rem; font-size:15px; color:#999; box-sizing:border-box; font-family:'light';}
.contactP2 .form li textarea::-webkit-input-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li textarea:-moz-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li textarea::-moz-placeholder{ color: #999; opacity: 1;}
.contactP2 .form li textarea:-ms-input-placeholder{ color: #999; opacity: 1;}
.contactP2 .btnDiv{ width:1.5rem; margin:10px auto 0;}
.contactP2 .btnDiv a{ width: 100%; text-align: center; height:0.5rem; line-height: 0.5rem; border-radius:0.36rem; background:#333; font-size:15px; color:#fff;}
.contactP2 .btnDiv img{ margin-left:14px;}
.contactP2 .btnDiv a:hover img{ transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);}

.recommend{ padding: 0.8rem 0 1.0rem; background: #f4f4f4; }
.recommend .title{ text-align: center; color: #000; font-size: 0.3rem; line-height: 0.3rem; padding-bottom: 0.5rem; }

.recommend .secondTab{ padding-bottom: 0.6rem; text-align: center; font-size: 0; }
.recommend .secondTab li{ display: inline-block; }
.recommend .secondTab li .box{ margin: 0 0.1rem;}
.recommend .secondTab li a{ display: block; width: 1.68rem; height: 0.48rem; line-height: 0.48rem; border: #e5e5e5 solid 1px; border-radius: 0.48rem; font-size: 0.16rem; color: #666; }
.recommend .secondTab li .aNow{ background: #333; border: #333 solid 1px; color: #fff; }
.recommend .secondTab li a:hover{ color: #333; }

.recommend .list{ padding-bottom: 20px; }
.recommend .list ul{ margin-right: -0.12rem; }
.recommend .list li{ float: left; width: 12.5%; padding-bottom: 0.32rem; }
.recommend .list li .box{ margin-right: 0.12rem; }
.recommend .list li .imgDiv{ background: #fff; height: 1.64rem; border-radius: 8px; overflow: hidden; }
.recommend .list li .imgDiv img{ max-width: 100%; max-height: 100%; object-fit: cover; }
.recommend .list li .name{ margin-top: 0.15rem; font-size: 0.18rem; color: #333; font-family:'mont'; height: 0.3rem; line-height: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommend .list li .box:hover .imgDiv img{ transform:scale(1.1);-webkit-transform:scale(1.1);}

.touDiv{ height: 1.4rem; position: fixed; left: 0; top: 0; width: 100%; z-index: 1; }
.touDiv .logo{ position: absolute; left: 0.6rem; top: 0.35rem; }
.touDiv .logo img{ width: 1.15rem; }
.touDiv .topRight{ position: absolute; right: 0.6rem; top: 0.6rem; z-index: 1; }
.touDiv .topRight li{ float: left; margin-left: 0.24rem; }
.touDiv .topRight li a{ display: block; padding: 0 0.24rem; height: 0.38rem; line-height: 0.38rem; color: #fff; font-size: 0.18rem; border: #fff solid 1px; border-radius: 0.48rem; }
.touDiv .topRight li a:hover{ background: #333; border: #333 solid 1px; color: #fff; }

.loginBox{ position: relative; height: 100vh; width: 100%; background: center no-repeat; background-size: cover; }
.loginBox .mxfDiv{ position: absolute; left: 50%; top: 50%; margin-left: -2.5rem; margin-top: -2.3rem; width: 5.0rem; height: 4.6rem; background: #fff; border-radius: 0.2rem; box-sizing: border-box; padding: 0.6rem 0.5rem 0; box-shadow: 0 0 0.3rem 0 rgba(0,24,48,0.2); }
.loginBox .mxfDiv2{ margin-top: -2.93rem; padding: 0.5rem 0.5rem 0; height: 5.86rem;}
.loginBox .title{ line-height: 0.24rem; color: #333; font-size: 0.24rem; font-family:'semibold'; padding-bottom: 0.35rem;}
.loginBox .form li{ position: relative; margin-bottom: 0.15rem; position: relative;}
.loginBox .form .li01{ padding-right: 1.2rem; }
.loginBox .form li .lbox{ border-radius: 0.24rem; height: 0.44rem; padding-left: 0.5rem; border: #e6e6e6 solid 1px; overflow: hidden;}
.loginBox .form li .ico{ position: absolute; left: 0.2rem; top: 50%; margin-top: -10px; }
.loginBox .form li .input1{ width: 100%; height: 0.44rem; line-height: 0.44rem; font-size: 14px; color: #999; }
.loginBox .form li .input1::-webkit-input-placeholder{ color: #999; opacity: 1;}
.loginBox .form li .input1:-moz-placeholder{ color: #999; opacity: 1;}
.loginBox .form li .input1::-moz-placeholder{ color: #999; opacity: 1;}
.loginBox .form li .input1:-ms-input-placeholder{ color: #999; opacity: 1;}
.loginBox .form li .yzm{ z-index: 1; display: block; position: absolute; right: 0; top: 0; width: 1.08rem; height: 42px; line-height: 42px; color: #fff; text-align: center; font-size: 0.14rem; border-radius: 6px; background-image: linear-gradient(90deg, #05ab51 0%, #c0d854 100%); background-blend-mode: normal, normal; }
.loginBox .botbot{ margin-top: 0.18rem; position: relative; }
.loginBox .forget{ position: absolute; right: 0; top: 0; display: block; font-size: 14px; line-height: 14px; color: #666; }
.loginBox .forget:hover{ color: #000; }
.loginBox .choose{ font-size: 14px; line-height: 14px; }
.loginBox .choose input{ position: relative; top: 1px; margin-right: 8px; }


.loginBox .btnDiv{ padding-top: 0.35rem; }
.loginBox .mxfDiv2 .btnDiv{ padding-top: 0.25rem; }
.loginBox .btnDiv li{ margin-bottom: 0.08rem; }
.loginBox .btnDiv li a{ display: block; width: 100%; height: 46px; line-height: 46px; border-radius: 0.48rem; text-align: center; color: #fff; font-size: 16px; background: #333; }
.loginBox .btnDiv li:last-child a{ background: none; color: #333; }
.loginBox .btnDiv li:last-child a:hover{ color: #000; }


.productShow{ padding: 1.0rem 0; background: #f4f4f4; }
.productShow .leftImg{ width: 5.0rem; height: 5.0rem; background: #fff; border-radius: 8px; cursor:pointer; overflow:hidden; }
.productShow .leftImg img{ width: 100%; height: 100%; object-fit: cover;  }
.productShow .rightDiv{ width: 7.8rem; }
.productShow .toptop .name{ font-size: 0.36rem; line-height: 0.52rem; color: #333; font-family:'semibold'; }
.productShow .toptop .content{ padding: 0.12rem 0 0.38rem; border-bottom: #e0e0e0 solid 1px; font-size: 0.16rem; line-height: 0.28rem; color: #555; font-family: 'light'; }
.productShow .toptop .price{ padding-top: 0.45rem; color: rgba(51,51,51,0.6); font-family:'mont'; font-size: 0.18rem;}
.productShow .toptop .price del{ padding-left: 0.08rem; }
.productShow .toptop .price em{ color: #333; font-size: 0.28rem; line-height: 0.28rem; font-family: 'misans'; }
.productShow .msgList{ padding-top: 0.3rem; width: 3.0rem;}
.productShow .msgList li{ position: relative; padding-left: 0.7rem; font-size: 0.16rem; line-height: 0.88rem; height: 0.88rem; border-bottom: #e0e0e0 solid 1px; font-family:'light';}
.productShow .msgList li .ico{ position: absolute; left: 0; top: 50%; margin-top: -20px; width: 40px; height: 40px; border-radius: 50%; background: rgba(51,51,51,0.15);}
.productShow .msgList li .ico:after{ content: ''; position: absolute; left: 50%; top: 50%; margin-left: -0.16rem; margin-top: -0.16rem; width: 0.32rem; height: 0.32rem; background: #333; border-radius: 50%; }
.productShow .msgList li .ico img{ z-index: 1; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -10px; }
.productShow .msgList li em{ font-family:'semibold'; color: #000;}

.productShow .title{ color: #000; font-size: 0.3rem; line-height: 0.3rem; padding: 0.8rem 0 0.5rem; }
.productShow .list{ clear: both; padding-bottom: 20px; }
.productShow .list ul{ margin-right: -0.12rem; }
.productShow .list li{ float: left; width: 12.5%; padding-bottom: 0.32rem; }
.productShow .list li .box{ margin-right: 0.12rem; }
.productShow .list li .imgDiv{ background: #fff; height: 1.64rem; border-radius: 8px; overflow: hidden; }
.productShow .list li .imgDiv img{ max-width: 100%; max-height: 100%; object-fit: cover; }
.productShow .list li .name{ margin-top: 0.15rem; font-size: 0.18rem; color: #333; font-family:'mont'; height: 0.3rem; line-height: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.productShow .list li .box:hover .imgDiv img{ transform:scale(1.1);-webkit-transform:scale(1.1);}

.productShow .form{ margin: 0.3rem 0 0.4rem; padding-right: 1.7rem; position: relative; z-index: 2; }
.productShow .form .btnDiv{ position: absolute; right: 0; top: 0; width: 1.7rem; }
.productShow .form .btnDiv a{ display: block; width: 100%; height: 0.6rem; background: #333 url(../images/nimg22_1.png) center no-repeat; border-radius: 6px; }
.productShow .form .liDiv{ float: left; margin-right: 0.2rem; width: 60%;}
.productShow .form .liDiv2{ width: 36.5%;}
.productShow .form .input1{ border: #e5e5e5 solid 1px; border-radius: 4px; width: 100%; height: 0.6rem; background: #fff; font-size: 0.16rem; font-family: 'light'; color: #838383; box-sizing: border-box; padding-left: 0.2rem;}
.productShow .form .input1::-webkit-input-placeholder{ color: #838383; opacity: 1;}
.productShow .form .input1:-moz-placeholder{ color: #838383; opacity: 1;}
.productShow .form .input1::-moz-placeholder{ color: #838383; opacity: 1;}
.productShow .form .input1:-ms-input-placeholder{ color: #838383; opacity: 1;}

.productShow .select{ display: inline-block; width: 100%; height: 0.6rem; position: relative; }
.productShow .caption { border: #e5e5e5 solid 1px; border-radius: 4px; position: relative; cursor: pointer; height: 0.6rem; line-height: 0.58rem; text-align: left; padding-left: 0.2rem; font-size: 0.16rem; color: #838383; font-family:'light'; background: #fff url(../images/selectIco.png) right center no-repeat; box-sizing: border-box;}
.productShow .xlist { width: 100%; position: absolute; left: 0; top: 100%; z-index: 12; background: #fff; max-height: 240px; overflow-y: auto; display: none; border: 1px solid #e5e5e5; border-top: none; box-sizing: border-box;}
.productShow .xlist::-webkit-scrollbar { width: 4px;}
.productShow .xlist::-webkit-scrollbar-track { background-color: #e5e5e5;}
.productShow .xlist::-webkit-scrollbar-thumb { background-color: #333;} 
.productShow .xlist a { display: block; font-size: 0.14rem; background: #fff; color: #838383; height: 48px; line-height: 48px; font-family:'light'; padding: 0 0.2rem; text-align: left; border-bottom: 1px solid #e5e5e5;}
.productShow .xlist a:hover, .productShow .xlist a.on { color: #000;}
.productShow .xlist a:last-child { border-bottom: none;}

.tipsModal-box { width: 100%; height: 100%; position: fixed; left: 0; top: 0; align-items: center; z-index: 110; background: rgba(0, 0, 0, 0.7); display: none;}
.tipsModal-box.on {
  display: flex;
  display: -webkit-box;
  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box;
  /* Firefox 17- */
  display: -webkit-flex;
  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex;
  /* Firefox 18+ */
  display: -ms-flexbox;
  /* IE 10 */
}
.tipsModal-box .tips-box { padding-top: 0.9rem; width: 4.0rem; height: 3.6rem; margin: 0 auto; background: #fff; position: relative; box-sizing: border-box; border-radius: 0.24rem;}
.tipsModal-box .tips-box .title{ font-size: 0.32rem; color: #333; line-height: 0.44rem; text-align: center; }
.tipsModal-box .tips-box .btnDiv{ margin: 0.4rem auto 0; width: 2.6rem; }
.tipsModal-box .tips-box .btnDiv li{ margin-bottom: 0.08rem; }
.tipsModal-box .tips-box .btnDiv li a{ display: block; width: 100%; height: 46px; line-height: 46px; border-radius: 0.48rem; text-align: center; color: #fff; font-size: 16px; background: #333; }
.tipsModal-box .tips-box .btnDiv li:last-child a{ background: none; color: #333; }
.tipsModal-box .tips-box .btnDiv li:last-child a:hover{ color: #000; }
.tipsModal-box .tips-box .close { display: block; position: absolute; right: 0.3rem; top: 0.3rem; width: 0.36rem; height: 0.36rem; border-radius: 50%; background: #333 url(../images/close3.png) center no-repeat; z-index: 10;}

.aboutP1{ padding: 0.7rem 0 1.0rem; }
.aboutP1 .content{ padding: 0.35rem 0 0.45rem; font-size: 0.18rem; line-height: 0.36rem; color: #555; font-family: 'light'; }

.aboutP1 .numList li{ float: left; width: 33.33%; box-sizing: border-box; text-align: center; }
.aboutP1 .numList li .pj{ height: 0.7rem; display: flex; display: -webkit-flex;justify-content: center;
  -webkit-justify-content: center; }
.aboutP1 .numList li .num{  display: flex; display: -webkit-flex; align-items: flex-end; -webkit-align-items: flex-end;}
.aboutP1 .numList li .numUp{ font-family: 'mont'; font-size: 0.72rem; line-height: 0.6rem; color: #222; padding-right: 0.15rem;}
.aboutP1 .numList li p{ font-size: 0.16rem; height: 0.36rem; color: #333; position: relative; display: flex; display: -webkit-flex; align-items: flex-end; -webkit-align-items: flex-end;}
.aboutP1 .numList li span{ position: absolute; left: 0; top: -8px; width: 12px; height: 12px; background: url(../images/nimg12_1.png) no-repeat; }
.aboutP1 .numList li .wen{ color: #333; padding-top: 0.18rem; font-size: 0.18rem; line-height: 0.18rem; }

.aboutP1 .videobox{ margin-top: 0.8rem; width: 100%; position: relative; overflow: hidden; z-index: 1; }
.aboutP1 .videobox .imgDiv{ height: 6rem; }
.aboutP1 .videobox .imgDiv img{ width: 100%; height: 100%; object-fit: cover;}
.aboutP1 .videobox video{ max-width:100%; max-height: 6rem; position:absolute;top:50%;left:0; right: 0; margin: 0 auto; transform: translateY(-50%);z-index:-1;visibility:hidden;opacity:0;object-fit:cover;}
.aboutP1 .videobox.cur{ background:#000;}
.aboutP1 .videobox.cur .imgDiv,.aboutP1 .videobox.cur .playbox{z-index:-1;visibility:hidden;opacity:0;}
.aboutP1 .videobox.cur video{z-index:2;visibility:visible;opacity:1;}
.aboutP1 .videobox .playbox{ cursor:pointer; position:absolute; left:50%; top:50%; width: 70px; height: 70px; margin-left:-35px; margin-top:-35px; border-radius: 50%; background: url(../images/play.png) no-repeat; z-index:1;}

.aboutP2{ background: #f8f8f8; padding: 0.8rem 0; position: relative; }
.aboutP2 .mapList{ position: relative; margin: 0 auto; width: 10.22rem; height: 5.74rem; background: url(../images/map.png) center no-repeat; background-size: 100%; }
.aboutP2 .mapList li{ position: absolute; z-index: 1; width: 16px; height: 24px; background: url(../images/nimg16Bg.png) no-repeat; }
.aboutP2 .mapList li .layer{ position: absolute; height: 0.66rem; line-height: 0.66rem; text-align: center; font-size: 0.2rem; color: #333; background: #fff; z-index: 1; border-radius: 6px; box-shadow: 0 0 0.3rem 0 rgba(0,0,0,0.12); /*padding: 0 0.25rem;*/}
.aboutP2 .mapList .france{ left: 0.85rem; top: 1.42rem; }
.aboutP2 .mapList .france .layer{ width: 2.7rem; right: 0.35rem; top: 0;}
.aboutP2 .mapList .thailand{ left: 3.32rem; top: 2.82rem; }
.aboutP2 .mapList .thailand .layer{ width: 2.1rem; right: 0.35rem; top: 0.1rem;}
.aboutP2 .mapList .china{ left: 3.68rem; top: 2.45rem; }
.aboutP2 .mapList .china .layer{ width: 3.1rem; left: 0.35rem; top: 0;}
.aboutP2 .mapList .usa{ right: 1.5rem; top: 1.26rem; }
.aboutP2 .mapList .usa .layer{ width: 1.7rem; left: 0.35rem; top: 0;}
.aboutP2 .sj{ position: absolute; right: 50%; margin-right: -7.5rem; bottom: 0.9rem; }

.aboutP3{ padding-top: 1.0rem; overflow: hidden; }

.aboutP3 .mxfDiv{ width: 100%; position: relative;}
.aboutP3 .mxfDiv:after{ content: ''; position: absolute; left: 50%; top: 50%; width: 5.6rem; height: 5.6rem; margin-left: -2.8rem; margin-top: -2.8rem; background: url(../images/clock.png) no-repeat; background-size: 5.6rem; overflow: hidden; z-index: 1; }

.aboutP3 .swiper-slide { position: relative;}
.aboutP3 .swiper-slide .pic img { width: 100%; height: 8.0rem; object-fit: cover; transform:scale(1.1);-webkit-transform:scale(1.1);}
.aboutP3 .txtLayer{ position: absolute; left: 50%; margin-left: -2.92rem; top: 0; width: 5.84rem; height: 100%; z-index: 4; }
.aboutP3 .info { position: absolute; left: 0; top: 35%; width: 100%;}
/*.aboutP3 .inner { width: 100%; position: relative; z-index: 5;}*/
.aboutP3 .icon{ width: 0.6rem; height: 0.6rem; margin: 0 auto 0.5rem; }
.aboutP3 .icon img{ width: 0.6rem; }
.aboutP3 .name{ font-size: 0.46rem; text-align: center; line-height: 0.64rem; color: #fff;  }

.aboutP3 .icon,
.aboutP3 .name {
  transform: translateY(1rem);
  -webkit-transform: translateY(1rem);
  -moz-transform: translateY(1rem);
  -ms-transform: translateY(1rem);
  -o-transform: translateY(1rem);
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
}
.aboutP3 .swiper-slide.swiper-slide-active .icon,
.aboutP3 .swiper-slide.swiper-slide-active .name{ opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0);}

.aboutP3 .info.on .icon,
.aboutP3 .info.on .name{ opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0);}


.aboutP3 .tab-box { position: absolute; left: 50%;/* margin-left: -5.1rem;*/ margin-left: -2.98rem; width: 5.96rem; height: 6.6rem; top: 50%; margin-top: -3.3rem; z-index: 3; /*width: 10.2rem;*/}
.aboutP3 .tab-box a { display: block; position: absolute; width: 2.84rem;/* height: 1.5rem;*/ box-sizing: border-box; }
.aboutP3 .tab-box .aa{ left: 50%; top: 0.5rem; margin-left: -1.42rem; text-align: center; }
.aboutP3 .tab-box .bb{ right: 0; top: 50%; margin-top: -0.2rem; width: 0.4rem; height: 0.4rem; /* padding-left: 0.56rem;*/ }
.aboutP3 .tab-box .cc{ left: 50%; bottom: 0.1rem; margin-left: -1.42rem; text-align: center; }
.aboutP3 .tab-box .dd{ left: 0; top: 50%; margin-top: -0.2rem; height: 0.4rem; width: 0.4rem;}
/*.aboutP3 .tab-box .inner{ position: relative; padding-left: 43.6%; height: 100%; text-align: left; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center;}
*/
.aboutP3 .tab-box .round{ position: absolute; width: 0.4rem; height: 0.4rem; border-radius: 50%; box-sizing: border-box; }
.aboutP3 .tab-box .round:after{ content: ''; position: absolute; left: 50%; top: 50%; margin-left: -0.04rem; margin-top: -0.04rem; width: 0.08rem; height: 0.08rem; border-radius: 50%; background: #fff; }
.aboutP3 .tab-box .aa .round{ left: 50%; margin-left: -0.2rem; top: -0.18rem;}
.aboutP3 .tab-box .bb .round{ left: 0; top: 0; }
.aboutP3 .tab-box .cc .round{ left: 50%; margin-left: -0.2rem; bottom: 0.22rem; }
.aboutP3 .tab-box .dd .round{ right: 0; top: 0; }


.aboutP3 .tab-box .cn{ font-size: 0.2rem; line-height: 0.2rem; color: #fff; }
.aboutP3 .tab-box .aa .cn{ margin-top: -0.4rem;}
.aboutP3 .tab-box .bb .cn, .aboutP3 .tab-box .dd .cn{ line-height: 0.4rem;  }
.aboutP3 .tab-box .bb .cn{ position: absolute; left: 0.52rem; top: 0; width: 2.4rem; }
.aboutP3 .tab-box .dd .cn{ position: absolute; right: 0.52rem; top: 0; width: 1rem; text-align: right; }
/*.aboutP3 .tab-box .cc .cn{ margin-bottom: -0.25rem;}*/
.aboutP3 .tab-box a.on .round{ border: #fff solid 2px; }
.aboutP3 .tab-box a.on .round:after{ background: #fff; }

.aboutP3 .lineTab{ position: absolute; left: 50%; top: 50%; width: 5.6rem; height: 5.6rem; margin-left: -2.8rem; margin-top: -2.8rem; z-index: 2;}
.aboutP3 .lineTab .line{ position: absolute; }
.aboutP3 .lineTab .line_top{ visibility: hidden; width: 2.8rem; height: 2.8rem; top: 1px; left: 50%; /*margin-left: -2.6rem;*/ background: url(../images/hope1.png) left top no-repeat; background-size: 2.8rem; }
.aboutP3 .lineTab .line_top.on{ animation: line1 4s linear; -webkit-animation: line1 4s linear;}
.aboutP3 .lineTab .line_right{ visibility: hidden; width: 2.8rem; height: 2.8rem; right: 0; top: 50%; background: url(../images/hope2.png) left top no-repeat; background-size: 2.8rem; }
.aboutP3 .lineTab .line_right.on{ animation: line2 4s linear; -webkit-animation: line2 4s linear;}
.aboutP3 .lineTab .line_bot{ visibility: hidden; width: 2.8rem; height: 2.8rem; bottom: 1px; right: 50%; background: url(../images/hope3.png) right top no-repeat; background-size: 2.8rem; }
.aboutP3 .lineTab .line_bot.on{ animation: line3 4s alternate linear; -webkit-animation: line3 4s alternate linear;}
.aboutP3 .lineTab .line_left{ visibility: hidden; width: 2.8rem; height: 2.8rem; left: 1px; bottom: 50%; background: url(../images/hope4.png) right bottom no-repeat; background-size: 2.8rem; }
.aboutP3 .lineTab .line_left.on{ animation: line4 4s alternate linear; -webkit-animation: line4 4s alternate linear;}


@keyframes line1 {0%{ visibility: visible; width: 0;} 80%{width:2.8rem;} 100%{ width: 2.8rem;}}
@-webkit-keyframes line1 {0%{visibility: visible; width: 0;} 80%{width:2.8rem;} 100%{ width: 2.8rem;}}
@keyframes line2 {0%{visibility: visible; height: 0;} 90%{height:2.8rem;} 100%{ height: 2.8rem;}}
@-webkit-keyframes line2 {0%{visibility: visible; height: 0;} 90%{height:2.8rem;} 100%{ height: 2.8rem;}}
@keyframes line3 {0%{visibility: visible; width: 0;} 90%{width:2.8rem;} 100%{ width: 2.8rem;}}
@-webkit-keyframes line3 {0%{visibility: visible; width: 0;} 90%{width:2.8rem;} 100%{ width: 2.8rem;}}
@keyframes line4 {0%{visibility: visible; height: 0;} 90%{height:2.8rem;} 100%{ height: 2.8rem;}}
@-webkit-keyframes line4 {0%{visibility: visible; height: 0;} 90%{height:2.8rem;} 100%{ height: 2.8rem;}}


.aboutP4{ padding: 1.0rem 0; }
.aboutP4 .imgDiv{ width: 8.0rem; }
.aboutP4 .imgDiv img{ width: 100%; }
.aboutP4 .conDiv{ width: 4.8rem; }
.aboutP4 .name{ font-size: 0.36rem; line-height: 0.36rem; color: #222; font-family:'semibold'; padding-bottom: 0.3rem; }
.aboutP4 .msg{ font-size: 0.18rem; line-height: 0.36rem; color: #333; font-family: 'light'; }


.pswp__counter, .pswp__button--arrow--left, .pswp__button--arrow--right{ display:none!important;}