.container {
  margin: 0 auto;
  width: 1920px;
  background-color: #d9e1e8;
}
.top {
  background-color: #0033b3;
  text-align: center;
  padding: 10px 0;
}
.top p {
  color: #fff;
  font-size: 14px;
}
.header {
  width: 100%;
  position: relative;
  z-index: 1;
}
.bg,
.title,
.card-1,
.card-2,
.card-3,
.card-4,
.nail-left,
.nail-right,
.plane {
  display: none;
}
.plane {
  display: none !important;
}
.main {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  margin-top: -350px;
  z-index: 2;
}
.item1 {
  background-color: #3aaae4;
  filter: alpha(opacity=90);
  padding: 20px;
  margin-bottom: 100px;
}

/* item1 样式 */
.item1 ul {
  width: 100%;
  overflow: hidden;
}

.item1 ul li {
  float: left;
}

/* 第一个li：轮播图 */
.item1 .carousel {
  width: 620px;
  height: 450px;
  position: relative;
  margin-right: 10px;
}

.item1 .carousel .i-slider1 {
  position: relative;
  width: 100%;
  height: 100%;
}

.item1 .carousel .sliderInner {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.item1 .carousel .swiper-wrapper {
  width: 100%;
  height: 100%;
}

.item1 .carousel .swiper-slide {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.item1 .carousel .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
}

/* 轮播图文案：半透明黑底，位于图片上层底部 */
.item1 .carousel .carousel-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.8);
  filter: alpha(opacity=80);
  padding: 15px 20px;
  z-index: 10;
}

.item1 .carousel .carousel-caption p {
  color: #fff;
  font-size: 18px;
  text-align: center;
  padding-bottom: 10px;
}

/* 分页器样式 */
.item1 .carousel .slider-cur {
  position: absolute;
  left: 0;
  bottom: 10px;
  width: 100%;
  text-align: center;
  z-index: 20;
}

.item1 .carousel .swiper-pagination-switch {
  display: inline-block;
  width: 40px;
  height: 3px;
  margin: 0 5px;
  background-color: #fff;
  opacity: 0.5;
  filter: alpha(opacity=50);
  cursor: pointer;
}

.item1 .carousel .swiper-active-switch {
  opacity: 1;
  filter: alpha(opacity=100);
}

/* 第二个li：上图下字 */
.item1 .img-text {
  width: 240px;
  height: 450px;
  margin-right: 10px;
}

.item1 .img-text a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

.item1 .img-text img {
  width: 100%;
  height: 180px;
  display: block;
}

.item1 .img-text p {
  margin-top: 5px;
  height: 100px;
  line-height: 1.5;
  text-align: left;
  font-size: 20px;
  color: #fff;
}

/* 第三个li：三个段落，段落间有横线 */
.item1 .paragraphs {
  width: 280px;
  height: 450px;
  padding: 0 20px;
}

.item1 .paragraphs a {
  display: block;
  /* padding: 30px 0; */
  text-decoration: none;
}

.item1 .paragraphs a p {
  font-size: 20px;
  color: #fff;
  text-align: left;
  line-height: 1.5;
}

.item1 .paragraphs .line {
  height: 1px;
  background-color: #ddd;
  /* margin: 0 10px; */
  margin: 30px 0;
}

