
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", 
  Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", 
  "Segoe UI Emoji", "Segoe UI Symbol","PingFang SC",
  "Hiragino Sans GB",     
  "STHeiti",               
  "Microsoft YaHei",       
  "Microsoft JhengHei",    
  "Source Han Sans SC",   
  "Noto Sans CJK SC",
  "Source Han Sans CN",
  "Noto Sans SC",
  "Source Han Sans TC",
  "Noto Sans CJK TC",
  "WenQuanYi Micro Hei"
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.wrap {
  max-width: 1140px;
  margin: 0 auto;
}
main {
  margin: 0 auto;
}
nav {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  height: 55px;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.logo {
  width: 138px;
  height:auto;
  display: block;
}
header {
  width: 100%;
  height: 472px;
  background: url(../images/header.png) no-repeat center center / cover; 
}
nav .wrap {
  width: 100%;
  overflow: hidden;
}
header .wrap {
  height: 100%;
  overflow: hidden;
}
header h1 {
  margin-left: 67px;
  margin-top: 190px;
  font-size: 46px;
  font-weight: normal;
}
.title-1 {
  background: url(../images/title-1.png) no-repeat left 5px / 20px auto;
}
.title-2 {
  background: url(../images/title-2.png) no-repeat left 5px / 20px auto;
}
section:nth-of-type(1) {
  padding-bottom: 80px;
}
section:nth-of-type(1) ul {
  width: 100%;
  display: flex;
  list-style: none;
  justify-content: space-between;
}
section:nth-of-type(1) .wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
 h2 {
  text-align: center;
  display: inline-flex;
  padding:5px 10px;
  letter-spacing: 5px;
  font-size: 39px;
  font-weight: normal;
  margin-top: 80px;
  margin-bottom: 60px;
}
section:nth-of-type(1) h3 {
  font-size: 22px;
  text-align: center;
  margin: 30px 0;
}

section:nth-of-type(1) li {

  width: 240px;
}
section:nth-of-type(1) img {
  display: block;
  margin: 0 auto;
  height: 63px;
  width: auto;
}
section:nth-of-type(1) p {
  color: #2f2f2f;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
}
section:nth-of-type(2) {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
}
section:nth-of-type(2) .bg {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 232px;
  background: url(../images/section-2/bg.png) no-repeat left top / 100% 100%;
}
section:nth-of-type(2) {
  color: #fff;
}
section:nth-of-type(2) h2 {
  margin-top: 60px;
  margin-bottom: 15px;
}
section:nth-of-type(2) p {
  margin-bottom: 68px;
}
section:nth-of-type(2) img {
  margin-top: 80px;
  margin-bottom: 80px;
  display: block;
  width: 1140px;
  height: auto;
}
section:nth-of-type(3) .bg {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 232px;
  color: #fff;
  background: url(../images/section-3/bg.png) no-repeat left top / 100% 100%;
}
section:nth-of-type(3) .bg h2 {
  margin-top: 70px;
  margin-bottom: 20px;
}
section:nth-of-type(3) .bg p {
  letter-spacing: 2px;
}
section:nth-of-type(3) .wrap {
  overflow: hidden;
  margin-top: 56px;
  background: url(../images/section-3/ONLINE.png) no-repeat left top / 219px 50px;
  margin-bottom: 57px;
}

section:nth-of-type(3) .divider {
  display: flex;
}
section:nth-of-type(3) .divider .left {
  margin-right: 239px;
}
section:nth-of-type(3) .divider .left,
section:nth-of-type(3) .divider .right {
  padding-left: 118px;
  width: 440px;
}
section:nth-of-type(3) h4 {
  font-size: 22px;
  margin-bottom: 10px;
}
section:nth-of-type(3) .divider p {
  font-size: 20px;
  line-height: 25px;
  color: #2f2f2f;
  letter-spacing: 1px;
}
section:nth-of-type(3) .divider:nth-of-type(1) .left {
  background: url(../images/section-3/img-1.png) no-repeat left center / 90px auto;
}
section:nth-of-type(3) .divider:nth-of-type(1) .right {
  background: url(../images/section-3/img-2.png) no-repeat left center / 90px auto;
}
section:nth-of-type(3) .divider:nth-of-type(2) .left {
  background: url(../images/section-3/img-3.png) no-repeat left center / 90px auto;
}
section:nth-of-type(3) .divider:nth-of-type(2) .right {
  background: url(../images/section-3/img-4.png) no-repeat left center / 90px auto;
}
section:nth-of-type(3) .divider:nth-of-type(3) .left {
  background: url(../images/section-3/img-5.png) no-repeat left center / 90px auto;
}
section:nth-of-type(3) .divider:nth-of-type(3) .right {
  background: url(../images/section-3/img-6.png) no-repeat left center / 90px auto;
}
section:nth-of-type(4) {
  background-color: #faebe3;
  overflow: hidden;
}
section:nth-of-type(4) .bg {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 232px;
  color: #fff;
  background: url(../images/section-4/bg.png) no-repeat left top / 100% 100%;
}
section:nth-of-type(4) h3 {
  font-size: 30px;
  line-height: 22px;
  color: #191818;
  text-align: center;
}
section:nth-of-type(4) p {
  font-size: 20px;
  line-height: 29px;
  color: #2f2f2f;
}
.align-center {
  text-align: center;
}
section:nth-of-type(4) ul {
  list-style: none;
  display: flex;
  justify-content: center;
}
section:nth-of-type(4) h4 {
  margin: 20px 0 10px;
  font-size: 22px;
  line-height: 30px;
}
section:nth-of-type(4) .item p {
  font-size: 20px;
  color: #2f2f2f;
}
section:nth-of-type(4) .item img {
  display: block;
  height: 87px;
  width: auto;
  margin: 0 auto;
}
.solid-content {
  width: 1140px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.solid-content .item {
  width: 1140px;
  overflow: hidden;
}
section:nth-of-type(5) .bg {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 232px;
  color: #fff;
  background: url(../images/section-5/bg.png) no-repeat left top / 100% 100%;
}
section:nth-of-type(5) .bg h2 {
  margin-top: 70px;
  margin-bottom: 20px;
}
section:nth-of-type(5) .bg p {
  letter-spacing: 2px;
}
section:nth-of-type(5) img {
  display: block;
  width: 1140px;
  height: auto;
  margin: 60px auto;
}

footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: url(../images/footer/bg.png) no-repeat left top / 100% 100%;
  color: #fff;
}
footer h2 {
  margin-top: 25px;
  padding-bottom: 25px;
}
footer ul {
  width: 1140px;
  margin: 0 auto;
  padding-left: 216px;
  list-style: none;
  font-size: 20px;
  line-height: 34px;
  text-shadow: 0 0 5px #fb7a3b;
}
footer a,
footer a:hover,
footer a:active {
  color: #fff;
  text-decoration: none;
}
footer .copyright {
  width: 940px;
  margin: 66px auto;
  border-top: 1px solid #fd9d77;
  line-height: 80px;
  text-align: center;
}

body > main > nav > div > a {
  display: inline-block;
  padding: 8px 20px;
  background-color: #0066cc;
  color: #fff;
  border-radius: 4px;
  font-size: 14px;
  transition: background-color 0.3s;
  text-decoration: none;
}

body > main > nav > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}