/* 国资国企 */
.top {
  height: 68rem;
  overflow: hidden;
}

.top.gzgq {
  background: url('../images/product/gzgq/top_bg.png') no-repeat;
  background-size: cover;
}

.top-inner {
  max-width: 160rem;
  margin: 30rem auto 0 auto;
  text-align: center;
}

.top-inner h1 {
  font-size: 5.2rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  text-shadow: 0.3rem 0.7rem 1rem rgba(7,20,45,0.27);
  margin-bottom: 3.4rem;
  text-align: center;
}

.top-inner p {
  font-size: 2.8rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  text-align: center;
}

.top-logo {
  margin-bottom: 2.8rem;
  width: 23.8rem;
  height: 6.6rem;
  object-fit: contain;
}

.gzgq-partner.index {
  max-width: 160rem;
  margin: 7.6rem auto 0 auto;
}

.gzgq-partner.index h4 {
  text-align: center;
  font-size: 3.6rem;
  font-weight: bold;
  margin: 0 0 5rem 0;
  color: #333333;
}

.gzgq-partner.index .gzgq-partner-desc {
  font-size: max(1.6rem, 14px);
  line-height: 3.6rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  padding: 0 20rem;
}

.gzgq-partner ul {
  margin: auto;
  width: 140rem;
  height: 15.2rem;
  background: #FFFFFF;
  box-shadow: 0px 3px 29px 0px rgba(0,68,155,0.08);
  list-style: none;
  display: flex;
  align-items: center;
  margin: 9.6rem auto 11.8rem;
}

.gzgq-partner li {
  flex: 1;
  display: flex;
}

.gzgq-partner img {
  width: 8.3rem;
  height: 8.3rem;
  object-fit: contain;
  margin: 0 2.2rem 0 9.7rem;
}

.gzgq-partner div {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid #E6E6E6;
  padding: 1rem 0;
}

.gzgq-partner ul h3 {
  font-size: 2rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #333333;
  margin: 0 0 1.2rem 0;
}

.gzgq-partner ul p {
  font-size: max(1.4rem, 14px);
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  margin: 0;
  padding: 0;
}

.gzgq-partner li:last-child div {
  border-right: none;
}

/* 产品服务 */
.product-service {
  background: rgba(0, 114, 220, 0.05);
  overflow: hidden;
}

.product-service-inner {
  max-width: 160rem;
  margin: auto;
}

.title {
  height: 20.3rem;
  position: relative;
}

.title-tip {
  position: absolute;
  left: 0;
  right: 0;
  top: 10rem;
  font-size: 4.8rem;
  color: #E0E3E9;
  text-align: center;
  font-family: Arial;
}

h2 {
  font-family: Microsoft YaHei;
  position: absolute;
  font-size: 4.8rem;
  font-weight: bold;
  color: #3A3A3A;
  text-align: center;
  top: 7.5rem;
  left: 0;
  right: 0;
  margin: 0;
  z-index: 2;
}

.product-service-item {
  display: flex;
  margin-bottom: 11.8rem;
}

.product-service-item img {
  width: 90rem;
  height: 52rem;
  object-fit: cover;
}

.product-service-content {
  padding-top: 2rem;
  padding-left: 14.7rem;
  flex: 1;
}

.product-service-name {
  height: 14.6rem;
  overflow: hidden;
}

.no-1 .product-service-name{
  background: url('../images/product/product_no_1.png') no-repeat left center;
  background-size: 14.7rem 100%;
}

.no-2 {
  padding-left: 0;
  padding-right: 8.6rem;
}

.no-2 .product-service-name{
  background: url('../images/product/product_no_2.png') no-repeat left center;
  background-size: 14.7rem 100%;
}

.no-3 .product-service-name{
  background: url('../images/product/product_no_3.png') no-repeat left center;
  background-size: 14.7rem 100%;
}

.product-service-name h3 {
  font-size: 3.6rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  margin: 7.3rem 0 1.6rem 0;
}

.peoduct-service-tip {
  font-size: max(1.6rem, 14px);
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #333333;
  margin: 2.6rem 0 0 0;
}

.product-service-name .underscore {
  width: 5.6rem;
  height: 0.6rem;
  background: #00449B;
}

.product-service-item p {
  margin: 5rem 0 3rem 0;
  font-size: max(1.6rem, 14px);
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3rem;
  text-indent: 2em;
}

