html {
  scroll-behavior: smooth;
}

.ui-header {
  height: 110px;
}

.ui-header > .ui-header-profile {
  width: 1400px;
  margin: 0 auto;
  padding-left: 12px;
}

.ui-logo {
  padding-top: 26px;
}

.ui-logo > a {
  display: block;
  width: 197px;
  height: 56px;
}

.ui-logo > a > img {
  width: 100%;
}

.ui-nav > ul {
  font-size: 0;
  padding-top: 22px;
}

.ui-nav > ul > li {
  display: inline-block;
  margin-left: 113px;
  text-align: center;
}

.ui-nav > ul > li > a > img {
  display: block;
  margin: 0 auto;
}

.ui-nav > ul > li > a {
  display: block;
  font-size: 25px;
  color: #474747;
}

.ui-nav > ul > li > a:after {
  content: "";
  display: block;
  margin: 2px auto 0;
  width: 96px;
  height: 2px;
  background: #fff;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
}

.ui-nav > ul > li:hover a:after {
  background: #30d1ae;
}

.ui-banner {
  padding-top: 463px;
  width: 100%;
  height: 604px;
  background: url(../img/banner.png) no-repeat;
}

.ui-banner > a {
  margin: 0 auto;
  display: block;
  width: 272px;
  height: 70px;
  text-align: center;
  line-height: 70px;
  border: 2px solid #fff;
  border-radius: 3px;
  font-size: 23px;
  color: #fff;
  transition: background-color 0.5s ease;
  -webkit-transition: background-color 0.5s ease;
  -moz-transition: background-color 0.5s ease;
  -ms-transition: background-color 0.5s ease;
  -o-transition: background-color 0.5s ease;
}

.ui-banner > a:hover {
  background-color: #289149;
}

.ui-ifox {
  height: 783px;
  background: url(../img/bg.jpg) no-repeat;
}

.ui-ifox-profile {
  width: 1400px;
  margin: 0 auto;
  padding-top: 202px;
}

.ui-ifox-profile > .ui-content-left {
  padding-top: 56px;
}

.ui-content-title {
  margin-bottom: 120px;
}

.ui-content-title > p {
  font-size: 60px;
  color: #30d2b2;
}

.ui-content-text > p {
  font-size: 36px;
  color: #000;
  font-weight: 100;
  margin-bottom: 10px;
}

.ui-read {
  height: 771px;
  background: #eeeeee;
}

.ui-read-profile {
  width: 1400px;
  margin: 0 auto;
  padding-top: 184px;
}

.ui-read-profile > .ui-content-right {
  padding-top: 61px;
}

.ui-group {
  height: 777px;
  background: url(../img/bg.jpg) no-repeat;
}

.ui-group-profile {
  width: 1400px;
  margin: 0 auto;
  padding-top: 119px;
}

.ui-group-profile > .ui-content-left {
  padding-top: 170px;
}

.ui-group-profile > .ui-content-left > .ui-content-title {
  margin-bottom: 72px;
}

.ui-type {
  height: 788px;
  background: #eeeeee;
}

.ui-type-profile {
  width: 1400px;
  margin: 0 auto;
  padding-top: 130px;
}

.ui-type-profile > .ui-content-right {
  padding-top: 176px;
}

.ui-type-profile > .ui-content-right > .ui-content-title {
  margin-bottom: 72px;
}

.ui-diy-profile {
  width: 1400px;
  margin: 0 auto;
  text-align: center;
  font-size: 0;
  padding-top: 124px;
}

.ui-diy-profile > div {
  display: inline-block;
  width: 503px;
  height: 489px;
  padding-top: 66px;
  background: url(../img/bg_diy.png) no-repeat;
}

.ui-diy-profile > div:first-of-type {
  margin-right: 360px;
}

.ui-diy-profile > div > div {
  font-size: 36px;
  margin-top: 24px;
  margin-bottom: 16px;
}

.ui-diy-profile > div > p {
  font-size: 24px;
  font-weight: 100;
  color: #838383;
}

.ui-diy-profile > div > p:last-of-type {
  margin-bottom: 52px;
}

.ui-diy-profile > div > a {
  font-size: 24px;
  color: #01ce92;
}

.ui-diy-profile > div > a:hover {
  text-decoration: underline;
}

.ui-footer-profile {
  width: 1400px;
  margin: 0 auto;
  text-align: center;
  padding: 180px 0 118px;
}

.ui-footer-profile > p {
  font-size: 48px;
  color: #000;
}

.ui-footer-profile > a {
  display: block;
  width: 390px;
  height: 108px;
  line-height: 108px;
  font-size: 30px;
  color: #fff;
  background: #36b45d;
  border-radius: 8px;
  margin: 32px auto 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
}

.ui-footer-profile > a:hover {
  background: #289149;
}