@charset "utf-8";
@font-face {font-family: 'iconfont';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
  url('iconfont.woff') format('woff'),
  url('iconfont.ttf') format('truetype'),
  url('iconfont.svg#iconfont') format('svg');
}
.iconfont{
  font-family:"iconfont" !important;
  font-size:16px;font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  width: 100%;
  overflow-y: auto;
}

body {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-family: "微软雅黑", arial;
  color: #666;
}

a:link {
  color: #1d1d1d;
  text-decoration: none;
}
a:active {
  color: #1d1d1d;
  text-decoration: none;
}
a:visited {
  color: #1d1d1d;
  text-decoration: none;
}
a:hover {
  color: #1d1d1d;
  text-decoration: none;
}
div,
form,
img,
ul,
ol,
li,
dl,
dt,
dd,
input {
  margin: 0;
  padding: 0;
  border: 0;
}
li,
dl {
  list-style-type: none;
}

html,
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
object,
code,
legend,
button,
input,
textarea,
label,
th,
td,
a,
img {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
  font-weight: normal;
}
.clear {
  clear: both;
}

/*  */

.container {
  width: 1400px;
  margin: 0 auto;
}

.banner {
  background: url(../images/banner.jpg);
  height: 620px;
}

.banner .container {
  position: relative;
}

.banner-bt {
  width: 155px;
  height: 55px;
  border-radius: 4px;
  background-color: #fff;
  line-height: 55px;
  text-align: center;
  position: absolute;
  left: 120px;
  top: 350px;
}

.banner-bt a {
  display: block;
  font-size: 24px;
  color: #0454de;
}

.pro-advantage {
  background: url(../images/advantag-bg.png) no-repeat 50%/contain;
  height: 870px;
  /* background: url(../images/ddd.png) no-repeat 50%/contain; */
}

.common-title {
  font-size: 36px;
  color: #000;
  text-align: center;
  padding: 60px 0;
  font-weight: bold;
}
 
.pro-advantage-title {
  position: relative;
}

.pro-advantage-title  hd{
  position: relative;
  z-index: 2;
}
.pro-advantage-title li {
  width: 420px;
  height: 155px;
  position: absolute;
  display: flex;
  align-items: center;
  padding: 15px 59px 25px 18px;
}

.pro-advantage-title li:nth-child(5) {
 
  padding: 68px 15px 26px 25px;
  height: 186px;
}
.pro-advantage-title li:nth-child(3),.pro-advantage-title li:nth-child(4) {
 
  padding: 15px 18px 25px 59px;
}
.pro-advantage-title li:nth-child(3) .info ,.pro-advantage-title li:nth-child(4) .info{
  text-align:right;
  
}
.pro-advantage-title li:nth-child(3),.pro-advantage-title li:nth-child(4)
{
  flex-direction: row-reverse
}
.pro-advantage-title .icon img {
  width: 129px;
  height: auto;
  padding-left: 12px;
}
.pro-advantage-title .info h3 {
  font-size: 22px;
  font-weight: bold;
  color: rgba(0, 0, 0, 1);
}
.pro-advantage-title .info p {
  font-size: 16px;
  font-weight: 400;
  line-height: 21.95px;
  color: rgba(0, 0, 0, 1);
  margin-top: 6px;
}

.pro-advantage-title li.on {
  background: url(../images/pro-bg.png);
}

 .pro-advantage-title li:nth-child(3).on , .pro-advantage-title li:nth-child(4).on{
  background: url(../images/pro-bg2.png);
 
   
}


 .pro-advantage-title li:nth-child(5).on{
  background: url(../images/pro-bg3.png);
 
   
}

.adv-t1 {
  left: 20px;
  top: 67px;
}
.adv-t2 {
  left: 20px;
  top: 230px;
}
.adv-t3 {
  right: 0px;
  top: 76px;
}
.adv-t4 {
  right: 0;
  top: 230px;
}
.adv-t5 {
  left: 515px;
  top: 474px;
}
.pro-advantage-content .hd {
  position: relative;
  z-index: 2;
  cursor: pointer;
}
.pro-advantage-con {
  position: relative;
  z-index: 1;
}