.product-service-item button {
  width: 12rem;
  height: 3.7rem;
  border: 0.1rem solid #00449B;
  border-radius: 0.3rem;
  color: #00449B;
  outline: none;
  background: #fff;
  padding: 0;
  font-size: max(1.6rem, 14px);
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-service-item button:hover{
  color: #fff;
  background-color: #023e8d;
}

.product-service-item button a, .product-service-item a {
  display: inline-block;
}

.gzgq-case-list {
  height: 48rem;
  display: flex;
  column-gap: 2rem;
  margin-bottom: 9.4rem;
  overflow: hidden;
  text-align: center;
}

.gzgq-case-list .gzgq-case-item {
  height: 100%;
  flex: 1;
  position: relative;
}

.gzgq-case-item-mask {
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: none;
}

.gzgq-case-item-inner {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 2;
}

.gzgq-case-list .gzgq-case-item:first-child {
  background: url('../images/product/gzgq/case_bg_1.png') no-repeat;
  background-size: cover;
}

.gzgq-case-list .gzgq-case-item:last-child {
  background: url('../images/product/gzgq/case_bg_2.png') no-repeat;
  background-size: cover;
}

.gzgq-case-item .gzgq-case-name {
  font-size: 4.2rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF;
  margin: 16.2rem 0 3.2rem 0;
}

.gzgq-case-item p {
  font-size: 1.8rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  margin: 0 0 3.7rem 0;
}

.gzgq-case-item button {
  width: 20.1rem;
  height: 4.3rem;
  border: 0.1rem solid #FFFFFF;
  border-radius: 0.3rem;
  color: #fff;
  background: none;
  font-size: max(1.4rem, 14px);
}

.gzgq-case-item button a{
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 4.3rem;
}

.gzgq-case-list .gzgq-case-item:hover .gzgq-case-item-mask {
  display: block;
}

.gzgq-case-list .gzgq-case-item:hover button {
  border: 0.1rem solid #023e8d;
  background-color: #023e8d;
}

/* 招采 */
.top.ztx {
  background: url('../images/product/ztx/top_bg.png') no-repeat;
  background-size: cover;
}

.top.ztx .top-logo {
  width: 20rem;
  height: 7rem;
  object-fit: cover;
}

.ztx-intro {
  margin: auto;
  max-width: 160rem;
  padding: 7.6rem 20rem 10rem 20rem !important;
  overflow: hidden;
}

.ztx-intro h3 {
  font-size: 3.6rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #333333;
  text-align: center;
  margin: 0;
}

.ztx-intro p {
  font-size: 1.8rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3.6rem;
  margin: 5rem 0 6.3rem 0;
}

.ztx-cert-list {
  display: flex;
  justify-content: center;
  column-gap: 10rem;
}

.ztx-cert-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ztx-cert-item img {
  margin: 0 0 1.3rem 0;
  width: 29rem;
  height: 19rem;
}

.ztx-cert-item div {
  text-align: center;
  color: #333;
  font-size: max(1.6rem, 14px);
}

.ztx-system {
  height: 116rem;
  background: url('../images/product/ztx/system_bg.png') no-repeat;
  background-size: cover;
}

.ztx-system-inner {
  max-width: 160rem;
  margin: auto;
  overflow: hidden;
  text-align: center;
}

.ztx-system-inner .title-tip {
  color: rgba(254, 252, 242, 0.2);
}

.ztx-system-inner .title h2{
  color: #fff;
}

.ztx-system-inner img {
  width: 91rem;
  height: 91rem;
}

.product-service.ztx .product-service-item p {
  margin-top: 3.7rem;
}

/* 智慧城市 */
.top.city {
  background: url('../images/product/city/top_bg.png') no-repeat;
  background-size: cover;
}

.product-system {
  max-width: 160rem;
  margin: 0 auto 7.2rem auto;
}

.city-product-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}

.city-product-list li {
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 24rem;
  flex: 0 0 20%;
  border: 0.5rem solid #fff;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.city-product-list .city-product-inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.city-product-inner img {
  width: 4rem;
  height: 4rem;
  object-fit: contain;
  margin-bottom: 0.9rem;
}

.city-product-list span {
  font-size: 2rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF;
  z-index: 2;
}

.city-product-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.city-product-list li:hover .city-product-bg {
  transform: scale(1.2);
  transition: all .6s;
}


.city-product-list li:hover:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 2;
  background: rgba(0, 96, 178, 0.5);
}

