body { padding-top: 120px;}
@media screen and (max-width: 980px) {
  body { padding-top: 178px;}
}
@media screen and (max-width: 767px) {
  body { padding-top: 165px;}
}
main { min-height: calc(100vh - 290px);}
/* 首页 */
.IndexView { background: #E6ECF2 url(../image/index-bg.png); background-size: 100% auto; background-repeat: no-repeat; padding-top: 20px; padding-bottom: 70px;}
.IndexView .index-nav { background-color: #FFFFFF; margin-bottom: 40px; color: #555555;}
.IndexView .index-nav .category { width: 20%;}
.IndexView .index-nav .category .title { padding: 20px 0 0 25px; font-size: 18px; line-height: 28px; color: #106CC6;}
.IndexView .index-nav .category .title .icon { font-size: 20px; margin-right: 8px; font-weight: bold;}
.IndexView .index-nav .nav-list { position: relative;}
.IndexView .index-nav .nav-list-p { display: block;}
.IndexView .index-nav .nav-list-m { display: none;}
.IndexView .index-nav .nav-list .nav-item { position: relative; padding: 5px 10px 5px 25px; font-size: 14px; color: #555555; line-height: 30px;}
.IndexView .index-nav .nav-list .nav-item a:hover { color: #106CC6;}
.IndexView .index-nav .nav-list .nav-item a .name { width: calc(100% - 15px); display: -webkit-box;overflow: hidden;white-space: normal!important;text-overflow: ellipsis;word-wrap: break-word;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.IndexView .index-nav .nav-list .nav-item a .icon { position: absolute; top: 0; right: 0; display: block; width: 30px; font-size: 14px; transform: rotate(-90deg);}
.IndexView .index-nav .nav-list .chil-nav { border: 1px solid #E6ECF2; display: none; padding: 10px 0; width: 222px; background-color: #FFFFFF; box-shadow: 4px 3px 5px 0px rgba(0,0,0,0.15); position: absolute; top: 0; left: 100%; z-index: 10;}
.IndexView .index-nav .nav-list .chil-nav li { padding: 5px 18px;display: -webkit-box;overflow: hidden;white-space: normal!important;text-overflow: ellipsis;word-wrap: break-word;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.IndexView .index-nav .nav-list .chil-nav li a { display: block;;}
.IndexView .index-nav .nav-list .nav-item:hover .chil-nav { display: block;}
.IndexView .index-nav .banner { flex: 1; padding: 20px 28px; overflow: hidden;}
.IndexView .index-nav .banner .mySwiper1 { width: 100%; height: 100%;}
.IndexView .index-nav .banner .mySwiper1 .img { width: 100%;}
.IndexView .index-nav .banner .mySwiper1 .swiper-pagination-bullet-active { background: #F2A019;}
.IndexView .index-item { margin-top: 20px;}
.IndexView .index-item .left { width: 20%; position: relative; background-color: #FFFFFF;}
.IndexView .index-item .left .img { width: 100%; height: 100%;position: absolute; top: 0; left: 0;z-index: 1;overflow: hidden;}
.IndexView .index-item .left .img img { width: 100%; height: auto}
.IndexView .index-item .left .text { width: 100%; text-align: center; position: absolute; top: 0; left: 0;z-index: 2;}
.IndexView .index-item .left .text p { padding: 0 20px; text-align: center; margin-top: 95px; padding-bottom: 22px; font-size: 22px; line-height: 32px; color: #222222;}
.IndexView .index-item .left .text p span { display: inline-block; min-width: 102px; text-align: left;}
.IndexView .index-item .left .text button { min-width: 102px; background: #F2A019; border-radius: 4px; font-size: 14px; line-height: 32px; color: #FFFFFF; text-align: center;}
.IndexView .index-item .list { flex: 1; display: flex; display: -webkit-flex; flex-wrap: wrap; background: #FFFFFF; border-top: 1px solid #E6ECF2;}
.IndexView .index-item .list .item { width: calc(25% - 41px); height: 209px; padding: 20px 20px 16px; border-bottom: 1px solid #E6ECF2; border-right: 1px solid #E6ECF2;}
.IndexView .index-item .list .item .img { width: 100%; height: 172px; object-fit: contain;}
.IndexView .index-item .list .item .name { font-size: 16px; color: #555555; line-height: 18px;}
.IndexView .index-item .right { width: 80%;; height: 245px; background-color: #FFFFFF;}
.IndexView .index-item .right.active { height: 490px;}
.IndexView .index-item .right .swiper { width: 100%; height: 100%;}
.IndexView .index-item .right .swiper .swiper-wrapper { width: 100% !important;}
/* .IndexView .index-item .right .swiper .swiper-slide { height: 245px;} */
.IndexView .index-item .right .item { width: calc(25% - 41px); height: 209px; padding: 20px 20px 16px; border-bottom: 1px solid #E6ECF2; border-right: 1px solid #E6ECF2;}
.IndexView .index-item .right .item .img { width: 100%; height: 172px; object-fit: contain;}
.IndexView .index-item .right .item .name { font-size: 16px; color: #555555; line-height: 18px;}
.IndexView .index-item .right .swiper-pagination-bullet { background-color: #FFFFFF; opacity: 1;}
.IndexView .index-item .right .swiper-pagination-bullet-active { background-color: #106CC6;}
.IndexView .company { margin-top: 20px;}
.IndexView .company .title { font-size: 22px; line-height: 72px; color: #222222; font-weight: bold;}
.IndexView .company .mySwiper2 {}
.IndexView .company .mySwiper2 .swiper-button-prev { left: 0; width: 32px; height: 32px; background: rgba(0,0,0,0.5);}
.IndexView .company .mySwiper2 .swiper-button-next { right: 0; width: 32px; height: 32px; background: rgba(0,0,0,0.5);}
.IndexView .company .mySwiper2 .swiper-button-prev:after,.IndexView .company .mySwiper2 .swiper-button-next:after { font-size: 12px; color: #FFFFFF;}
.IndexView .company .mySwiper2 .item { width: 100%; background: #FFFFFF;}
.IndexView .company .mySwiper2 .item .img { width: 100%; height: 242px; object-fit: contain;}
.IndexView .company .mySwiper2 .item .name { padding: 10px 20px; height: 30px; background: #FFFFFF; font-size: 16px; line-height: 30px; color: #555555;}
@media screen and (max-width: 1021px) {
  .IndexView .index-item .list .item { width: calc(33.33% - 41px); }
}
@media screen and (max-width: 767px) {
  .IndexView .index-nav .category { width: 100%;}
  .IndexView .index-nav .nav-list-p { display: none;}
  .IndexView .index-nav .nav-list-m { display: block;}
  .IndexView .index-item .left { width: 100%; height: 170px;}
  .IndexView .index-item .left img { width: 100%; object-fit: cover;}
  .IndexView .index-item .left .text p { margin-top: 40px; font-size: 18px; padding-bottom: 10px;}
  .IndexView .index-item .left .text p span { min-width: 90px;}
  .IndexView .index-item .left .text button { min-width: 90px;}
  .IndexView .index-item .list .item { width: calc(50% - 41px); }
  .IndexView .index-item .list .item .img { height: 140px;}
  .IndexView .index-item .right { width: 100%;}
  .IndexView .index-item .right.active1 { height: 490px;}
  .IndexView .index-item .right.active.active1 { height: 735px;}
  .IndexView .index-item .right.active.active2 { height: 980px;}
  .IndexView .company { margin-top: 10px;}
  .IndexView .company .title { line-height: 50px;}
  .IndexView .company .mySwiper2 .item .img { height: 150px;}
}

/* 产品列表 */
.productListView {}
.productListView .content { width: 100%; padding-bottom: 70px;}
.productListView .content .menu-box { margin-right: 18px; width: 22.22%;}
.productListView .content .menu { padding: 0 24px 20px; background: #FFFFFF;}
.productListView .content .menu .title { padding-top: 25px; font-size: 16px; line-height: 26px; color: #222222; font-weight: bold;}
.productListView .content .menu ul { padding: 10px 0 0;}
.productListView .content .menu ul li { padding: 8px 0; padding-left: 12px; font-size: 12px; line-height: 16px; color: #555555;}
.productListView .content .menu ul li.tit { padding-left: 0; font-size: 16px; line-height: 32px; color: #555555;}
.productListView .content .menu ul li.active { color: #222222; font-weight: bold;}
.productListView .content .menu ul li a { color: #555555; display: flex; align-items: center;}
.productListView .content .menu ul li .icon { font-size: 26px; line-height: 32px; margin: 0 -5px 0 -8px; font-weight: normal;}
.productListView .content .menu ul li:hover a { color: #222222; font-weight: bold;}
.productListView .content .right { flex: 1;}
.productListView .content .list { margin-bottom: 30px;}
.productListView .content .list .item { cursor: default; margin-bottom: 8px; color: #222222; padding: 16px 18px; background: #FFFFFF;}
.productListView .content .list .item .img { width: 160px; height: 160px; object-fit: contain; margin-right: 33px;}
.productListView .content .list .item .info { flex: 1; }
.productListView .content .list .item .name { padding-top: 12px; margin-bottom: 13px; font-size: 16px; line-height: 20px; font-weight: bold;}
/* .productListView .content .list .item .name:hover { -webkit-line-clamp: unset;} */
.productListView .content .list .item .order { line-height: 24px;}
.productListView .content .list .item .desc { margin-top: 15px; line-height: 18px; position: relative;}
.productListView .content .list .item .desc1:hover::after { padding: 2px 7px; content:attr(data-msg); position:absolute; font-size: 12px; width: auto; max-width: 100%; background-color: #FFFFFF; line-height:16px; left:10px; top: calc(100% + 5px); border:1px solid #333;color: #333;}
.productListView .content .list .item .company { width: 18.6%; min-width: 185px; margin-left: 75px;}
.productListView .content .list .item .company .name { font-size: 12px; line-height: 20px; color: #222222;}
.productListView .content .list .item .company .name .icon { margin-right: 10px; font-size: 18px; line-height: 20px; float: left; color: #FF9F13;}
.productListView .content .list .item .company .order { line-height: 24px;}
.productListView .content .list .item .company .contact { margin-top: 20px; display: inline-block; padding: 0 15px; height: 34px; background: #106CC6; font-size: 14px; color: #FFFFFF; line-height: 34px; text-align: center;}
.productListView .content .list .item .company .contact i { font-size: 18px; float: left; margin-right: 10px;}
@media screen and (max-width: 1021px) {
  .productListView .content .list .item .img { width: 120px; height: 120px; margin-right: 10px;}
  .productListView .content .list .item .company { margin-left: 20px;}
}
@media screen and (max-width: 767px) {
  .productListView .content { padding-bottom: 50px;}
  .productListView .content .menu-box { width: 100%; margin-right: 0; margin-bottom: 20px;}
  .productListView .content .menu { padding: 0 20px 20px;}
  .productListView .content .list .item .company { width: 100%; margin-left: 0;}
}

.searchComView .content .menu ul li { padding-left: 0;}
.searchComView .content .menu ul li.active { width: 100%; margin-left: -5px; padding: 9px 7px; background: #E6ECF2; display: flex; justify-content: space-between;}
.searchComView .content .menu ul li.active .icon { cursor: pointer; font-size: 16px; line-height: 16px; margin-right: 11px;}
.searchComView .content .menu .title1 { padding-top: 17px;}
.searchComView .content .menu .order-search { width: 100%; max-width: 180px; margin-top: 25px; height: 30px; border: 1px solid #E6ECF2; line-height: 30px;}
.searchComView .content .menu .order-search input { width: calc(100% - 70px); padding: 0 10px; line-height: 30px;}
.searchComView .content .menu .order-search input::placeholder { color: #888888;}
.searchComView .content .menu .order-search .submit { display: block; width: 50px; height: 30px; background: #106CC6; font-size: 14px; line-height: 30px; color: #FFFFFF;}

.searchComView .content .company-list .item { padding: 16px 24px 24px 30px;}
.searchComView .content .company-list .item .company { width: 32.94%; margin-left: 0; margin-right: 12.4%;}
.searchComView .content .company-list .item .company .name { font-size: 16px;}
.searchComView .content .company-list .item .company .contact { margin-top: 33px;}
.searchComView .content .company-list .item .pro-list { flex: 1;}
.searchComView .content .company-list .item .pro-list .pro-item { width: calc(33.33% - 13px);}
.searchComView .content .company-list .item .pro-list .pro-item img { width: 100%; height: 160px; object-fit: contain;}
.searchComView .content .company-list .item .pro-list .pro-item p { margin-top: 8px; font-size: 12px; color: #555555; line-height: 16px;}
@media screen and (max-width: 767px) {
  .productListView .content .menu .title { padding-top: 20px;}
  .productListView .content .menu ul li { padding: 5px 0;}
  .searchComView .content .menu .title1 { padding-top: 10px;}
  .searchComView .content .menu .order-search { margin-top: 15px;}
  .searchComView .content .company-list .item { padding: 16px 15px 24px 15px}
  .searchComView .content .company-list .item .company { width: 100%; margin-right: 0;}
  .searchComView .content .company-list .item .company .contact { margin-top: 20px;}
  .searchComView .content .company-list .item .pro-list { flex: unset; width: 100%;}
}

.search-empty .warn { width: 100%; background: #F7F2DB; border: 1px solid #FF9F13; padding: 7px 16px; line-height: 20px;}
.search-empty .warn .icon { font-size: 20px; color: #FF9F13; float: left; margin-right: 8px;}
.search-empty .tit { padding: 25px 30px 5px; font-size: 18px; color: #222222; line-height: 28px;}
.search-empty .text { padding: 0 30px;}
.search-empty .text p { font-size: 14px; line-height: 32px; color: #555555;}

.notfindView { padding: 80px 0;}
.notfindView .content { justify-content: center; align-items: center; padding: 86px; background: #FFFFFF; border-radius: 20px;}
.notfindView .content img { width: 21.6%; min-width: 200px; height: auto; margin-right: 9.7%;}
.notfindView .content .text p { font-size: 20px; color: #666666; line-height: 30px; font-weight: bold;}
.notfindView .content .text .goBtn { margin-top: 32px; display: inline-block; padding: 10px 33px; border-radius: 21px; background-color: #106CC6; font-size: 16px; line-height: 24px; color: #FFFFFF;}
@media screen and (max-width: 1021px) {
  .notfindView .content { padding: 50px;}
  .notfindView .content .text p { font-size: 18px;}
  .notfindView .content .text .goBtn { padding: 5px 20px; font-size: 14px; margin-top: 20px;}
}
@media screen and (max-width: 920px) {
  .notfindView .content { padding: 50px 30px;}
  .notfindView .content img { margin-right: 20px;}
  .notfindView .content .text { flex: 1;}
}
@media screen and (max-width: 767px) {
  .notfindView { padding: 50px 0;}
  .notfindView .content { padding: 50px 30px;}
  .notfindView .content img { margin-right: 20px;}
  .notfindView .content .text { flex: unset; width: 100%; margin-top: 20px; text-align: center;}
}

/* 产品详情 */
.productDetailView { padding-bottom: 40px;}
.productDetailView .content { }
.productDetailView .content .left { flex: 1; margin-right: 22px;}
.productDetailView .content .left .detail-box { padding: 20px; background: #FFFFFF; border: 1px solid #E6ECF2;}
.productDetailView .content .left .detail { }
.productDetailView .content .left .detail .pro-img { width: 380px; margin-right: 23px;}
.productDetailView .content .left .detail .pro-img .img { width: 100%; height: 380px; object-fit: contain; border: 1px solid #E7EDF3;}
.productDetailView .content .left .detail .pro-img .pro-pic { padding: 0 35px; position: relative;}
.productDetailView .content .left .detail .pro-img .mySwiper { height: 43px; margin-top: 10px;}
.productDetailView .content .left .detail .pro-img .mySwiper img { width: calc(100% - 2px); height: calc(100% - 2px); object-fit: contain; border: 1px solid #E7EDF3;}
.productDetailView .content .left .detail .pro-img .mySwiper .swiper-slide.active img { border: 1px solid #106CC6;}
.productDetailView .content .left .detail .pro-img .swiper-button-prev { width: 35px; left: 0; color: #333333;}
.productDetailView .content .left .detail .pro-img .swiper-button-next { width: 35px; right: 0; color: #333333;}
.productDetailView .content .left .detail .pro-img .swiper-button-prev:after { font-size: 19px;}
.productDetailView .content .left .detail .pro-img .swiper-button-next:after { font-size: 19px;}
.productDetailView .content .left .detail .pro-img .swiper-button-lock { display: flex;}
.productDetailView .content .left .detail .info { flex: 1;}
.productDetailView .content .left .detail .info .name { padding: 10px 0 25px; border-bottom: 1px solid #E6ECF2; font-size: 20px; line-height: 32px; color: #222222; font-weight: bold;}
.productDetailView .content .left .detail .info .text { padding: 21px 0;}
.productDetailView .content .left .detail .info .text p { font-size: 14px; color: #333333; line-height: 33px;}
.productDetailView .content .left .detail .info .text p span { font-weight: bold; display: inline-block; min-width: 130px; margin-right: 45px;}
.productDetailView .content .left .detail .info .btns { font-size: 0; padding-top: 10px;}
.productDetailView .content .left .detail .info .btns button { margin-bottom: 10px; width: 143px; margin-right: 20px;}
.productDetailView .content .left .spec { margin-top: 20px;}
.productDetailView .content .left .spec .tit span { display: inline-block; font-size: 16px; line-height: 44px; color: #333333; font-weight: bold; border-bottom: 4px solid #106CC6;}
.productDetailView .content .left .spec .cont .citem { margin-top: 25px; font-size: 16px; line-height: 23px; color: #333333;}
.productDetailView .content .left .spec .cont .citem .tit { color: #333333; font-weight: bold;}
.productDetailView .content .left .spec .cont .citem .desc *{ font-size: 16px !important; color: #333333 !important; line-height: 23px !important; font-weight: normal !important; background-color: none !important;} 
.productDetailView .content .left .spec .cont .item { display: inline-block; width: 48%;}
.productDetailView .content .left .spec .cont .item p { margin-top: 25px; color: #666666; line-height: 23px;}
.productDetailView .content .left .spec .cont img { max-width: 100%;}
.send-msg { margin-top: 20px; padding: 30px; background: #FFFFFF; border: 1px solid #E6ECF2;}
.send-msg .title { font-size: 18px; line-height: 1; color: #222222; font-weight: bold; }
.send-msg .form { margin-top: 27px;}
.send-msg .form .item { margin-top: 20px; padding-right: 49px;}
.send-msg .form .item label { display: inline-block; width: 108px; text-align: right; margin-right: 11px; font-size: 14px; line-height: 30px; color: #333333;}
.send-msg .form .item label span { color: #E64545;}
.send-msg .form .item .input { flex: 1; height: 30px; padding: 0 10px; border: 1px solid #CED3D9; border-radius: 4px;}
.send-msg .form .item .textarea { flex: 1; height: 119px; position: relative;}
.send-msg .form .item .textarea textarea { width: calc(100% - 20px); height: 99px; padding: 10px;}
.send-msg .form .item .textarea .curlength { font-size: 12px; color: #999999; line-height: 1; position: absolute; right: 20px; bottom: 10px;}
.send-msg .form .item .verify-input { max-width: 238px; padding: 0; overflow: hidden;}
.send-msg .form .item .verify-input input { width: calc(100% - 95px); padding: 0 10px;}
.send-msg .form .item .verify-input .verify { width: 74px; height: 100%; border-left: 1px solid #CED3D9;}
.send-msg .form .item .icon { color: #787878; line-height: 30px; margin-left: 10px;}
.send-msg .form .submit { margin-left: 119px; margin-top: 26px;}
.send-msg .form .m-error { display: block; padding-left: 119px;}

.productDetailView .content .right { width: 300px;}
.productDetailView .content .right .company { background: #FFFFFF; border: 1px solid #DBE3EF;}
.productDetailView .content .right .company .top { align-items: center; padding: 16px; background: url(../image/company-bg.png); background-size: 100% 100%;}
.productDetailView .content .right .company .top img { width: 50px; height: 50px; border-radius: 4px; margin-right: 16px;}
.productDetailView .content .right .company .top span { flex: 1; font-size: 14px; color: #333333; line-height: 21px; font-weight: bold;}
.productDetailView .content .right .company .list { padding: 0 16px;}
.productDetailView .content .right .company .list p { display: flex; display: -webkit-flex; padding: 10px 0; line-height: 16px; font-size: 14px; color: #333333;}
.productDetailView .content .right .company .list p .icon { width: 18px; margin-right: 13px; font-size: 18px;}
.productDetailView .content .right .company .contact { margin: 20px 20px 30px; display: flex; display: -webkit-flex; justify-content: center; width: calc(100% - 40px); height: 36px; background: #106CC6; border-radius: 4px; text-align: center; line-height: 33px; color: #FFFFFF;}
.productDetailView .content .right .company .contact .icon { margin-right: 6px; position: relative; top: 2px;}
.productDetailView .content .right .pro-categories { margin-top: 20px; background: #FFFFFF; border: 1px solid #DBE3EF; border-top: 2px solid #106CC6;}
.productDetailView .content .right .pro-categories .tit { padding: 10px 19px; background: #EAF4FF; border-bottom: 1px solid #DBE3EF; font-size: 18px;color: #106CC6; line-height: 20px; font-weight: bold;}
.productDetailView .content .right .pro-categories ul { padding: 11px 0 27px;}
.productDetailView .content .right .pro-categories ul li { padding: 5px 19px; font-size: 14px; line-height: 22px; color: #333;}
.productDetailView .content .right .pro-categories ul li.active { background: #F4F6F8;}
.productDetailView .content .right .pro-categories ul li.active a { color: #106CC6;}
.productDetailView .content .right .pro-categories ul li:hover { background: #F4F6F8;}
.productDetailView .content .right .pro-categories ul li:hover a { color: #106CC6;}
.productDetailView .content .right .may-like { padding: 20px; margin-top: 20px; background: #FFFFFF; border: 1px solid #DBE3EF;}
.productDetailView .content .right .may-like .tit { font-size: 18px; line-height: 26px; color: #222222; font-weight: bold;}
.productDetailView .content .right .may-like .list { margin-top: 7px;}
.productDetailView .content .right .may-like .list .item { margin-bottom: 20px;}
.productDetailView .content .right .may-like .list .item:last-child { margin-bottom: 0;}
.productDetailView .content .right .may-like .list .item .img { width: 110px; height: 110px; border: 1px solid #E7EDF3; object-fit: contain; margin-right: 11px;}
.productDetailView .content .right .may-like .list .item .info { flex: 1; position: relative;}
.productDetailView .content .right .may-like .list .item .info p { font-size: 14px; color: #333333; line-height: 21px;}
.productDetailView .content .right .may-like .list .item .info .icon { font-size: 22px; line-height: 1; color: #999999; position: absolute; left: 0; bottom: 10px;}
@media screen and (max-width: 1351px) {
  .productDetailView .content .left .detail .pro-img { width: 310px;}
  .productDetailView .content .left .detail .pro-img .img { height: 310px;}
}
@media screen and (max-width: 1219px) {
  .productDetailView .content .left .detail .info .btns button { width: auto;}
}
@media screen and (max-width: 1021px) {
  .productDetailView .content .left .detail .pro-img { width: 200px;}
  .productDetailView .content .left .detail .pro-img .img { height: 200px;}
}
@media screen and (max-width: 920px) {
  .productDetailView .content .left { margin-right: 0;}
  .productDetailView .content .right { width: 100%; margin-top: 20px;}
}
@media screen and (max-width: 767px) {
  .productDetailView .content .left { width: 100%; margin-right: 0;}
  .productDetailView .content .left .detail .pro-img { margin: 0 auto; width: 100%;}
  .productDetailView .content .left .detail .info { flex: unset; width: 100%;}
  .send-msg .form .item { padding-right: 0; margin-top: 15px;}
  .send-msg .form .item label { width: 70px;}
  .send-msg .form .submit { display: block; margin: 0 auto; margin-top: 26px;}
  .send-msg .form .m-error { padding-left: 80px;}
}

/* 联系我们 */
.contactView { padding-top: 1px; padding-bottom: 147px;}
.contactView .send-msg { padding-left: 11.85%; padding-right: 11.85%;}
.contactView .send-msg .form .item { padding-right: 0;}
.contactView .send-msg .form .item label { width: 74px;}
.contactView .send-msg .form .submit { margin-left: 81px;}
.contactView .send-msg .form .m-error { padding-left: 81px;}
.contactView .contact { padding: 50px 30px; background: #FFFFFF; border: 1px solid #E6ECF2;}
.contactView .contact .title { font-size: 18px; color: #333333; line-height: 1; font-weight: bold;}
.contactView .contact .title1 { font-size: 18px; color: #333333; line-height: 24px; margin-bottom: 12px;}
.contactView .contact .text { padding: 25px 0;}
.contactView .contact .text::after { content: ''; display: block; clear: both;}
.contactView .contact .text p { font-size: 14px; line-height: 22px; color: #555555;}
.contactView .contact .text img { max-width: 100%;}
.contactView .contact .cont { font-size: 14px; line-height: 22px; color: #555555;}
.contactView .contact .img { width: 281px; max-width: 100%; margin-bottom: 20px;}
@media screen and (max-width: 767px) {
  .contactView { padding-bottom: 50px;}
  .contactView .send-msg { padding: 30px 20px;}
  .contactView .send-msg .form .item { padding-right: 0;}
  .contactView .contact { padding: 30px 20px;}
  .contactView .contact .text { padding: 20px 0;}
}

.aboutView { padding-bottom: 119px;}
.aboutView .bannar img { width: 100%;}
.aboutView .swiper-pagination-bullet { background-color: #FFFFFF; opacity: 1;}
.aboutView .swiper-pagination-bullet-active { background-color: #106CC6;}
.aboutView .title { padding-top: 105px; font-size: 48px; line-height: 58px; color: #333333; text-align: center; font-weight: bold;}
.aboutView .section1 { padding-bottom: 420px; background-color: #F2F3F7;}
.aboutView .section1 .cont { margin-top: 38px; font-size: 18px; line-height: 30px; color: #333333;}
.aboutView .section1 .cont .img-box span { flex: 1; margin-right: 30px;}
.aboutView .section1 .cont .img-box span:last-child { margin-right: 0;}
.aboutView .section1 .cont .img-box img { max-width: 100%;}
.aboutView .section1 .cont .img { max-width: 100%;}
.aboutView .section1 .cont p { padding: 0 12.96%; text-align: center; word-break:normal; margin-bottom: 30px;}
.aboutView .section1 .cont p.tit { margin-top: 48px; font-size: 24px; line-height: 28px;}
.aboutView .section2 { margin-top: -420px;}
.aboutView .section2 .player { margin-top: 65px; height: 760px; border-radius: 20px; overflow: hidden; background-repeat: no-repeat; position: relative; z-index: 10;}
.aboutView .section3 .cont { margin-top: 70px;}
.aboutView .section3 .cont .img { width: 38.12%; margin-right: 74px;}
.aboutView .section3 .cont .img img { width: 100%; height: auto;}
.aboutView .section3 .cont .text { flex: 1; padding:18px 0; font-size: 16px; color: #000000; line-height: 30px;}
.aboutView .section3 .cont .text p { margin-bottom: 30px;}
.aboutView .section3 .cont .text .line { width: 77.49%; height: 5px; background-color: #E6ECF2; position: relative;}
.aboutView .section3 .cont .text .line::before { content: ''; width: 12.12%; height: 5px; background-color: #106CC6; position: absolute;}
.aboutView .section3 .cont .text .line1 { margin-bottom: 67px; float: right;}
.aboutView .section3 .cont .text .line2 { margin-top: 67px;}
.aboutView .section3 .cont .text .line2::before { right: 0;}
.aboutView .section3 .cont .text .clear { content: ''; clear: both; display: block;}
.aboutView .section4 .list { margin-top: 43px; justify-content: flex-start;}
.aboutView .section4 .list .item {box-sizing: border-box; margin-top: 32px;  width: calc(100% / 6); border-radius: 10px;display: flex; align-items:center; justify-content:center;padding: 0 10px;  }
.aboutView .section4 .list .item:nth-child(4n) { margin-right: 0;}
.aboutView .section4 .list .item img { max-width: 100%; max-height: 100%; object-fit: contain;}


.aboutView .sectionNew .cont { margin-top: 75px;position: relative;}
.aboutView .sectionNew .cont .img { width: 38.12%; margin-right: 45px;float: left;}
.aboutView .sectionNew .cont .img img { width: 100%; height: auto;}
.aboutView .sectionNew .cont .text { flex: 1; font-size: 16px; color: #000000; line-height: 30px;}
.aboutView .sectionNew .cont .text .p { margin-bottom: 43px;margin-top: 58px;}
.aboutView .sectionNew .cont .text .p2 {margin: 0; }
.aboutView .sectionNew .cont .line { width: 35%; height: 5px; background-color: #E6ECF2; position: relative;margin-bottom: 58px;}
.aboutView .sectionNew .cont .line::before { content: ''; width: 12.12%; height: 5px; background-color: #106CC6; position: absolute;}
.aboutView .sectionNew .cont .text .line1 { margin-bottom: 67px;position: absolute;right: 0;}
.aboutView .sectionNew .cont .line2 { margin-top: 55px;position: unset;width: 100%;margin-bottom: 0;}
.aboutView .sectionNew .cont .line2::before { right: 0;}
.aboutView .sectionNew .cont .text .clear { content: ''; clear: both; display: block;}
@media screen and (max-width: 1350px) {
  .aboutView .section2 .player { height: 675px;}
}
@media screen and (max-width: 1440px) {
  .aboutView .title { font-size: 40px; line-height: 52px; padding-top: 70px;}
  .aboutView .section2 .player { height: 552px;}
  .aboutView .section3 .cont { margin-top: 65px;}
  .aboutView .section3 .cont .img { margin-right: 44px;}
  .aboutView .section3 .cont .text { font-size: 14px; line-height: 20px;}
  .aboutView .section3 .cont .text p { margin-bottom: 24px;}
  .aboutView .section3 .cont .text .line1 { margin-bottom: 37px;}
  .aboutView .section3 .cont .text .line2 { margin-top: 37px;}
  .aboutView .section4 .list { margin-top: 30px;}
  .aboutView .section4 .list .item { height: 213px;}
}
@media screen and (max-width: 1021px) {
  .aboutView .title { font-size: 36px; line-height: 48px;}
  .aboutView .section2 .player { height: 492px;}
  .aboutView .section4 .list .item { height: 183px;}
}
@media screen and (max-width: 980px) {
  .aboutView { padding-bottom: 80px;}
  .aboutView .title { font-size: 34px; line-height: 44px;}
  .aboutView .section2 .player { height: 420px;}
  .aboutView .section4 .list { margin-top: 20px;}
  .aboutView .section4 .list .item { height: unset; max-height: 183px; width: calc(25% - 15px); margin-top: 20px; margin-right: 20px;}
}
@media screen and (max-width: 767px) {
  .aboutView { padding-bottom: 50px;}
  .aboutView .title { padding-top: 30px; font-size: 24px; line-height: 38px;}
  .aboutView .section1 { padding-bottom: 220px;}
  .aboutView .section1 .cont { margin-top: 20px;}
  .aboutView .section1 .cont .img-box span { flex: 1; margin-right: 10px;}
  .aboutView .section1 .cont p { padding: 0; font-size: 12px; line-height: 18px; margin-bottom: 20px;}
  .aboutView .section1 .cont p.tit { font-size: 20px; line-height: 24px; margin-top: 28px;}
  .aboutView .section2 { margin-top: -220px;}
  .aboutView .section2 .player { margin-top: 20px; height: 224px; border-radius: 10px;}
  .aboutView .section3 .cont { margin-top: 30px;}
  .aboutView .section3 .cont .img { margin-right: 14px;}
  .aboutView .section3 .cont .text { padding: 10px 0; font-size: 12px; line-height: 18px;}
  .aboutView .section3 .cont .text p { margin-bottom: 20px;}
  .aboutView .section3 .cont .text .line { height: 3px;}
  .aboutView .section3 .cont .text .line::before { height: 3px;}
  .aboutView .section3 .cont .text .line1 { margin-bottom: 20px;}
  .aboutView .section3 .cont .text .line2 { margin-top: 20px;}
  .aboutView .section4 .list { margin-top: 10px;}
  .aboutView .section4 .list .item { width: calc(33.33% - 12px); margin-top: 15px; margin-right: 15px;}
  .aboutView .section4 .list .item:nth-child(3n) { margin-right: 0;}
  .aboutView .sectionNew .cont{margin-top: 20px;}
  .aboutView .sectionNew .cont .img img{width: unset;max-width: 100%;}
  .aboutView .sectionNew .cont .img{float: unset;margin: 0 auto;width: 100%;text-align: center;}
  .aboutView .sectionNew .cont .text .line1{position: unset;width: 100%;margin-bottom: 20px;}
  .aboutView .sectionNew .cont .text .p{margin-top: 20px;margin-bottom: 20px;font-size: 14px;}
  .aboutView .sectionNew .cont .line2{margin-top: 0px;}
}

.register-body { padding-top: 120px;}
.registerView { padding: 30px 0 40px;}
.registerView .cont { margin: 0 auto; padding: 30px; width: 500px; max-width: calc(100% - 60px); background: #FFFFFF; }
.registerView .cont .title { font-size: 30px; color: #222222; line-height: 1; font-weight: bold; text-align: center;}
.registerView .cont .form-box { margin-top: 36px;}
.registerView .cont .form-box .item { margin-top: 12px;}
.registerView .cont .form-box .item label { margin-right: 12px; display: inline-block; min-width: 124px; text-align: right; font-size: 14px; color: #333333; line-height: 40px;}
.registerView .cont .form-box .item label span { color: #FF0000;}
.registerView .cont .form-box .item label span { color: #FF0000;}
.registerView .cont .form-box .item .input { flex: 1; height: 38px; border: 1px solid #DCDCDC; padding: 0 10px;}
.registerView .cont .form-box .item-img { }
.registerView .cont .form-box .item-img .img-add { width: 88px; height: 88px; background: #FFFFFF url(../image/add.png) center no-repeat; background-size: 26px 26px; border: 1px dashed #106CC6; margin-right: 14px; position: relative;}
.registerView .cont .form-box .item-img .img-add .input { width: 100%; height: 100%; padding: 0; opacity: 0; z-index: 2; position: absolute; top: 0; left: 0;}
.registerView .cont .form-box .item-img .img-add img { display: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
.registerView .cont .form-box .item-img .tips { flex: 1; padding-top: 26px; font-size: 12px; color: #555555; line-height: 18px;}
.registerView .cont .form-box .item-phone .input { padding: 0;}
.registerView .cont .form-box .item-phone .input span { display: block; width: 24px; height: 100%; background: #EEEEEE; border-right: 1px solid #DCDCDC; font-size: 14px; color: #555555; line-height: 40px; text-align: center;}
.registerView .cont .form-box .item-phone .input .area-code { width: 50px; padding: 0 2px; text-align: center; border-right: 1px solid #DCDCDC;color: #999999;}
.registerView .cont .form-box .item-phone .input .area-code.active{ color: #333333;}
.registerView .cont .form-box .item-phone .input .phone { width: calc(100% - 100px); padding: 0 10px;}
.registerView .cont .form-box .item .email-code { flex: 1;}
.registerView .cont .form-box .item .email-code .input { flex: unset; width: calc(100% - 96px);}
.registerView .cont .form-box .item .send-code { margin-left: 10px; width: 64px; padding: 0 5px; height: 40px; line-height: 40px; border-radius: 0;}
.registerView .cont .form-box .item .send-code.gray { background: #BFBFBF;}
.forget-pwd .cont .form-box .item .send-code.gray { background: #BFBFBF;}
.registerView .cont .form-box .item .register { flex: 1; margin-top: 14px; height: 40px; line-height: 40px;}
.registerView .cont .form-box .other { margin-top: 7px; font-size: 12px; line-height: 1; color: #555555; text-align: right;}
.registerView .cont .form-box .other a { color: #106CC6;}
.registerView .cont .form-box .m-error { display: block; padding-left: 136px;}
@media screen and (max-width: 767px) {
  .register-body { padding-top: 70px;}
  .registerView .cont { padding: 20px; max-width: calc(100% - 40px);}
  .registerView .cont .title { font-size: 28px;}
  .registerView .cont .form-box { margin-top: 20px;}
  .registerView .cont .form-box .item-img .img-add { width: 60px; height: 60px;}
  .registerView .cont .form-box .item-img .tips { padding-top: 13px;}
}
@media screen and (max-width: 375px) {
  .registerView .cont .form-box .item label { width: 100%; text-align: left;}
}


.loginView { min-height: calc(100vh - 296px); background: #B4C8DF url(../image/login-bg.png) no-repeat; background-size: auto 100%;}
.loginView .cont { padding: 113px 0 87px; text-align: right;}
.loginView .cont .form-box { display: inline-block; text-align: left; margin-right: 11.55%; width: 350px; padding: 33px 30px 95px; max-width: calc(100% - 60px); background: #FFFFFF;}
.loginView .cont .form-box .item {}
.loginView .cont .form-box .item label { display: block; font-size: 14px; color: #555555; line-height: 37px;}
.loginView .cont .form-box .item .input { width: calc(100% - 20px); height: 40px; padding: 0 10px; background: #FFFFFF; border: 1px solid #DCDCDC;}
.loginView .cont .form-box .other { text-align: right; font-size: 12px; color: #555555; line-height: 32px;}
.loginView .cont .form-box .other a { color: #106CC6;}
.loginView .cont .form-box .submit { width: 100%; height: 40px; line-height: 40px;}
@media screen and (max-width: 1350px) {
  .loginView .cont .form-box { width: 310px; padding: 30px 30px 80px; }
}
@media screen and (max-width: 767px) {
  .loginView { min-height: calc(100vh - 192px);}
  .loginView .cont { padding: 60px 0 40px;}
  .loginView .cont .form-box { padding: 30px 20px; width: calc(100% - 40px); max-width: calc(100% - 40px);}
}

.wrap-small{width: 940px;margin: 0 auto}
@media screen and (max-width: 1219px) { .wrap-small{ width: 940px; } }
@media screen and (max-width: 1023px) { .wrap-small { width: 90%;} }
@media screen and (max-width: 767px) { .wrap-small { width: 96%;} }
.forget-pwd { padding-top: 70px;}
.forgetPwdView { background: #FFFFFF; padding-top: 6px; min-height: calc(100vh - 372px);}
.forgetPwdView .cont { margin-bottom: 87px; width: 100%; background: #FFFFFF; border: 1px solid #CCCCCC;}
.forgetPwdView .cont .title { padding: 15px 21px; background-color: #F5F5F5; font-size: 16px; line-height: 20px; color: #333333;}
.forgetPwdView .cont .form-box { padding: 0 46px 66px; }
.forgetPwdView .cont .form-box .tit { padding: 45px 0 6px; font-size: 18px; color: #555555; line-height: 26px; font-weight: bold;}
.forgetPwdView .cont .form-box .item { margin-top: 23px; padding-right: 29.3%;}
.forgetPwdView .cont .form-box .item-email { margin-top: 80px;}
.forgetPwdView .cont .form-box .item label { width: 31.2%; min-width: 120px; font-size: 14px; line-height: 40px; color: #333333; margin-right: 13px; text-align: right;}
.forgetPwdView .cont .form-box .item p { flex: 1;}
.forgetPwdView .cont .form-box .item .input { width: calc(100% - 20px); padding: 0 10px; height: 40px; background: #FFFFFF; border: 1px solid #CCCCCC;}
.forgetPwdView .cont .form-box .item .code { width: calc(100% - 150px); }
.forgetPwdView .cont .form-box .item .send-code { width: 120px; height: 42px; border-radius: 0; line-height: 42px;}
.forgetPwdView .cont .form-box .submit { margin-top: 5px; width: 108px;}
.forgetPwdView .cont .form-box .m-error { padding-left: 24%;}
@media screen and (max-width: 767px) {
  .forget-pwd { padding-top: 0;}
  .forgetPwdView { min-height: calc(100vh - 198px);}
  .forgetPwdView .cont .form-box { padding: 0 20px 40px;}
  .forgetPwdView .cont .form-box .tit { padding: 25px 0 6px; font-size: 16px; line-height: 20px;}
  .forgetPwdView .cont .form-box .item { padding-right: 0;}
  .forgetPwdView .cont .form-box .item-email { margin-top: 40px;}
  .forgetPwdView .cont .form-box .item label { min-width: 110px; white-space: nowrap; margin-right: 10px;}
  .forgetPwdView .cont .form-box .item .code { width: calc(100% - 100px);}
  .forgetPwdView .cont .form-box .item .send-code { width: 70px; padding: 0 10px;}
  .forgetPwdView .cont .form-box .m-error { padding-left: calc(31.2% + 10px);}
}

.empty { text-align: center; padding-top: 131px;}
.empty img { width: 196px; height: 156px;}
.empty p { font-size: 16px; line-height: 1; margin-top: 30px;}