.item-header {
  overflow: visible;
  zoom: 1;
  padding: 20px;
}
.item-icon {
  float: left;
  margin-top: -90px;
  width: 280px;
}
.item-icon img {
  width: 100%;
  height: 100%;
  display: block;
}
.item-title {
  float: right;
  margin-top: -10px;
}
.item-title a {
  text-decoration: none;
}
.item-title h3 {
  margin: 0;
  padding: 0;
  font-size: 42px;
  color: #fcf577;
  font-weight: 700;
  font-style: italic;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
/* item2 样式 */
.item2 {
  background-color: #3aaae4;
  filter: alpha(opacity=75);
  padding: 0 30px;
  margin-bottom: 100px;
}

.item2 ul {
  overflow: hidden;
  zoom: 1;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  top: -20px;
  width: 100%;
}
.item2 ul li {
  float: left;
  height: 350px;
}
.item2 ul li.col1 {
  width: 48%;
  margin-right: 2%;
}
.item2 ul li.col2 {
  width: 23%;
  margin-right: 2%;
}
.item2 ul li.col3 {
  width: 25%;
}
/* 第一列两行布局 */
.item2 .col1 .row1 {
  height: 75%;
  overflow: hidden;
  zoom: 1;
  padding-bottom: 2%;
}
.item2 .col1 .row1 a {
  display: block;
  width: 100%;
  height: 100%;
}
.item2 .col1 .row1 .img-box {
  float: left;
  width: 60%;
  height: 100%;
}
.item2 .col1 .row1 .img-box img {
  width: 100%;
  height: 100%;
  display: block;
}
.item2 .col1 .row1 .text-box {
  float: left;
  width: 40%;
  height: 100%;
  background-color: #fff;
  padding: 10px;
}
.item2 .col1 .row1 .text-box p {
  font-size: 20px;
  text-align: left;
  line-height: 1.5;
}
.item2 .col1 .row2 {
  height: 23%;
  background-color: #1358d7;
  padding: 10px;
}
.item2 .col1 .row2 p {
  color: #fff;
  font-size: 20px;
}
/* 第二列上图下字布局 */
.item2 .col2 .img-box {
  height: 48%;
  overflow: hidden;
}
.item2 .col2 .img-box img {
  width: 100%;
  height: 100%;
  display: block;
}
.item2 .col2 .text-box {
  height: 48%;
  background-color: #fff;
  padding: 10px;
}
.item2 .col2 .text-box p {
  font-size: 20px;
  text-align: left;
  line-height: 1.5;
}
/* 第三列三行段落布局 */
.item2 .col3 .para {
  height: 30%;
  padding: 10px;
  margin-bottom: 3%;
}
.item2 .col3 .para.para1 {
  background-color: #ff8b00;
}
.item2 .col3 .para.para1 p {
  color: #fff;
  font-size: 20px;
  text-align: left;
  line-height: 1.5;
}
.item2 .col3 .para.para2 {
  background-color: #1358d7;
}
.item2 .col3 .para.para2 p {
  color: #fff;
  font-size: 20px;
  text-align: left;
  line-height: 1.5;
}
.item2 .col3 .para.para3 {
  background-color: #f6f1ee;
  margin-bottom: 0;
}
.item2 .col3 .para.para3 p {
  color: #000;
  font-size: 20px;
  text-align: left;
  line-height: 1.5;
}
.item2 p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.item {
  background-color: #63bef1;
  padding: 0 30px;
  margin-bottom: 100px;
}

.item3 ul {
  overflow: hidden;
  zoom: 1;
  padding-left: 30px;
  padding-right: 20px;
  position: relative;
  top: -20px;
  width: 100%;
}
.item3 ul li {
  display: inline-block;
  width: 24%;
  vertical-align: top;
  text-align: left;
}
.item3 ul li a {
  display: block;
}
.item3 ul li img {
  display: block;
  width: 100%;
}
.item3 ul li p {
  margin: 10px 0;
  padding: 0 10px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
}

.mr2 {
  margin-right: 1%;
}

/* item4 样式 */
.item4 ul {
  overflow: hidden;
  zoom: 1;
  clear: both;
  /* padding: 20px; */
}
.item4 ul li {
  float: left;
  height: 300px;
  width: 23.5%;
  margin-right: 2%;
  background-color: #fff;
  margin-bottom: 20px;
}
.item4 ul li a {
  display: block;
  height: 100%;
}
/* 图片容器，相对定位 */
.item4 .img-box {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.item4 .img-box img {
  width: 100%;
  height: 100%;
  display: block;
}
/* 文字容器，绝对定位在底部 */
.item4 .text-box {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 15px;
  background-color: rgba(0, 0, 0, 0.7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2000000, endColorstr=#B2000000);
  height: auto !important;
}
/* 为每四个元素添加特定样式，覆盖全局样式 */
.item4 li:nth-child(4n) {
  margin-right: 0;
}
.item4 .text-box h3 {
  margin: 0 0 8px 0;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}
.item4 .text-box p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #fff;
}
.bottom {
  position: relative;
  z-index: 1;
  margin-top: -500px;
}
.bottom img {
  width: 100%;
  height: 100%;
}
.footer {
  background-color: #1275b6;
  text-align: center;
  padding: 20px 0;
}
.footer p {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #fff;
}

/* ==================== 回到顶部按钮 ==================== */
.scroll-to-top {
  position: fixed;
  bottom: 15%;
  right: 30px;
  width: 50px;
  height: 50px;
  background: #a7a7a7;
  border-radius: 50%;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
  text-align: center;
  line-height: 50px;
}

.scroll-to-top.show {
  opacity: 1;
  visibility: visible;
}

.scroll-to-top:hover {
  background-color: #cfcfcf;
}

.scroll-to-top:active {
  background-color: #999;
}

.scroll-to-top img {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  margin-top: -8px;
}