.city-project {
  background: rgba(0, 114, 220, 0.05);
  margin-bottom: 10rem;
}

.city-project-inner  {
  max-width: 160rem;
  margin: auto;
}

.city-project-header {
  height: 12rem;
  display: flex;
}

.city-project-header-left {
  width: 32rem;
  padding: 1.6rem 0 0 1.4rem;
  position: relative;
  overflow: hidden;
}

.city-project-header-left h3 {
  font-size: 3.6rem;
  font-family: Microsoft YaHei;
  color: #333333;
  line-height: 3.2rem;
  margin: 0;
}

.city-project-header-left div {
  font-size: 1.4rem;
  font-family: Microsoft YaHei;
  color: #333333;
  line-height: 3.2rem;
}

.oblique-line {
  width: 15rem;
  height: 0.2rem;
  background: #054EAC;
  position: absolute;
  transform: rotate(110deg);
  left: 14rem;
  z-index: 1;
}

@keyframes fadeIn
{
  from {opacity: 0}
  to {opacity: 1}
}

@keyframes rotate {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}

.city-project-header ul {
  height: 100%;
  list-style: none;
  flex: 1;
  display: flex;
  background: #fff;
  margin: 0;
  padding: 0;
  z-index: 2;
}

.city-project-header li {
  height: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
}

.city-project-header li:after{
  display: none;
  content: '';
  position: absolute; 
  bottom: -0.9rem; 
  border-left: 1rem solid transparent; 
  border-right: 1rem solid transparent; 
  border-top: 1rem solid #054EAC;;
}

.city-project-header li span {
  width: 3.4rem;
  height: 3.4rem;
  cursor: pointer;
}

.city-project-header li label {
  margin-top: 1rem;
  font-size: max(1.6rem, 14px);
  font-family: Microsoft YaHei;
  color: #333333;
  line-height: 3.2rem;
  cursor: pointer;
}

.city-project-header li.public span {
  background: url('../images/product/city/project_ic_public.png') no-repeat;
  background-size: contain;
}

.city-project-header li.hospital span {
  background: url('../images/product/city/project_ic_hospital.png') no-repeat;
  background-size: contain;
}

.city-project-header li.office span {
  background: url('../images/product/city/project_ic_office.png') no-repeat;
  background-size: contain;
}

.city-project-header li.bank span {
  background: url('../images/product/city/project_ic_bank.png') no-repeat;
  background-size: contain;
}

.city-project-header li.market span {
  background: url('../images/product/city/project_ic_market.png') no-repeat;
  background-size: contain;
}

.city-project-header li.hotel span {
  background: url('../images/product/city/project_ic_hotel.png') no-repeat;
  background-size: contain;
}

.city-project-header li.edu span {
  background: url('../images/product/city/project_ic_edu.png') no-repeat;
  background-size: contain;
}

.city-project-header li.house span {
  background: url('../images/product/city/project_ic_house.png') no-repeat;
  background-size: contain;
}

.city-project-header li:hover, .city-project-header li.active {
  background: #054EAC;
  animation: fadeIn 0.3s;
}

.city-project-header li.active span {
  animation: rotate 1s;
}

.city-project-header li:hover label, .city-project-header li.active label{
  color: #fff;
}

.city-project-header li:hover:after, .city-project-header li.active:after{
  display: block;
}

