:root {
  --cm-width: 1195px;
}

body {
  background-color: #fff;
  color: #333;
}

a {
  text-decoration: none;
  color: #333;
}

body {
  background-image: url('../images/header_bg.jpg'); background-size: 1920px 840px; background-position: top center; background-repeat: no-repeat; 
}

.header {
  height: 840px;
}

.header--nav {
  color: #fff; transition: all .2s linear;
}
.header--nav.fixed {
  position: fixed; left: 0; right: 0; top: 0; background-color: #fff; box-shadow: 0 3px 5px rgba(0,0,0,.05);
}

.header--nav-container {
  width: var(--cm-width); margin: 0 auto; height: 110px;
}
.header--nav .logo-text {
  font-size: 22px; font-weight: 600; margin-left: .5em;
}
.header--nav.fixed .logo-text {
  color: #315ccb;
}
.header--nav-logo {
  margin: 0; margin-left: 20px;
}
.header--nav-menu {
  gap: 30px; padding: 0; margin: 0; list-style: none;
}
.header--nav-menu > li > a {
  color: #fff; padding: 15px 36px; border-radius: 50px;
}
.header--nav.fixed .header--nav-menu > li > a {
  color: #315ccb;
}
.header--nav-menu > li > a:not(.header--nav-menu__current):hover {
  background-color: rgba(255, 255, 255, 0.1); 
}

a.header--nav-menu__current {
  background-color: #fff; color: #315ccb !important;
}

.header--nav.fixed .header--nav-menu > li > a.header--nav-menu__current {
  background-color: #315ccb; color: #fff !important;
}


.header--banner {
  width: var(--cm-width); height: 730px; margin: 0 auto;
}

.header--banner-content {
  margin-left: 20px; color: #fff; padding-top: 180px;
}

.header--banner-content > .leading,
.header--banner-content > .text {
  font-weight: 600;
  text-shadow: 0px 0px 7px rgba(46, 91, 148, 0.36);
}

.header--banner-content > .leading {
  font-size: 50px;
}
.header--banner-content > .text {
  font-size: 38px;
}

.header--banner-content > .arrow {
  margin-top: 40px;
}

.section-container,
.footer-container {
  width: var(--cm-width); margin: 0 auto;
}

#about {
  margin-top: 44px;
}

.about--img {
  margin-left: 22px; margin-bottom: 25px; width: 536px; height: 390px;
}
.about--img > img {
  border-radius: 70px; box-shadow: -22px 25px 0 #f2f6ff;
}

.about--content {
  margin-left: 96px; min-height: 100%;
}



.s-header > .title {
  font-size: 40px; font-weight: 600; color: #315ccb; margin: 0; padding: 0;
}
.s-header > .sub {
  color: #b8b8b8; font-size: 20px; text-transform: uppercase; letter-spacing: 6px; margin-top: .25em;
}

.s-content {
  margin-top: 1rem; line-height: 36px; font-size: 18px; color: #666;
}


#service {
  margin-top: 164px;
}

.service--img {
  width: 422px; margin-right: 26px; margin-bottom: 28px; margin-left: 140px;
}
.service--img > img {
  border-radius: 70px; box-shadow: 26px 28px 0 #f2f6ff;
}

.service--content {
  margin-right: 80px;
}

.s-group {
  margin-top: 40px;
}

.s-group > .item {
  background-color: #f2f6ff; width: 240px; height: 92px; border-radius: 11px; box-sizing: border-box; padding: 0 36px 0 28px; margin-right: 1rem; color:  #666;
}
.s-group > .item img {
  margin-right: 12px;
}

.footer {
  background-image: url('../images/footer_bg.jpg'); background-size: 1920px 535px; background-repeat: no-repeat; background-position: center top; margin-top: 64px; height: 535px; color: #fff;
}
.footer-container {
  height: 434px;
}
.footer--leading > .title {
  padding: 0; margin: 0; font-size: 40px; font-weight: 600;
}
.footer--leading > .sub {
  font-size: 20px; text-transform: uppercase; letter-spacing: 6px; margin-top: .25em; color: rgba(255,255,255,.8);
}

.footer-container {
  padding-top: 130px;
}
.contact--content {
  margin-top: 24px;
}
.contact--content > .item {
  width: 50%; font-size: 22px; padding: 8px 0; line-height: 46px;
}
.contact--content > .item > .item {
  padding: 2px 0;
}

.contact--content .item > img {
  margin-right: .3em;
}

.contact--content > .item > img {
  margin-top: .5rem;
}


.footer-copyright {
  text-align: center; font-size: 18px; color: rgba(255, 255, 255, 0.5); height: 100px; line-height: 100px;
}