.pro-advantage-con .pro-advantage_con_list {
  margin: 0 auto;
}


 

.left{
  animation: ;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px) ;
}

.right{
  -webkit-transform: translateX(200px);
  transform: translateX(200px) ;
}

.pro-advantage_con_list>div {
  opacity: 1 !important;
  -webkit-transform: translateX(0);
  transform: translateX(0) ;
}
.pro-advantage_con_list>div {
  position: absolute;
  /* opacity: 0; */
  transition: all 0.4s ease-in-out;
  z-index: 2;
}

.pro-advantage_con_list>div .ico{background-color: #fff;height: 44px;opacity: 1;border-radius: 30px;padding: 0px 20px 0px 10px;background: rgba(255, 255, 255, 1);box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);display: flex;align-items: center;}
.pro-advantage_con_list>div .ico span.name{
  color:#000;padding-left: 10px;
 

}
.pro-advantage_con_list>div .ico span.iconfont{
  font-size: 24px;
  width: 37px;
  height: 37px;
  opacity: 1;
  display: block;
  border-radius: 50%;;
  text-align: center;
  line-height: 37px;

}


.pro-advantage_con_list>div:nth-child(1) span.iconfont
{
  background: rgba(240, 246, 255, 1);
  color:#3A62F4;

}

.pro-advantage_con_list>div:nth-child(2) span.iconfont
{
  background: rgba(205, 240, 232, 1);
  color:#07B68C;
}


.pro-advantage_con_list>div:nth-child(3) span.iconfont
{
  background: rgba(255, 247, 232, 1);
  color:#FDB126
}

.pro-advantage_con_list>div:nth-child(4) span.iconfont
{
  background: #ffd4d5;
  color:#ff7a7b
}

.pro-advantage_con_list>div{
  transition: all 0.3s;
  transform: translateX(0);
}
/* .pro-advantage_con_list.active>div:nth-child(1){
transform: translateX(200px);
} */


.item1 {
  width: 331px;
  height: 431px;
  background-image:url(../images/adv1.png);
  background-size: 100%;
  background-position: center 50px;
  background-repeat: no-repeat;
  position: relative;
}

.item1>div:nth-child(1) {

  right: -26px;
  top: 260px;
}
.item1>div:nth-child(2) {

  right: -45px;
  top: 124px;
 
}
.item1>div:nth-child(3) {

  left: -71px;
  top: 347px;

}


.item2 {
  width: 544px;
  height:400px;
  background-image:url(../images/adv2.png);
  background-size: 100%;
  background-position: center 100px;
  background-repeat: no-repeat;
  position: relative;
}

.item2>div:nth-child(1) {

  right: -26px;
  top: 260px;
}
.item2>div:nth-child(2) {

  right: -45px;
  top: 124px;
 
}
.item2>div:nth-child(3) {

left: 3px;

top: 347px;
}
.item2>div:nth-child(4) {

left: -30px;

top: 215px;
}
.item3>div:nth-child(1) img{
  max-width: 100%;;
}

.item3>div:nth-child(1) {
  left: -45px;
  top: 0px;
 
  width:200px;
}
.item3>div:nth-child(2) {
  right: -26px;
  top: 30px;
}
.item3>div:nth-child(3) {

right: 3px;

top: 296px;
}
.item3>div:nth-child(4) {

left: -30px;

top: 265px;
}
 

.item3 {
  width: 544px;
  height: 400px;
  background-image:url(../images/adv3.png);
  background-size: 100%;
  background-position: center 100px;
  background-repeat: no-repeat;
  position: relative;
}



.item4>div:nth-child(1) img{
  max-width: 100%;;
}

.item4>div:nth-child(1) {
  left: -45px;
  top: 60px;
  width:200px;
}
.item4>div:nth-child(2) {
  right: -26px;
  top: 130px;
}
.item4>div:nth-child(3) {

right: 3px;

top: 280px;
}
.item4>div:nth-child(4) {

left: 0px;

top: 300px;
}
 
.item4>div:nth-child(5) {

right: -16px;

top: 60px;

}
  .item4>div:nth-child(6) {

    left: -30px;
    
    top: 155px;
    }
     
.item4 {
  width: 544px;
  height: 400px;
  background-image:url(../images/adv5.png);
  background-size: 100%;
  background-position: center 100px;
  background-repeat: no-repeat;
  position: relative;
}

.item5 {
  width: 700px;
  height:600px;
  background-image:url(../images/adv6.png);
  background-size: 100%;
  background-position: center  20px;
  background-repeat: no-repeat;
  position: relative;
}


.pro-advantage_con_list .quan{
 width: 50px;height: 50px;
 border-radius: 50%;
 text-align: center;
 line-height: 14px;
 font-size: 12px;padding-top: 10px;
  color:#fff;

}
.pro-advantage_con_list .quan2{
  background-color: #0454de;
}
.pro-advantage_con_list .quan1{
  background-color: #07B68C;
}
.pro-advantage_con_list .quan3{
  background-color: #7f5fff;
}

.pro-advantage_con_list {
  display: none;
}

.pro-advantage-con ul{display: none;}
.pro-advantage-con ul.active{display: block;}

.none {
  display: none;
}

.block {
  display: block;
}

.pro-function {
  background: url(../images/pro-function.png) no-repeat 50% / cover;
  background-size: cover;
  height: 745px;
}

.pro-function-title li {
  height: 80px;
  opacity: 1;
  border-radius: 6px;
  font-size: 20px;
  font-weight: 400;
  color: #000;
  line-height: 80px;
  text-align: center;
  display: block;
  width: 100%;
}
.pro-function-title li.on {
  background: rgba(58, 98, 244, 1);

  border: 1px solid rgba(255, 255, 255, 1);

  box-shadow: 0px 10px 20px 0px rgba(75, 125, 194, 0.1);
  color: #fff;
}

.pro-function-title {
  height: 80px;
  opacity: 1;
  border-radius: 6px;
  background: rgba(247, 249, 252, 1);

  border: 1px solid rgba(255, 255, 255, 1);

  box-shadow: 0px 10px 20px 0px rgba(75, 125, 194, 0.1);
  margin-bottom: 50px;
}

.pro-function-detail {
  width: calc(100% - 400px);
}

.pro-function-title ul {
  display: flex;
  justify-content: space-between;
}

.pro-function-title li:hover {
  cursor: pointer;
}
.pro-function-list {
  display: flex;
  justify-content: space-between;
}
.pro-function-info {
  width: 360px;
  margin-top: 60px;
}

.pro-function-info .info-title {
  display: block;
  position: relative;
  font-weight: 600;
  font-size: 32px;
  line-height: 45px;
  color: #03081a;
  margin: 0 0 16px 30px;
}

.pro-function-info .info-title:after {
  content: "";
  position: absolute;
  top: -20px;
  left: -27px;
  width: 56px;
  height: 52px;
  background: url(../images/ico.png) no-repeat 50%;
  background-size: 100%;
}

.pro-function-info .info-subTitle {
  font-size: 16px;
  color: #030b1a;
  margin-bottom: 42px;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
}
.pro-function-detail ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.pro-function-detail li {
  display: inline-block;
  width: calc(100% / 3 - 30px);
  height: 160px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #f1f3f8;
  border-radius: 4px;
  margin: 0 16px 24px 0;
  padding: 32px 24px 0 20px;
}
.pro-function-detail li .iconfont {
  font-size: 32px;
  color: #0454de;
  margin-right: 8px;
}
.pro-function-detail li .detail-subTitle {
  font-weight: 600;
  font-size: 18px;
  line-height: 25px;
  color: #030b1a;
}

.pro-function-detail li .detail-name {
  font-weight: 600;
  font-size: 18px;
  line-height: 25px;
  color: #030b1a;
}

.pro-function-detail li .detail-subTitle {
  display: block;
  width: 200px;
  font-size: 14px;
  line-height: 24px;
  color: #818999;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  font-weight: normal;
}

.pro-function-detail li .detail-top {
  height: 32px;
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}

.pro-panorama {
  display: flex;
  justify-content: space-between;
}

.pro-panorama-con {
  width: calc(100% - 100px);
  display: flex;
  justify-content: space-between;
}

.pro-panorama-title {
  background: url(../images/pro.png) no-repeat 50% / cover;
  width: 58px;
  position: relative;
}
.pro-panorama-title span {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  padding: 0 20px;
  font-size: 18px;
  color: #fff;
}

.pro-panorama-list {
  position: relative;
  display: inline-block;
  width: 276px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 0 20px rgba(0, 101, 221, 0.1);
  border-radius: 4px;
  padding: 32px 32px 24px;
  margin-left: 8px;
  text-align: left;
}

.pro-panorama-list:hover {
  box-shadow: 0 0 20px rgba(0, 101, 221, 0.4);
}

.pro-panorama-list .title {
  font-size: 22px;
  color: #030b1a;
  line-height: 1;
  font-weight: 600;
}

.pro-panorama-list .subtitle {
  font-size: 14px;
  padding: 12px 0 0;
  line-height: 20.27px;
  color: rgba(153, 153, 153, 1);
  height: 90px;
}

.pro-panorama-list .list {
  text-align: left;
  width: 212px;
  min-height: 104px;
  margin: 0 auto;
}

.pro-panorama-list .list .list-item {
  margin-bottom: 16px;
  height: 14px;
}

.pro-panorama-list .list .list-item:last-child {
  margin-bottom: 0;
}

.pro-panorama-list .list .info-avatar {
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

.pro-panorama-list .list .info-avatar .iconfont {
  font-size: 16px;
  color: #0454de;
}

.pro-panorama-list .list .info-content {
  display: inline-block;
  vertical-align: middle;
  padding-left: 8px;
}

.pro-panorama-list .list .info-content .name {
  font-size: 14px;
  line-height: 1;
  color: #03081a;
}

.pro-panorama-list .list .info-content .name.colorGreen {
  color: #0065dd;
}

.pro-panorama-list .list .list-item-more {
  cursor: pointer;
}

.pro-panorama-list .list .list-item-more .info-content .name {
  color: #0065dd;
}

.pro-panorama-list .list .list-item-more .info-content .arrow.iconfont {
  color: #0065dd;
  font-size: 12px;
}

.pro-panorama-list.blue .list .business-iconfont,
.pro-panorama-list.blue .list .list-item-more .info-content .name {
  color: #0065dd;
}

.pro-panorama-list .price-wrapper {
  height: 56px;
  margin-top: 32px;
}

.pro-panorama-list .price-wrapper .price {
  color: rgba(255, 141, 26, 1);
}

.pro-panorama-list .price-wrapper .price.is-none {
  display: none;
}

.pro-panorama-list .price-wrapper .price .rmb {
  padding-right: 2px;
}

.pro-panorama-list .price-wrapper .price .teamText {
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  line-height: 36px;
  color: rgba(255, 141, 26, 1);
}

.pro-panorama-list .price-wrapper .price .rmb,
.pro-panorama-list .price-wrapper .price .unit {
  display: inline-block;
  font-size: 20px;
  height: 20px;
  line-height: 20px;
  font-weight: 500;
  vertical-align: bottom;
}

.pro-panorama-list .price-wrapper .price .num {
  display: inline-block;
  font-family: baidu-number;
  font-size: 36px;
  height: 36px;
  line-height: 42px;
  font-weight: 500;
  font-weight: bold;
}

.pro-panorama-list .price-wrapper .price .month-price,
.pro-panorama-list .price-wrapper .price .month-text {
  display: inline-block;
  font-size: 14px;
  color: rgba(255, 141, 26, 1);
  font-weight: 500;
  line-height: 18px;
  vertical-align: bottom;
}

.pro-panorama-list .price-wrapper .price .month-text {
  margin: 0 4px;
  font-weight: 400;
  color: #495366;
}

.pro-panorama-list .price-wrapper .under-line {
  padding-top: 8px;
}

.pro-panorama-list .price-wrapper .under-line .origin-price {
  text-decoration: line-through;
  font-size: 12px;
  color: #818999;
  letter-spacing: 0.57px;
  line-height: 16px;
}

.pro-panorama-list .price-wrapper .under-line .origin-price.is-line {
  text-decoration: none;
}

.pro-panorama-list .price-wrapper .under-line .origin-price.is-hide {
  visibility: hidden;
}

.pro-panorama-list .price-wrapper .under-line .origin-price.is-custom {
  font-size: 20px;
  line-height: 36px;
  font-weight: 600;
  color: #0065dd;
  padding-top: 20px;
  text-decoration: none;
}

.pro-panorama-list .commodity-card-btn {
  position: relative;
  width: 190px;
  height: 38px;
  opacity: 1;
  border-radius: 4px;
  background: rgba(58, 98, 244, 1);
  border: 0;
  margin-top: 36px;
  font-size: 14px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  font-weight: 500;
}

.pro-panorama-list .commodity-card-btn:hover {
  background: linear-gradient(
    280.47deg,
    #7f5fff 0.05%,
    #2c5afc 31.68%,
    #1970f1 66.89%,
    #2f89f4 99.95%
  );
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  color: #fff;
}

.pro-panorama-list .commodity-card-btn .mark {
  position: absolute;
  top: -11px;
  right: -8px;
  padding: 0 8px;
  height: 20px;
  text-align: center;
  background: #fe2b38;
  background-image: linear-gradient(140.7deg, #ff715c 5.83%, #fe2b38);
  border-radius: 12px 12px 12px 0;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
  color: #fff;
}


.dialog,
.dialog__overlay {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.dialog {
	position: fixed;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	pointer-events: none;
}

.dialog__overlay {
	position: absolute;
	z-index: 1;
	background: rgba(55, 58, 71, 0.9);
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	-webkit-backface-visibility: hidden;
}

.dialog--open .dialog__overlay {
	opacity: 1;
	pointer-events: auto;
}

.dialog__content {
	width: 90%;
	max-width: 1200px;
	min-width: 1000px;
	background: #fff;
	padding: 4em;
	text-align: center;
	position: relative;
	z-index: 5;
	opacity: 0;
}

.dialog--open .dialog__content {
	pointer-events: auto;
}

/* Content */
.dialog h2 {
	margin: 0;
	font-weight: 400;
	font-size: 2em;
	padding: 0 0 2em;
	margin: 0;
}


.mt30 {
  margin-top: 30px;
}

/*  */

.pro-scenarios-list {
  display: flex;
  justify-content: space-between;
}
.pro-scenarios-info {
  width: 744px;
  height: 412px;
  opacity: 1;
  border-radius: 6px;
  background: rgba(247, 249, 252, 1);
  padding: 40px;
}

.pro-scenarios-pic img {
  width: 631px;
  height: 412px;
  opacity: 1;
  border-radius: 6px;
}
.marleft30 {
  margin-left: 20px;
}
.pro-scenarios-info .name {
  width: 96px;
  height: 30px;
  opacity: 1;
  border-radius: 6px;
  display: block;
  text-align: center;
  line-height: 30px;
  font-weight: bold;
  color: #000;
}
.pro-scenarios-info .item {
  display: flex;
  align-items: center;
  color: #333;
}

.pro-scenarios-info .item .name,
.pro-scenarios-info .case .name {
  background: rgba(255, 255, 255, 1);
  border: 1px solid rgba(222, 233, 250, 1);
  margin-right: 10px;
}
.pro-scenarios-info .info {
  margin: 20px 0;
}
.pro-scenarios-info .info .name {
  background: rgba(255, 141, 26, 1);
  color: #fff;
  border: 1px solid rgba(255, 141, 26, 1);
}
.pro-scenarios-info .info p {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 24px;
  color: rgba(51, 51, 51, 1);
  height: 140px;
  margin-top: 20px;
}

.pro-scenarios-info .case ul {
  display: flex;
  justify-content: flex-start;
  margin-top: 10px;
  flex-wrap: wrap;
}

.pro-scenarios-info .case li {
  height: 30px;
  opacity: 1;
  border-radius: 6px;
  display: block;
  text-align: center;
  line-height: 30px;
  background: rgba(255, 255, 255, 1);
  border: 1px solid rgba(222, 233, 250, 1);
  font-size: 12px;
  padding: 0px 10px;
  margin: 0 10px 6px 0;
}

.custom {
  background: transparent url(../images/hz-bg.png) no-repeat 50% / contain;
  position: relative;
  height: 780px;
  margin-top: 60px;
}

.custom .custom-title p {
  font-size: 24px;
  padding-top: 5px;
}
.custom .custom-title {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  padding: 40px 0 0  0px;
}




.custom-con {
  width: 100%;
  overflow: hidden;
  position: relative;
  margin-top: 50px;
  height: 280px;
}
.custom-con .hd {
  overflow: hidden;
  height: 30px;
 
  display: flex;
  justify-content: flex-start;
}
.custom-con .hd .prev,
.custom-con .hd .next {
  display: block;
  overflow: hidden;
  cursor: pointer;

  padding-right: 20px;
}

.custom-con .hd span{
  font-size: 20px;
  color: #fff;
}

.custom-con .bd {
 
  margin-bottom: 30px;

 
}
.custom-con .bd ul {
  overflow: hidden;
  zoom: 1;
  
  justify-content: space-between;
  width:100%;
  flex-wrap: nowrap;
}
.custom-con .bd ul li
{
  display: inline-block;  width:calc( 100% / 3 );
}
.custom-con .bd ul li .item {
  overflow: hidden;
  text-align: center;
  background: #fff;
    /* width: 440px; */
  height: 130px; 
  padding:20px;
  margin-right: 30px;
  border-radius: 4px;
   
}
.custom-con .bd ul li .pic {
  text-align: center;height: 50px;
  display: flex;
  align-items: flex-end;
}
.custom-con .bd ul li .pic img {
  width: 100px;
  height: auto;
  max-height: 40px;
  display: block;
  /* border: 1px solid #e9e9e9; */
  border-radius: 4px;
}
.custom-con .bd ul li .pic a:hover img {
  border-color: #999;
}
.custom-con .bd ul li .title {
  line-height: 24px;
  display: flex;align-items: center;
  margin-top: 10px;

}
.custom-con .bd ul li .title span{
  font-size: 16px;color:#000;
}

.custom-con .bd ul li .title p{
  font-size: 14px;
  color:#666;padding-left: 10px;;
}
.custom-else{
  margin-top: 50px;
}
.custom-else li .pic{
  width: 194px;
  height: 77px;
  opacity: 1;
  border-radius: 4px;
  background: rgba(255, 255, 255, 1);
  
  border: 1px solid rgba(255, 255, 255, 1);
  
  box-shadow: 0px 5px 15px 0px rgba(237, 245, 255, 1);
}

.custom-else li .pic img{
  max-width: 100%;;
}

.custom-else ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.custom-else li {
  width:calc(100% / 6 - 30px);
  margin-bottom: 30px;
}




.xba{
  height: 285px;
  background: url(../images/xba.png) no-repeat 50%/contain;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
 
.xba .info h3{
  font-size: 24px;
font-weight: 700;
letter-spacing: 0px;
line-height: 24px;
color: rgba(58, 98, 244, 1);
}
.xba .info p{
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 24px;
  color: rgba(51, 51, 51, 1);
  margin-top: 10px;
}
.xba .link {display: flex;
margin-top: 30px;}
.xba .link a{
  width: 133px;
height: 38px;
opacity: 1;
border-radius: 4px;
background: rgba(58, 98, 244, 1);
color:#fff;
text-align: center;margin-right: 30px;
line-height: 38px;display: block;
}

.xba .link a:nth-child(2){
  background:#FFF;
  color:#000;
}

/*  */

.dialog-ac{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
 
  cursor: pointer;
  height: 50px;

}

.dialog__title{
  font-size: 24px;
  font-weight: bold;
  color:#000;
}

.dialog-ac button{
  width:40px;height: 40px;
  border-radius: 50%;
  border:1px solid #0065dd;
  cursor: pointer;
  background-color: #fff;
  margin-top:-20px;
}

.dialog-ac span{
  font-size: 14px;
  color:#0065dd;
}
.compare-list{
  height: 600px;
  overflow-y: scroll;
}

 
 
.column-list-collapse-btn {
transform: rotate(-90deg);
}
.column-list-collapse-btn span{
  font-size: 12px;;
}
.compare-list .column-list-collapse.down .column-list-collapse-btn{
  transform: rotate(90deg);
}

 
.compare-list .list-title,.compare-list .sub-list-content {
  padding-left: 24px
}

.compare-list .column-list-collapse {
  box-sizing: border-box;
  background: #f7f9fc;
  color: #03081a;
  height: 58px;
  line-height: 58px;
  padding: 0 24px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none
}

.compare-list .column-list-collapse-title {
  float: left;
  font-weight: 600;
  font-size: 16px
}

.compare-list .list-title {
  color: #03081a;
  font-weight: 600;
  font-size: 18px;
  height: 66px;
  line-height: 66px;
  margin-bottom: 4px;
}

.compare-list  .sub-list-content {
  color: #495366;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 13px;
}

.compare-list-content{
  display: flex;
  justify-content: space-between;
  text-align: center;
}
.compare-list-content .list-title{
  flex: 1;
}
.compare-list-content .list-title:nth-child(1){
flex: 1.3;text-align: left;
}

.column-list-collapse-wrap {
    padding: 15px 0;
}

.column-list-collapse{
  display: flex;
  justify-content: space-between;
}


.sub-compare-list-content{
  display: flex;
  justify-content: space-between;
  text-align: center;
}

.sub-compare-list-content .sub-list-content{
  flex: 1;
}
.sub-compare-list-content .sub-list-content:nth-child(1){
flex: 1.3;
text-align: left;
}
.sub-compare-list-content .sub-list-content span{
  color:#0065dd
}

/* mobile */

@media screen and (max-width: 768px) {
  .container {
    width: 100%;
 
  }
  .banner {
    background: url(../images/mb_banner.png);
    height: 200px;
    background-size: cover;
  }

  .pro-advantage-title li{
    position: relative;

  }

  .adv-t1,.adv-t5,.adv-t4,.adv-t3,.adv-t2{
    left:auto;
    right:auto;
    top:auto;
 
  }

  .pro-advantage-title li{
    width:100%;
    height: auto;
    padding: 0;
    border-radius: 6px;
    background: rgba(247, 249, 252, 1);
    border: 1px solid rgba(255, 255, 255, 1);
    box-shadow: 0px 10px 20px 0px rgba(75, 125, 194, 0.1);
  }
  .pro-function-detail ul{display: flex;justify-content: space-around;}
  
  .pro-function-detail li{
    width: calc(100% / 2 - 10px);
    margin: 0;
  }

  .pro-panorama-con{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
  }

  .pro-panorama-list{
    width: calc(100% / 2 - 8px);
    padding: 20px 10px;
    margin-bottom: 20px;
    margin-left: 0px;
  }

  .pro-panorama-list .commodity-card-btn{
    width:100%;
  }

  .pro-panorama-list .list .info-content .name{
    text-overflow:ellipsis;
    white-space:nowrap;
    display: block;
    height: 20px;
    line-height: 20px;
    width: 126px;
    overflow: hidden;
  }
  .pro-panorama-list .list{
    width:100%
  }

  .pro-panorama-list .list .list-item-more{
    display: none;
  }
  .pro-scenarios-list{
    display: flex;
    flex-direction: column;
  }

  .pro-panorama-list .price-wrapper .price .num{
    font-size: 20px;
  }

  .pro-function-list{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }

  .pro-scenarios-info{
    width:100%;
    height: auto;
    padding: 20px;
  }
  .pro-scenarios-pic img{
    max-width: 100%;
    width:100%;
    height: auto;
  }

  .custom-else li{
    width: calc(100% / 2 - 30px);
  }

  .custom{
    height: auto;
    background-image: url(../images/hz-bg.png);
    background-size: cover;
    background-position: top center;
    overflow: hidden;
  }

  .custom-else li .pic{
    width:100%;
  }
  .pro-function{
    height: auto;
  }

  .pro-panorama-title span{
    position: relative;
    height: 58px;
    display: block;
    line-height: 58px;
    background: linear-gradient(280.47deg,#7f5fff .05%,#2c5afc 31.68%,#1970f1 66.89%,#2f89f4 99.95%);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    color: #fff;
    left: 0px;
  }
  .pro-panorama{
    display: flex;
    flex-direction: column;
  }

  .pro-panorama-title{
    width:100%;
    height: 58px;
  }
  .pro-panorama-list .subtitle{
    height: auto;
    padding-bottom: 10px;
    min-height: 62px;
  }
  .pro-panorama-list .list{
    min-height: 80px;
  }
  .pro-panorama-con{
    width:100%;
  }
  .banner-bt{
    display: none;
  }
  .common-title{
    font-size: 24px;
    padding: 50px 0;
  }
  .pro-advantage-title .info h3{
    font-size: 18px;
  }
  .pro-advantage-title .info p{
    font-size: 12px;
    margin-top: 0px;
  }
  .pro-advantage-title .icon img{
    width: 101px;
  }
  .pro-advantage-title li:nth-child(3), .pro-advantage-title li:nth-child(4){
    flex-direction: row;
  }

  .pro-advantage-title li:nth-child(3), .pro-advantage-title li:nth-child(4){
    padding: 0px;
  }
  .pro-advantage-title li:nth-child(3) .info, .pro-advantage-title li:nth-child(4) .info{
    text-align: left;
  }
.pro-advantage-title li:nth-child(5)
{
  padding:0px;height:auto;
}
  .pro-advantage-con{
    display: none;
  }
  .pro-advantage-title li.on{
  background: transparent;
  }
  .pro-advantage-title{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }
  .pro-advantage{
    height: auto;
    background-image: url(../images/advantag-bg.png);
    background-size: cover;
    background-position: top center;;
  }
.pro-function-title{height:auto;background: transparent;}
  .pro-function-title li{
    font-size: 16px;
    width: calc(100% / 2 - 10px);
    height: 40px;
    line-height: 40px;
  }

  .pro-function-title ul{
    display: flex;
    flex-wrap: wrap;
    padding: 18px;
  }

  .pro-function-title li{
    opacity: 1;
    border-radius: 6px;
    background: rgba(247, 249, 252, 1);
    border: 1px solid rgba(255, 255, 255, 1);
    box-shadow: 0px 10px 20px 0px rgba(75, 125, 194, 0.1);
    margin-bottom: 10px;
  }

  .pro-function-info .info-title{
    font-size: 18px;
  }

  .pro-function-detail{
    width:100%;
  }
  .pro-function-detail li .detail-subTitle{
    width:100%;
  }
  .pro-function-detail li .detail-name{
    font-size:14px;
  }

  .pro-function-info{
    width:auto;
    padding:0 30px;
  }
  .pro-scenarios-info .item{
    display: flex;
    /* flex-direction: column; */
    flex-wrap: wrap;
  }
  .pro-scenarios-info .txt{
    width: calc(100% - 116px);
  }
  .marleft30{
    margin-left: 0;
  }
  .pro-scenarios-info .item *{
    margin-bottom: 10px;;
  }
  .pro-scenarios-info .info p{
    height: auto;;
  }.pro-panorama-list .price-wrapper .price .rmb, .pro-panorama-list .price-wrapper .price .unit{
    font-size:14px;
  }
  .custom .custom-title{
    font-size: 24px;
    padding: 40px 0 0 20px;
  }
  .custom .custom-title p{
    font-size: 16px;
  }

  .custom-else ul{
    justify-content: space-evenly;
  }

  .custom-con .bd ul li .item{

height: auto;
}

  .custom-con .bd ul li .title{
    display: flex;
    flex-direction: column;
  }

  .custom-con{
    height: auto;
    margin: 30px 0 0 10px;
  }
  .custom-con .bd ul li .title span{
    font-size: 14px;
  }
  .custom-con .bd ul li .pic img{
    max-width: 100%;
  }
  .custom-con .bd ul li .title p{
    display: none;
  }
  .custom-con .bd ul li .pic{
    height: 30px;
  }

  .xba{
    height: 285px;
    background-image: url(../images/xba.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .xba .info, .xba .link{
    padding:0px 20px;
  }

  .xba .info p{
    font-size: 14px;
  }
}