.city-project-header li.public.active span{
  background: url('../images/product/city/project_ic_public_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.hospital.active span {
  background: url('../images/product/city/project_ic_hospital_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.office.active span {
  background: url('../images/product/city/project_ic_office_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.bank.active span {
  background: url('../images/product/city/project_ic_bank_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.market.active span {
  background: url('../images/product/city/project_ic_market_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.hotel.active span {
  background: url('../images/product/city/project_ic_hotel_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.edu.active span {
  background: url('../images/product/city/project_ic_edu_active.png') no-repeat;
  background-size: contain;
}

.city-project-header li.house.active span {
  background: url('../images/product/city/project_ic_house_active.png') no-repeat;
  background-size: contain;
}

.city-project-content {
  height: 52.5rem;
  background: #eee;
  position: relative;
}

.city-project-content-mask {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 84.2rem;
  background: url('../images/product/city/project_content_mask.png') no-repeat;
  background-size: contain;
  padding: 0 20.7rem 0 6.7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.city-project-content ul {
  width: 100%;
  height: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.city-project-content li {
  width: 100%;
  height: 100%;
  position: relative;
  display: none;
}

.city-project-desc {
  width: 56.8rem;
  position: absolute;
  z-index: 2;
  left: 6.8rem;
  top: 50%;
  transform: translate(0, -50%);
}

.city-project-content li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.city-project-desc p {
  margin: 0 0 3.4rem 0;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 3.2rem;
}

.city-project-desc button {
  outline: none;
  display: block;
  border: 0.1rem solid #FFFFFF;
  border-radius: 0.3rem;
  background: transparent;
  color: #fff;
  width: 12rem;
  height: 3.7rem;
  line-height: 3.7rem;
  text-align: center;
  padding: 0;
}

.city-project-desc button:hover {
  background-color: #023e8d;
  border: 0.1rem solid #023e8d;
  color: #fff;
}

.city-project-content li.active {
  display: list-item;
  animation: fadeIn 1s;
}

.city-case {
  max-width: 160rem;
  margin: auto;
}

.city-case-item {
  height: 60rem;
  display: flex;
  margin-bottom: 10rem;
}

.city-case-item img {
  width: 110rem;
  height: 60rem;
  object-fit: cover;
  margin: 0;
}

.city-case-item-right {
  flex: 1;
  height: 100%;
  padding: 6.6rem 0 0 16.5rem;
  position: relative;
}

.city-case-item-right h3 {
  font-size: 3.6rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3.2rem;
  position: relative;
}

.city-case-item-right p {
  font-size: max(1.4rem, 14px);
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3.2rem;
  margin: 0;
  padding-right: 8rem;
}

.city-example {
  width: 65rem;
  height: 30rem;
  background: #FFFFFF;
  box-shadow: 0.3rem 0.4rem 1rem 0px rgba(0,0,0,0.13);
  position: absolute;
  top: 18.4rem;
  left: -15rem;
  padding: 5.7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
}

.city-example p {
  font-size: max(1.4rem, 14px);
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3.2rem;
  margin: 0 0 4rem 0;
}

.city-example button {
  outline: none;
  width: 12rem;
  height: 3.8rem;
  border: 0.1rem solid #054EAC;
  border-radius: 0.3rem;
  background: #fff;
  color: #054EAC;
  text-align: center;
  line-height: 3.8rem;
  min-width: 70px;
  min-height: 32px;
  padding: 0;
  font-size: max(1.4rem, 14px);
}

.city-example button:hover {
  color: #fff;
  background-color: #023e8d;
}

.city-case-item:nth-child(even) .city-case-item-right{
  padding-left: 0;
}

.city-case-item:nth-child(even) .city-example{
  right: -15rem;
  left: auto;
}

.city-case-item:nth-child(odd) .city-case-item-right{
  padding-left: 2.7rem;
}

.city-case-item:first-child .oblique-line, .city-case-item:nth-child(3) .oblique-line {
  top: 7rem;
  left: 9rem;
}

.city-case-item:nth-child(2) .oblique-line {
  top: 7rem;
  left: 23rem;
}

.city-case-item:last-child  .oblique-line {
  top: 7rem;
  left: 34rem;
}

/* 房产数字化 */
.top.house {
  background: url('../images/product/house/top_bg.png') no-repeat;
  background-size: cover;
}

.house-channel {
  max-width: 160rem;
  margin: auto;
  padding: 8rem 10rem !important;
}

.house-channel h3 {
  font-size: 4.8rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #3A3A3A;
  margin: 0 0 1.2rem 0;
  text-align: center;
}

.house-channel-tip {
  text-align: center;
  font-size: 2rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #858585;
  margin-bottom: 4.9rem;
}

.house-channel p {
  font-size: 2rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  line-height: 3.6rem;
  text-indent: 1cm;
}

.house-channel-list {
  list-style: none;
  display: flex;
  justify-content: space-between;
  margin: 7.3rem 0 12.2rem 0;
  text-align: center;
}

.house-channel-list img {
  width: 12.2rem;
  height: 12.2rem;
  margin: 0 0 2.5rem 0;
}

.house-channel-list h4 {
  font-size: 3rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #333333;
  margin: 2.5rem 0 2rem 0;
}

.house-channel-list span {
  font-size: 2rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #333333;
  margin-right: 1rem;
}

.house-channel-list label {
  background: #F05A57;
  border-radius: 8px;
  color: #fff;
  font-size: 1.6rem;
  padding: 0 0.8rem;
  line-height: 2rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
}

.flow-datum {
  height: 91.7rem;
  background: url('../images/product/house/flow_datum_bg.png') no-repeat;
  background-size: cover;
}

.flow-datum .title-tip {
  color: rgba(254, 252, 242, 0.2);
}

.flow-datum .title h2{
  color: #fff;
}

.flow-datum-list {
  position: absolute;
  bottom: 4rem;
  left: 50%;
  transform: translate(-50%, 0);
  margin: auto;
  height: 10.4rem;
  width: 132.8rem;
  list-style: none;
  display: flex;
}

.flow-datum-list li {
  height: 100%;
  width: 33.2rem;
  border-right: 0.1rem solid #D2D2D2;
  padding: 0.5rem 0 0.5rem 6rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.flow-datum-list li:last-child {
  border-right: none;
}

.flow-datum-val {
  display: inline-block;
  font-size: 5.2rem;
  line-height: 5.2rem;
  font-family: DIN;
  font-weight: bold;
  color: #fff;
}

.flow-datum-val label {
  position: relative;
}

.flow-datum-val label:after{
  content: '';
  font-size: 1.8rem;
  color: #fff;
  position: absolute;
  right: -3rem;
  top: -1.5rem;
}

.flow-datum-text {
  font-size: 1.8rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #fff;
}

.flow-datum-list li:first-child label:after {
  content: '座';
}

.flow-datum-list li:nth-child(2) label:after {
  content: '家';
}

.flow-datum-list li:nth-child(3) label:after {
  content: '间';
}

.flow-datum-list li:last-child label:after {
  content: '次';
}

.channels {
  max-width: 160rem;
  margin: 0 auto 8rem auto;
}

.channels-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.channels-content img:first-child {
  width: 100rem;
  height: 8rem;
  object-fit: cover;
  margin: 4rem 0 10rem 0;
}

.channels-content img:last-child {
  width: 160rem;
  height: 58.2rem;
  object-fit: cover;
}

/* 详情页公共 css */
/* start */

.detail-title {
  text-align: center;
  font-size: 4.8rem;
  line-height: 4.8rem;
  /* margin-top: 8rem; */
  margin-bottom: 3rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #3A3A3A;
  position: relative;
  letter-spacing: 0.8rem;
}

.detail-title span {
  display: block;
  position: absolute;
  font-size: 4.8rem;
  font-family: Arial;
  font-weight: 400;
  color: #E0E3E9;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: -3.8rem;
  z-index: -1;
  white-space: nowrap;
  letter-spacing: normal;
}

.application-scenarios-content {
  height: 52rem;
  margin-top: 5rem;
 
}

/* end */

.partner {
  text-align: center;
}

.partner img {
  display: block;
  max-width: 168.8rem;
  height: 39.4rem;
  object-fit: contain;
  margin: auto;
}

.vantage {
  height: 88rem;
  background: url('../images/product/house/vantage_bg.png') no-repeat;
  background-size: cover;
}

.vantage .title-tip {
  color: rgba(254, 252, 242, 0.2);
}

.vantage .title h2{
  color: #fff;
}

.vantage-list {
  list-style: none;
  margin: 10.2rem auto 0 auto;
  display: flex;
  justify-content: center;
  column-gap: 2.7rem;
  height: 49.7rem;
}

.vantage-item {
  width: 38rem;
  height: 100%;
  position: relative;
  background: rgba(1, 62, 142, 0.8);
  cursor: pointer;
}

.vantage-item label {
  position: absolute;
  top: 6rem;
  right: 4rem;
  font-size: 16rem;
  font-family: DIN;
  font-weight: bold;
  font-style: italic;
  color: #0053BD;
  line-height: 5.4rem;
  opacity: 0.2;
  z-index: 1;
}

.vantage-item-content {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 2;
  padding: 10.9rem 4rem 9.7rem 4rem;
}

.vantage-item-content h3 {
  font-size: 3.6rem;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FEFEFE;
  line-height: 5.4rem;
  margin: 0 0 7rem 0;
  text-align: center;
}

.vantage-item-content p {
  font-size: 2.4rem;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #FEFEFE;
  line-height: 4.4rem;
  color: rgba(255, 255, 255, 0.6);
}

.vantage-item.active {
  background: #CDE3F5;
  transition: background-color 500ms linear;
}

.vantage-item.active label {
  color: rgba(0, 83, 189, 0.4);
}

.vantage-item.active h3 {
  color: #004098;
}

.vantage-item.active  p{
  color: #004098;
}