@charset "UTF-8";

:root {
  /* 标题色 */
  --title-color: #BB3631;
  /* a标签色 */
  --a-color: #fd7f5c;
  /* 盒子内部颜色 */
  --box-color: rgb(255, 232, 231);
  --box-shallow-color: rgb(255, 250, 250);
  /* 模块背景色 */
  --mod-bg-color: #FFF5F4;
  /* 尾部色 */
  --footer-color: #be3a33;
  --footer-shallow-color: #c94f41;
  --footer-shallow-color2: #d16453;
}

a:hover,
a:hover h5 {
  color: var(--a-color) !important;
}

/* 主要内容 */
.mod-title .title {
  width: 100%;
  height: 32px;
  margin-bottom: 50px;
  font-size: 36px;
  color: var(--title-color);
  font-weight: 700;
  text-align: center;
  position: relative;

}

.mod-title .title span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}

.mod-title .title {
  background: url(/gasrmzfw/pc2023/images/msfwzq/title_hysy_bg.png) center top no-repeat;
}

/* item-title */
.item-title {
  font-size: 28px;
  line-height: 30px;
  color: var(--title-color);
  font-weight: 700;
  vertical-align: middle;
  margin-bottom: 19px;
}

.item-title::before {
  content: "";
  width: 28px;
  height: 28px;
  display: inline-block;
  background: url(/gasrmzfw/pc2023/images/msfwzq/title_purple_icon.png);
  vertical-align: middle;
  margin-right: 19px;
}


/* 婚姻服务 */
.hyfw-box .mod-content {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.hyfw-box .mod-content .content-item {
  position: relative;
  width: 47.7%;
  height: 210px;
  /* 渐变背景 */
  background: linear-gradient(175deg, var(--box-color) 0, var(--box-shallow-color) 100%);
  /* border-radius: 10px; */
  padding: 26px 36px;
  margin-bottom: 50px;
}


.hyfw-box .mod-content .content-item .bg {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
}

.hyfw-box .mod-content .content-item .tit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.hyfw-box .mod-content .content-item .tit h3 {
  font-size: 28px;
  color: #BB3631;
}


.hyfw-box .mod-content .content-item .cont li {
  color: #333333;
  font-size: 16px;
  line-height: 35px;
}
#yytd-list{
  width:70%;
}
#yytd-list li{
  float:left;
  width: 40%;
}
.hyfw-box .mod-content .content-item .cont,
.hyfw-box .mod-content .content-item .tit {
  position: relative;
  z-index: 2;
}

.hyfw-box .mod-content .content-item.chfw {
  flex-grow: 1;
  height: 305px;
}

.hyfw-box .mod-content .content-item.chfw .cont {
  height: 80%;
}

.hyfw-box .mod-content .content-item.chfw .cont ul {
  display: inline-flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 10px;
  height: 100%;
}

.hyfw-box .mod-content .content-item.chfw .cont ul li a {
  display: flex;
  align-items: center;
  column-gap: 10px;
  padding: 3px 13px;
  border: 1px solid var(--a-color);
  border-radius: 5px;
  background-color: rgba(255,255,255,.8);
}

/* 假期提醒 */
.jqtx-box {
  background-color: var(--mod-bg-color);
  padding-top: 68px;
}

.jqtx-box .mod-content {
  width: 100%;
  height: 472px;
  margin-bottom: 46px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-wrap: wrap;
  /* margin-top: 100px; */
  gap: 29px;
}

.jqtx-box .mod-content .content-item {
  padding: 19px;
  background-color: #fff;
  border-radius: 8px;
  display: flex;
  gap: 20px;
  flex-shrink: 0;
  max-width: 55.80%;
  flex-grow: 1;
}

.jqtx-box .mod-content .content-item:nth-child(-n+3) {
  max-width: 41.51%;
}

.jqtx-box .mod-content .content-item img {
  flex-shrink: 0;
  align-self: flex-start;
}

.jqtx-box .mod-content .content-item .right-text h5 {
  font-size: 22px;
  color: var(--title-color);
}

