@font-face {
  font-family: 'PangMenZhengDao';
  src: url('../fonts/pangMenZhengDaoBiaoTiFont.ttf') format('truetype');
}
.titleFont {
  font-family: 'PangMenZhengDao' !important;
  font-size: 82px;
  font-weight: normal;
  font-stretch: normal;
  line-height: 78px;
  letter-spacing: 4px;
  color: #ffffff;
}
/* 这个是一体机的宽度容器，我这边加上是为了易于调试，后期也可以去掉，当然也可以留着*/
.container {
  height:100%;
  margin: 0 auto;
  background-image: linear-gradient(136deg, #1099fc 0%, #0a4cd5 100%);
  position: relative;
  z-index: 0;
  /*头*/
  /*身体*/
}
html{
height:100%;
}
body{
height:100%;
}
.container::after {
  content: '';
  width: 100%;
  height: 1231px;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background: url(../images/bg-bottom.png) no-repeat center center / 100% 100%;
  z-index: -1;
}
.container .header {
  margin: 0 0 100px;
}
.container .header img {
  margin: 80px 0 0;
  width: 188px;
  height: 192px;
  object-fit: cover;
  z-index: 1;
  position: relative;
}
.container .header .title {
  position: relative;
  z-index: 0;
}
.container .header .title::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -160px;
  width: 681px;
  height: 523px;
  background: url(../images/logo-bg.png) no-repeat center center / 100% 100%;
  z-index: -1;
}
.container .mod {
  position: relative;
  z-index: 1;
  /*标题*/
  /*列表*/
}
.container .mod .title {
  font-size: 46px;
  letter-spacing: 2px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 57px;
  /*机构设置及职能图标*/
  /*12309检察服务中心控告申诉图标*/
  /*第一检察部图标*/
  /*法律咨询图标*/
  /*12309检察服务中心案件管理图标*/
  /*来访指南图标*/
}
.container .mod .title .text::before {
  content: '';
  display: inline-block;
  width: 64px;
  height: 62px;
  margin-right: 12px;
  vertical-align: middle;
}
.container .mod .title .textTitle01::before {
  background: url(../images/title-icon-01.png) no-repeat center center / 100% 100%;
}
.container .mod .title .textTitle02::before {
  background: url(../images/title-icon-02.png) no-repeat center center / 100% 100%;
}
.container .mod .title .textTitle03::before {
  background: url(../images/title-icon-03.png) no-repeat center center / 100% 100%;
  position: relative;
  top: -6px;
}
.container .mod .title .textTitle04::before {
  background: url(../images/title-icon-04.png) no-repeat center center / 100% 100%;
  position: relative;
  top: -6px;
}
.container .mod .title .textTitle05::before {
  background: url(../images/title-icon-05.png) no-repeat center center / 100% 100%;
  position: relative;
  top: -6px;
}
.container .mod .title .textTitle06::before {
  background: url(../images/title-icon-06.png) no-repeat center center / 100% 100%;
  height: 50px;
  position: relative;
  top: -6px;
}
.container .mod .title .back {
  width: 166px;
  height: 66px;
  line-height: 66px;
  text-align: center;
  border-radius: 8px;
  border: solid 2px #ffffff;
  font-size: 38px;
  letter-spacing: 2px;
  cursor: pointer;
}
.container .mod .title .back::before {
  content: '';
  display: inline-block;
  width: 34px;
  height: 29px;
  background: url(../images/back.png) no-repeat center center / 100% 100%;
  margin-right: 12px;
}
.container .mod .box {
  /*首页列表图标*/
  /*蓝*/
  /*天蓝*/
  /*紫*/
  /*绿*/
  /*垂直排列*/
  /*蒙层*/
}
.container .mod .box .list {
  box-sizing: border-box;
  padding: 0 59px 0 136px;
  cursor: pointer;
  width: 48.5%;
  height: 260px;
  border-radius: 12px;
  margin: 0 3% 30px 0;
  display: flex;
  align-items: center;
  /*12309检察服务中心案件管理图标*/
}
.container .mod .box .list h2 {
  position: relative;
  /*默认是文件图标*/
}
.container .mod .box .list h2::before {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -68px;
  width: 44px;
  height: 54px;
  background: url(../images/secondary-title-01.png) no-repeat center center / 100% 100%;
  vertical-align: text-bottom;
}
.container .mod .box .list .theme02::before {
  background: url(../images/secondary-title-02.png) no-repeat center center / 100% 100%;
}
.container .mod .box .list .theme03::before {
  background: url(../images/secondary-title-03.png) no-repeat center center / 100% 100%;
}
.container .mod .box .indexIcon {
  padding: 0 59px 0 178px;
}
.container .mod .box .indexIcon h2::before {
  content: '';
  left: -126px;
  width: 86px;
  height: 86px;
}
.container .mod .box .indexIcon .byjs::before {
  background: url(../images/title-icon-07.png) no-repeat center center / 100% 100%;
  width: 84px;
  height: 85px;
}
.container .mod .box .indexIcon .gxfw::before {
  background: url(../images/title-icon-08.png) no-repeat center center / 100% 100%;
}
.container .mod .box .indexIcon .jgsz::before {
  width: 96px;
  height: 94px;
  background: url(../images/title-icon-01.png) no-repeat center center / 100% 100%;
}
.container .mod .box .indexIcon .lfzn::before {
  background: url(../images/title-icon-06.png) no-repeat center center / 100% 100%;
  width: 92px;
  height: 76px;
}
.container .mod .box .indexIcon .flzx::before {
  background: url(../images/title-icon-04.png) no-repeat center center / 100% 100%;
  width: 80px;
  height: 89px;
}
.container .mod .box .indexIcon .jcfwzxjs::before {
  background: url(../images/title-icon-09.png) no-repeat center center / 100% 100%;
  width: 72px;
  height: 93px;
}
.container .mod .box .indexIcon .jcfwzxgl::before {
  background: url(../images/title-icon-05.png) no-repeat center center / 100% 100%;
  width: 84px;
  height: 85px;
}
.container .mod .box .indexIcon .jcfwzxss::before {
  background: url(../images/title-icon-02.png) no-repeat center center / 100% 100%;
  width: 85px;
  height: 91px;
}
.container .mod .box .listThemeBlue {
  background-image: linear-gradient(180deg, #00bdfd 0%, #0082f4 100%);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
}
.container .mod .box .listThemeSkyBlue {
  background-image: linear-gradient(180deg, #01dfff 0%, #01b2cd 100%);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
}
.container .mod .box .listThemePurple {
  background-image: linear-gradient(180deg, #5e9cff 0%, #3973f1 100%);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
}
.container .mod .box .listThemeGreen {
  background-image: linear-gradient(180deg, #21eec9 0%, #05c999 100%);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
}
.container .mod .box .listTheme04 {
  background-image: linear-gradient(180deg, #00bdfd 0%, #0082f4 100%);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
}
.container .mod .box .marginRightNone {
  margin-right: 0;
}
.container .mod .box .marginBot60 {
  margin-bottom: 60px;
}
.container .mod .box .width {
  width:100%;
}
.container .mod .box .height215 {
  height: 215px;
}
.container .mod .box .height170 {
  height: 170px;
}
.container .mod .box .height190 {
  height: 190px;
}
.container .mod .box .height410 {
  height: 410px;
}
.container .mod .box .vertical {
  justify-content: center;
  padding: 110px 59px 0;
}
.container .mod .box .vertical h2 {
  position: relative;
  /*默认是文件图标*/
}
.container .mod .box .vertical h2::before {
  top: -100px;
  transform: translateX(-50%);
  left: 50%;
}
.container .mod .box .mantle {
  width: 100%;
  height: 1253px;
  background-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0px 12px 15px 0px rgba(26, 99, 220, 0.28);
  border-radius: 12px;
  box-sizing: border-box;
  padding: 36px;
  font-size: 44px;
  letter-spacing: 2px;
  text-indent: 88px;
  overflow-y: auto;
}
