﻿@charset "utf-8";
/* CSS Document */
.pensionKV{height: 542px; background-image: url(../img/pension/kv.png);}
.pensionKV h3{text-align: center; line-height: 2em; font-weight: 700;}
.pensionKV .titleSlogen{left:auto; right: 0;    transform: translateY(-80%);  text-shadow: 0px 2px 4px rgba(0,0,0,0.5);}

.busContent .titleHd{padding-bottom:1.2em}

.pension1 .aboutW{ padding:80px 0;}
.pension1 .busPic{margin-right: 3.4%;}
.pension1 .busContent {padding-top: 0;width: 43%;}
.pension1 .busContent .titleHd{padding-top: 0;}

.pension2{color: #333; height: auto; padding:20px 0 70px;  background: #f8f9fa; }
.pension2 hr{ border: dashed 0.5px #979797; margin-top: 50px;}
.pension2 .titleHd h1{ padding:1em 0;}
.pension2 ul{display: flex; justify-content: space-between;}
.pension2 li{position: relative; overflow: hidden;  border-radius: 25px; overflow: hidden; line-height: 0; cursor: pointer;}
.pension2 li img{width: 100%;}
.pension2 li h3{position: absolute;width: 100%; left: 0; top: 50%; transform: translateY(-50%);  color: #fff;text-align: center;display: block;  z-index: 1;}
.pension2 li::after{display: block; content:""; position: absolute; left: 0; top:0;width: 100%; height: 100%; background: rgba(156,121,60,0.51);-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.pension2 li:hover::after{background: rgba(126,0,0,0.70);}
.pension2 .u1 li{width: 31.1%;}
.pension2 .u2 li{width: 23.1%;}

.pension3{  background: linear-gradient(90deg, #FDF9F8, #FDF1EF);}
.pension3 .busContent{width: 43%; margin-top:6%;}
.pension3 .busPic{width:47.4%; margin-bottom: 0;}

.pension4{padding: 70px 0; color: #333;}
.pension4 .titleHd h1{margin-bottom:1em;}
.pension4 ul{display: flex; justify-content: space-between;}
.pension4 li{width:23.5%;border-radius: 8px;overflow: hidden; cursor: pointer; box-shadow: 0px 4px 12px rgba(94,74,74,0.2);background: #fff;}
.pension4 li h3{ height: 88px; width: 100%;text-align: center; color: #fff; line-height:80px; background: #7b7e7e;-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;position: relative;}
.pension4 li:hover h3{background: #a4001e url(../img/pension/bj.png); background-size: 100% auto}
.pension4 li h3::after{display: block; content:""; position: absolute; right:-10%; bottom: 0; width: 100px; /* 梯形的宽度 */
  height: 0; /* 梯形的高度，初始为0 */
  border-bottom: 18px solid #fff; /* 底部边框形成梯形的底部 */
  border-left: 20px solid transparent; /* 左边的透明边框 */
  border-right: 20px solid transparent; /* 右边的透明边框 */}
.pension4 li p{ padding: 1.2em 8%;}

.pension5{  background: #f8f9fa; padding: 70PX 0;}
.pension5 .fl{width:60.916%;}
.pension5 .fr{width: 32.916%;}
.pension5 .titleHd h1{ margin-bottom:1.2em;}
.pension5 dl{}
.pension5 dt{ color:#292929; padding-left:60px; position: relative; line-height:2.2em;}
.pension5 dt b ,.pension5 .titleHd h1 b{color: #a4001e; font-weight:normal;}
.pension5 dt span{display:flex; width: 40px;position: absolute; left: 0; top: 0; align-items: center; justify-content: center;
  height: 40px;
  border-radius: 9px;
  background: #a1001e;}
.pension5 dd{width:90%; background: #dcdcdc; height: 1px; display: block; margin: 10px 0;}

.pension6{text-align: center;color: #898989;  padding:2em 0 1.8em; overflow: hidden; }
.pension6 p{display: block;line-height:1.6em;}

@media (max-width:1366px) {
    .pension1 .aboutW{ padding:70px 0 60px;}
.pension1 .busContent{width:54%;}

.pension2{    padding: 10px 0 50px;}
.pension2 .titleHd h1{ padding:.6em 0;}
.pension2 li h3 ,.pension2 .titleHd h1 ,.pension4 .titleHd h1 ,.pension5 .titleHd h1{font-size: 32px;} .pension4 li h3{font-size:26px}

.pension4 ,.pension5{    padding: 50px 0;}
.pension5 .font20{ font-size: 18px;}

.pension5 .font22{font-size: 20px;}
.pension5 .font20{font-size: 18px;}


}