body{background-color: #eef2fb;}

.header{background: #eef2fb;}

.header .nav li { display: inline-block; padding: 0 16px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
.header .nav li i.support{display: inline-block; width: 22px; height: 22px; background: url(../../images/20210721/support-ico.png) no-repeat; margin-top: 6px;}

.banner{padding-top: 60px;}
.banner h1{font-size: 56px; color: #53709f; text-align: center; padding-bottom: 5px;}
.banner p{font-size: 20px; color: #4b4b4b; text-align: center;}

.banner .Grid{padding: 50px 0;}
.banner .box{width: 263px; height: 500px; background: #3e7bda; box-shadow: 10px 10px #c6ccd7;}
.banner .box .title{background: url(../../images/20210721/title-bg.png) left bottom no-repeat; height: 140px; position: relative; left: -13px; top: 23px;}
.banner .box .title .txt{height: 121px; background-color: #283d5f; padding-left: 30px; box-sizing: border-box; color: #fff;}
.banner .box .title span{font-size: 54px; font-weight: 600; color: #fff;}
.banner .box .title dt{height: 60px; font-size: 34px; line-height: 60px; color: #fff;}
.banner .box .title dd{border-top: 2px solid #fff; width: 190px; height: 60px; box-sizing: border-box; font-size: 36px; line-height: 60px; color: #fff;}

.banner .box .con{padding-left: 20px; height: 230px; padding-top: 30px; box-sizing: border-box;}
.banner .box .img{height: 50px; padding: 0;}
.banner .box img{display: block;}
.banner .box h5{font-size: 30px; font-weight: 500; text-decoration: line-through; color: #fff; padding-top: 20px;}
.banner .box h2{font-size: 60px; font-weight: 600; color: #fff; padding-top: 15px;}
.banner .box button{width: 176px; height: 53px; border: none; border-radius: 6px; display: block; margin: 0 auto; margin-top: 30px; border-bottom: 5px solid #264880; font-size: 18px; font-weight: 500; color: #6187c4; cursor: pointer;}
.banner .box button:hover{background-color: #cad7f3; color: #3a5e97;}

.banner .box3{height: 580px; background: #1d4087; border: 5px solid #e9a335; box-sizing: border-box;}
.banner .box3 .title{background: url(../../images/20210721/title-bg1.png) left bottom no-repeat; height: 193px; left: -18px;}
.banner .box3 .title .txt{background-color: #e09319;}
.banner .box3 .title .best{height: 53px; background-color: #ff5400;}
.banner .box3 .title .best.Grid{padding: 0; padding-left: 30px;}
.banner .box3 .title .best i{display: inline-block; width: 33px; height: 32px; background: url(../../images/20210721/thumbs-up.png) center center no-repeat;}
.banner .box3 .title .best span{font-size: 24px; color: #fff; padding-left: 14px; padding-top: 5px;}
.banner .box3 .con{padding-top: 13px; height: 212px;}
/* .banner .box3 img{padding-top: 13px;} */
.banner .box3 button{border-bottom: 5px solid #f0990f;}

/* .banner .box4 img{padding-top: 24px;} */

.banner .banner-bottom-p{font-size: 20px; text-align: center; color: #4b4b4b; padding-top: 30px; padding-bottom: 120px;}
.banner .banner-bottom-p a{color: #4b4b4b; font-size: 20px;}
.banner .banner-bottom-p a:hover{color: #5092ff;}


.include{padding-bottom: 100px;}
.include .box{border: 4px solid #254164; border-radius: 13px; position: relative; background-color: #eef6ff; padding: 0px 80px 20px 80px; box-sizing: border-box;}
.include .box .title{height: 90px; width: 100%; max-width: 800px; box-sizing: border-box; border: 10px solid #eef6ff; display: block; border-radius: 45px; background-color: #287de7; line-height: 70px; text-align: center; font-size: 33px; color: #fff; font-weight: 600; padding: 0 40px; position: relative; left: 50%; transform: translateX(-50%); top: -45px;}
.include .box img{position: absolute; top: -75px; right: -45px; z-index: 10;}
.include .box h3{font-size: 60px; color: #254164; border-bottom: 3px solid #254164; text-align: center; margin-top: -30px;}
.include .box ul{padding: 20px 0; padding-left: 40px;}
.include .box li{list-style: url(../../images/20210721/blue-hook.png); font-size: 22px; color: #254164; width: 40%; padding: 20px 0; padding-left: 10px; box-sizing: border-box;}

.img-list{}
.img-list .con{border: 3px solid #cad7f3; border-width: 3px 0; padding: 25px 0;}
.img-list .con img{display: block; margin: 0 auto;}


.faq{padding-bottom: 100px; padding-top: 80px;}
.faq h2{font-size: 50px; font-weight: 400; text-align: center; color: #53709f; padding-bottom: 60px;}
.faq ul{list-style: none; padding: 15px 60px;}
.faq li{padding: 25px 35px; margin: 20px 0; border-bottom: 2px solid #cad7f3;}
.faq li h3{font-size: 24px; color: #53709f; background: url(../../images/20210721/+.png) left center no-repeat; cursor: pointer; padding-left: 70px;}
.faq li:hover{background-color: #fff; border-radius: 15px;}
.faq li p{font-size: 18px; color: #626262; padding: 0 10px; line-height: 26px; transform: scaleY(0); height: 0; overflow: hidden; padding-left: 70px;}

.faq li.act{background-color: #fff; border-radius: 15px; border: none;}
.faq li.act h3{background: url(../../images/20210721/-.png) left center no-repeat;}
.faq li.act p{padding-top: 35px; padding-bottom: 45px; transform: scaleY(1); height: auto;}

@media screen and (max-width: 1300px) {
  .include .box{width: calc(100% - 45px);}
}


@media (max-width: 1200px) {
  .Cell.\-3of12     { width: 100%; }

  .banner .box{width: 100%;}
  .banner .box img{margin: 0 auto;}
  .banner .box h5{text-align: center;}
  .banner .box h2{text-align: center;}

  .include .box li{width: 50%;}

  .faq ul{padding: 15px 10px;}
  .faq li{padding: 25px 10px;}
  .faq li h3{padding-left: 30px;}
  .faq li p{padding-left: 30px;}
}

@media (max-width: 1000px) {
  .include .box{padding: 0px 20px 20px 20px;}
  .include .box .title{height: auto;}
  .include .box li{width: 100%;}
}