.jqtx-box .mod-content .content-item .right-text p {
  font-size: 16px;
  margin-top: 10px;
  line-height: 26px;
}
.jqtx-box .mod-content .content-item .right-text p i{
  font-style:normal;
  color:var(--title-color);
}

/* 商品房 */
.qgay-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 68px;
}

.qgay-box .content-item {
  display: inline-block;
  width: 32.14%;
}


/* 收养服务 */
.syfw-box .mod-content {
  border: 1px solid rgb(219, 222, 255);
  border-radius: 10px;
  width: 100%;
  padding: 20px 17px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.syfw-box .mod-content .content-item {
  width: 31.25%;
  position:relative;
  overflow:hidden;
}

.syfw-box .mod-content .content-item .iteminfo{
  width:100%;
  height:100%;
  padding-top:15px;
  position:absolute;
  left:-100%;
  top:0;
  text-align:center;
  background:rgba(255,255,255,.9);
  transition:all .5s;
}
.syfw-box .mod-content .content-item .iteminfo a{
  display:inline-block;
  margin:15px 20px;
}
.syfw-box .mod-content .content-item:hover .iteminfo{
  left:0;
}

/* 咨询投诉 */
.zxts-box .mod-content {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.zxts-box .content-item {
  display: inline-block;
  width: 47.7%;
  margin-bottom: 40px;
}

.zxts-box .img {
  width: 100%;
  height: 100%;
}


/* 尾部 */
.newfooter .yqlj {
  background: var(--footer-color);
}

.newfooter .wzinfo {
  background: var(--footer-shallow-color);
}

.newfooter .wzinfo .container>div {
  background: var(--footer-shallow-color2);
}
.newfooter .yqljlk {
  
}
/* 整体自适应 */
@media (max-width:1480px) {}

@media (max-width:1280px) {}

@media (max-width:1200px) {
  .hyfw-box .mod-content .content-item.chfw .cont ul li a {
    padding: 0 13px;
  }
  .hyfw-box .mod-content .content-item .cont{
    background:rgba(255,255,255,.8);
    padding:0 10px;
  }
  .jqtx-box .mod-content {
    width: 100%;
    height: 524px;
  }
}

@media (max-width:992px) {
  .jqtx-box .mod-content {
    height: auto;
  }

  .jqtx-box .mod-content .content-item {
    max-width: none !important;
    width: 100%;
  }

  .hyfw-box .mod-content .content-item {
    padding: 26px 18px;
  }
}

@media (max-width:768px) {
  .hyfw-box .mod-content .content-item {
    /* height: 310px; */
  }
}


@media (max-width:431px) {
  .hyfw-box .mod-content .content-item.chfw {
    height: auto;
  }
  #yytd-list li{
    width:50%;
  }
  .hyfw-box .mod-content .content-item.chfw .cont {
    height: auto;
  }

  .hyfw-box .mod-content .content-item.chfw .cont ul {
    gap: 15px;
    width: 100%;
  }

  .mod-title .title {
    font-size: 30px;
    margin-bottom: 30px;
  }

  .qgay-box .content-item,
  .qgay-box .content-item img {
    width: 100%;
  }

  .qgay-box {
    padding: 0 20px;
    gap: 20px;
    margin-bottom: 30px;
  }

  .syfw-box .mod-content .content-item,
  .syfw-box .mod-content .content-item img {
    width: 100%;
  }
  .syfw-box .mod-content {
    gap: 20px;
    padding: 20px;
  }

  .zxts-box .content-item {
    width: 100%;
    margin-bottom: 20px;
  }

  .hyfw-box .mod-content .content-item {
    width: 100%;
  }

  .hyfw-box .mod-content .content-item {
    margin-bottom: 20px;
  }

  .hyfw-box .xgzc-box .xgzc-item {
    width: 100%;
    margin-bottom: 20px;
  }

  .hyfw-box .xgzc-box .xgzc-item .item-content {
    padding: 0 20px;
  }


}