body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, button, textarea, select, option, p, blockquote, th, td {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    outline: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

ol, ul {
    list-style: none;
}

caption, th {
    text-align: left;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before, q:after {
    content: '';
}

abbr, acronym {
    border: 0;
}

.clear {
    clear: both;
}

pre {
    font-size: 14px;
}
/*@c_g1: #686868;
@c_b1: #284263;
@c_b1: #284263;
@c_b2: #6a9bdd;
@c_b2: #6a9bdd;
@c_b3: #59d4fe;
@c_b4: #e5f8ff;
@c_p1: #a078fc;*/
/*
.gradient_header(@from, @to) {
  background-color: @from; !* For browsers that do not support gradients *!
  background: linear-gradient(to bottom right, @from 65%, @to); !* Standard syntax *!
}

.shadow(@data) {
  -moz-box-shadow: @data;
  -webkit-box-shadow: @data;
  box-shadow: @data;
}*/
* {
  box-sizing: border-box;
}
body {
  background-color: #e2e2e2;
  color: #7c7c7c;
  font-family: 'Roboto', sans-serif;
}
body.no_scroll {
  overflow: hidden;
}
.clearfix::after {
  content: '';
  display: table;
  clear: both;
}
.table {
  display: table;
  width: 100%;
}
.tr {
  display: table-row;
}
.td {
  display: table-cell;
}
.main .staff {
  overflow: hidden;
}
.main .staff .wrap {
  width: 1920px;
  margin: 0 auto;
  padding: 0 106px;
}
.main .staff .wrap .member_cont {
  position: relative;
  height: 100vh;
  min-height: 590px;
}
.main .staff .wrap .member_cont .member {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  height: 100%;
  width: 100%;
  transition: opacity 1000ms ease-in-out;
}
.main .staff .wrap .member_cont .member.active {
  opacity: 1;
}
.main .staff .wrap .member_cont .member .label {
  z-index: 5;
  position: relative;
  width: 45%;
  float: left;
  height: 100%;
}
.main .staff .wrap .member_cont .member .label .text_cont {
  height: 100%;
}
.main .staff .wrap .member_cont .member.member3 .label .text_cont.table {
    width: 130%;
}
.main .staff .wrap .member_cont .member .label .text_cont h2 {
  vertical-align: middle;
  font-size: 106px;
  font-weight: 700;
  color: white;
  line-height: 0.9;
  letter-spacing: -3px;
}
.main .staff .wrap .member_cont .member .label .text_cont h2 span {
  color: #e2ccbb;
}
.main .staff .wrap .member_cont .member .img_cont {
  position: relative;
  float: left;
  width: 55%;
  height: 100%;
}
.main .staff .wrap .member_cont .member .img_cont img {
  display: inline-block;
  position: absolute;
  bottom: 0;
  height: 90%;
}
.main .staff .wrap .member_cont .member .img_cont img.left {
  left: 0;
}
.main .staff .wrap .member_cont .member .img_cont img.right {
  right: 90px;
}
.main .staff .wrap .member_cont .member .img_cont img.right.member1 {
  right: 300px;
}
.main .staff .wrap .member_cont .member .img_cont img.right.member3 {
  right: 10px;
}
.main .main_bottom {
  background-color: white;
}
.main .main_bottom .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 199px 240px 216px;
}
.main .main_bottom .wrap h2 {
  font-size: 104px;
  font-weight: 700;
  line-height: 0.86;
  letter-spacing: -3px;
}
.main .main_bottom .wrap .description {
  font-weight: 300;
  font-size: 73px;
  line-height: 1.1;
  letter-spacing: -1px;
  padding: 73px 0 35px;
}
.main .main_bottom .wrap .meet_us {
  text-decoration: none;
  color: #7c7c7c;
  font-size: 82px;
  font-weight: 700;
  letter-spacing: -2px;
}
.main .main_bottom .wrap .meet_us span {
  display: inline-block;
  color: #7c7c7c;
  font-size: 132px;
  font-weight: 100;
  position: relative;
  top: 20px;
  transition: transform 1s;
}
.main .main_bottom .wrap .meet_us:hover span {
  transform: rotate(180deg);
}
@media (max-width: 1880px) {
  .main .staff .wrap {
    width: 1200px;
    padding: 0 60px;
  }
  .main .staff .wrap .member_cont .member .label {
    width: 45%;
  }
  .main .staff .wrap .member_cont .member .label .text_cont h2 {
    font-size: 88px;
  }
  .main .staff .wrap .member_cont .member2 .label .text_cont h2 {
      padding-left: 60px;
  }
  .main .staff .wrap .member_cont .member .img_cont {
    width: 55%;
  }
  .main .staff .wrap .member_cont .member .img_cont img {
    height: 85%;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member1 {
    right: 150px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member2 {
    left: -20px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member3 {
    right: 170px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member4 {
    left: -70px;
  }
  .main .main_bottom .wrap {
    padding: 170px 125px 150px;
  }
  .main .main_bottom .wrap h2 {
    font-size: 94px;
  }
  .main .main_bottom .wrap .description {
    font-size: 60px;
    padding: 65px 0 35px;
  }
  .main .main_bottom .wrap .meet_us {
    font-size: 70px;
  }
  .main .main_bottom .wrap .meet_us span {
    font-size: 106px;
    top: 12px;
  }
}
@media (max-width: 1200px) {
  .main .staff .wrap {
    width: 992px;
    padding: 0 30px;
  }
  .main .staff .wrap .member_cont .member .label {
    width: 50%;
  }
  .main .staff .wrap .member_cont .member .label .text_cont h2 {
    font-size: 80px;
    vertical-align: bottom;
    padding-bottom: 90px;
  }
  .main .staff .wrap .member_cont .member .img_cont {
    width: 50%;
  }
  .main .staff .wrap .member_cont .member .img_cont img {
    height: 80%;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member1 {
    right: 80px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member3 {
    right: 170px;
  }
  .main .main_bottom .wrap {
    padding: 150px 100px 90px;
  }
  .main .main_bottom .wrap h2 {
    font-size: 80px;
  }
  .main .main_bottom .wrap .description {
    font-size: 40px;
    padding: 57px 0 37px;
  }
  .main .main_bottom .wrap .meet_us {
    font-size: 56px;
  }
  .main .main_bottom .wrap .meet_us span {
    font-size: 82px;
    top: 9px;
  }
}
@media (max-width: 992px) {
  .main .staff .wrap {
    width: 768px;
    padding: 0 30px;
  }
  .main .staff .wrap .member_cont {
    min-height: 475px;
  }
  .main .staff .wrap .member_cont .member .label {
    width: 60%;
  }
  .main .staff .wrap .member_cont .member .label .text_cont h2 {
    font-size: 68px;
  }
  .main .staff .wrap .member_cont .member .img_cont {
    width: 40%;
  }
  .main .staff .wrap .member_cont .member .img_cont img {
    height: 75%;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member1 {
    right: -20px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member3 {
    right: -50px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member2 {
    left: -20px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member4 {
    left: -100px;
  }
  .main .main_bottom .wrap {
    padding: 130px 80px 70px;
  }
  .main .main_bottom .wrap h2 {
    font-size: 68px;
    line-height: 1;
  }
  .main .main_bottom .wrap .description {
    font-size: 34px;
    padding: 50px 0 30px;
  }
  .main .main_bottom .wrap .meet_us {
    font-size: 48px;
  }
  .main .main_bottom .wrap .meet_us span {
    font-size: 70px;
    top: 8px;
  }
}
@media (max-width: 768px) {
  .main .staff .wrap {
    width: 576px;
    padding: 0 25px;
  }
  .main .staff .wrap .member_cont {
    min-height: 475px;
  }
  .main .staff .wrap .member_cont .member .label {
    width: 60%;
  }
  .main .staff .wrap .member_cont .member .label .text_cont h2 {
    font-size: 64px;
  }
  .main .staff .wrap .member_cont .member .img_cont {
    width: 40%;
  }
  .main .staff .wrap .member_cont .member .img_cont img {
    height: 70%;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member1 {
    right: -20px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member3 {
    right: 0px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member2 {
    left: -60px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member4 {
    left: -220px;
  }
  .main .main_bottom .wrap {
    padding: 110px 60px 20px;
  }
  .main .main_bottom .wrap h2 {
    font-size: 46px;
  }
  .main .main_bottom .wrap .description {
    font-size: 26px;
    padding: 45px 0 25px;
    line-height: normal;
  }
  .main .main_bottom .wrap .meet_us {
    font-size: 36px;
  }
  .main .main_bottom .wrap .meet_us span {
    font-size: 50px;
    top: 6px;
  }
}
@media (max-width: 576px) {
  .main .staff .wrap {
    width: 320px;
    padding: 0 20px;
  }
  .main .staff .wrap .member_cont {
    min-height: 380px;
  }
  .main .staff .wrap .member_cont .member .label {
      width: 80%;
  }
    .main .staff .wrap .member_cont .member.member3 .label .text_cont.table {
        width: 100%;
    }
  .main .staff .wrap .member_cont .member .label .text_cont h2 {
    font-size: 46px;
    padding-bottom: 100px;
  }
  .main .staff .wrap .member_cont .member .img_cont {
    width: 20%;
  }
  .main .staff .wrap .member_cont .member .img_cont img {
    height: 70%;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member1 {
    right: -60px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.right.member3 {
    right: 0px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member2 {
    left: -90px;
  }
  .main .staff .wrap .member_cont .member .img_cont img.left.member4 {
    left: -100px;
  }
  .main .main_bottom .wrap {
    max-width: 320px;
    padding: 90px 30px 0;
  }
  .main .main_bottom .wrap h2 {
    font-size: 38px;
  }
  .main .main_bottom .wrap .description {
    font-size: 22px;
    padding: 40px 0 20px;
  }
  .main .main_bottom .wrap .meet_us {
    font-size: 28px;
  }
  .main .main_bottom .wrap .meet_us span {
    font-size: 42px;
    top: 6px;
  }
}
#header {
  position: absolute;
  width: 100%;
  z-index: 2000;
}
#header .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 40px 40px 0;
}
#header .wrap .logo {
  float: left;
}
#header .wrap .logo img {
  width: auto;
  height: 50px;
}
#header .wrap .header_right {
  float: right;
}
#header .wrap .header_right .nav li {
  display: inline-block;
  margin: 0 47px 0 0;
}
#header .wrap .header_right .nav li.contact {
  margin: 0;
}
#header .wrap .header_right .nav li a {
  display: inline-block;
  color: white;
  text-decoration: none;
  font-size: 22px;
  font-weight: 700;
  line-height: 22px;
  transition: color 300ms;
}
#header .wrap .header_right .nav li a:active,
#header .wrap .header_right .nav li a:hover {
  color: #7c7c7c;
}
#header .wrap .header_right .mob {
  display: none;
  padding-top: 5px;
  cursor: pointer;
}
#header .wrap .header_right .mob svg {
  width: 70px;
  height: 23px;
}
#header .mob_nav {
  display: none;
  padding: 15px;
  z-index: 100;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: #cfcece;
}
#header .mob_nav .close_btn {
  position: fixed;
  right: 25px;
  top: 25px;
  z-index: 110;
  cursor: pointer;
  width: 38px;
  height: 38px;
  background: url(../img/close.png) no-repeat center;
  background-size: cover;
}
#header .mob_nav .menu_cont {
  height: 100%;
}
#header .mob_nav .menu_cont .mob_list {
  vertical-align: middle;
  list-style-type: none;
}
#header .mob_nav .menu_cont .mob_list li {
  width: 100%;
  padding: 10px;
  text-align: center;
}
#header .mob_nav .menu_cont .mob_list li a {
  display: inline-block;
  margin: 0 auto;
  color: white;
  text-decoration: none;
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  transition: color 300ms;
}
#header .mob_nav .menu_cont .mob_list li a.active,
#header .mob_nav .menu_cont .mob_list li a:hover {
  color: #7c7c7c;
}
@media (max-width: 768px) {
  #header .wrap .header_right .nav {
    display: none;
  }
  #header .wrap .header_right .mob {
    display: block;
  }
}
#footer {
  background-color: white;
}
#footer .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 85px 240px;
  font-weight: 300;
  font-size: 16px;
}
#footer .wrap .socials {
  padding-bottom: 8px;
}
#footer .wrap .socials a {
  display: inline-block;
  margin-right: 5px;
}
#footer .wrap .socials a span svg {
  width: 38px;
  height: 38px;
}
#footer .wrap .copyright {
  float: left;
  padding-top: 8px;
}
#footer .wrap .copyright li {
  padding-top: 2px;
}
#footer .wrap .copyright li a {
  text-decoration: none;
  color: #7d7d7d;
}
#footer.contact .wrap {
  padding: 85px 135px;
}
#footer.work .wrap {
  padding: 85px 140px;
}
#footer.about .wrap {
  padding: 85px 140px;
}
#footer.approach .wrap {
  padding: 85px 135px;
}
#footer .foot_popup {
  background-color: #cecece;
  display: none;
  z-index: 2100;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 100%;
  left: 0;
  overflow-y: hidden;
  transition: top 1s;
}
#footer .foot_popup.open {
  display: block;
}
#footer .foot_popup.show {
  top: 0;
}
#footer .foot_popup.hide {
  top: 100%;
}
#footer .foot_popup .close_btn {
  position: absolute;
  right: 35px;
  top: 35px;
  z-index: 110;
  cursor: pointer;
  width: 38px;
  height: 38px;
  background: url(../img/close.png) no-repeat center;
  background-size: cover;
}
#footer .foot_popup .popup_wrap {
  padding: 270px 270px 100px;
}
#footer .foot_popup .popup_wrap a {
  text-decoration: none;
  color: white;
}
#footer .foot_popup .popup_wrap h3 {
  font-size: 88px;
  font-weight: 700;
  color: white;
  line-height: 90px;
  word-wrap: break-word;
}
#footer .foot_popup .popup_wrap p {
  padding-top: 60px;
  font-size: 22px;
  font-weight: 300;
  line-height: 33px;
  color: white;
}
.no_scroll #footer .foot_popup {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 1880px) {
  #footer.work .wrap,
  #footer.home .wrap {
    padding: 85px 125px;
  }
  #footer.approach .wrap {
    padding: 85px 120px;
  }
  #footer.about .wrap {
    max-width: 1200px;
    padding: 85px 60px;
  }
  #footer .foot_popup .popup_wrap {
    padding: 270px 220px 100px;
  }
  #footer .foot_popup .popup_wrap h3 {
    font-size: 84px;
    line-height: 88px;
  }
}
@media (max-width: 1200px) {
  #footer.work .wrap,
  #footer.home .wrap {
    padding: 85px 100px;
  }
  #footer.contact .wrap {
    padding: 85px 110px;
  }
  #footer.approach .wrap {
    padding: 85px 100px;
  }
  #footer.about .wrap {
    max-width: 992px;
    padding: 85px 55px;
  }
  #footer .foot_popup .popup_wrap {
    padding: 270px 150px 100px;
  }
  #footer .foot_popup .popup_wrap h3 {
    font-size: 74px;
    line-height: 82px;
  }
  #footer .foot_popup .popup_wrap p {
    padding-top: 50px;
  }
}
@media (max-width: 992px) {
  #footer.work .wrap,
  #footer.home .wrap {
    padding: 85px 80px;
  }
  #footer.contact .wrap {
    padding: 85px 100px;
  }
  #footer.approach .wrap {
    padding: 85px 80px;
  }
  #footer.about .wrap {
    max-width: 768px;
    padding: 85px 40px;
  }
  #footer .foot_popup .popup_wrap {
    padding: 270px 120px 100px;
  }
  #footer .foot_popup .popup_wrap h3 {
    font-size: 70px;
    line-height: 76px;
  }
  #footer .foot_popup .popup_wrap p {
    font-size: 20px;
    line-height: 30px;
  }
}
@media (max-width: 768px) {
  #footer .wrap .terms {
    width: 100%;
    margin-bottom: 10px;
  }
  #footer .wrap .copyright {
    width: 100%;
  }
  #footer.work .wrap {
    padding: 85px 72px;
  }
  #footer.contact .wrap {
    padding: 85px 80px;
  }
  #footer.approach .wrap {
    padding: 85px 60px;
  }
  #footer.about .wrap {
    max-width: 576px;
  }
  #footer.home .wrap {
    padding: 85px 60px;
  }
  #footer .foot_popup .popup_wrap {
    padding: 220px 70px 100px;
  }
  #footer .foot_popup .popup_wrap h3 {
    font-size: 60px;
    line-height: 66px;
  }
  #footer .foot_popup .popup_wrap p {
    padding-top: 40px;
    font-size: 18px;
    line-height: 26px;
  }
}
@media (max-width: 576px) {
  #footer .wrap {
    max-width: 320px;
    padding: 85px 30px;
  }
  #footer.work .wrap,
  #footer.contact .wrap,
  #footer.approach .wrap,
  #footer.about .wrap {
    max-width: none;
    padding: 85px 20px;
  }
  #footer.home .wrap {
    padding: 85px 30px;
  }
  #footer .foot_popup .popup_wrap {
    padding: 150px 20px 100px;
  }
  #footer .foot_popup .popup_wrap h3 {
    font-size: 36px;
    line-height: 40px;
  }
}
.work_top {
  height: 100vh;
  min-height: 410px;
  background: url(../img/work.jpg) no-repeat center;
  background-size: cover;
}
.work_top h1 {
  text-align: center;
  vertical-align: middle;
  font-size: 90px;
  font-weight: 700;
  color: white;
}
.work_bottom {
  background-color: white;
}
.work_bottom .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 376px 140px 260px;
}
.work_bottom .wrap h2 {
  font-size: 85px;
  font-weight: 700;
  line-height: 1;
  padding-right: 260px;
}
.work_bottom .wrap p {
  font-size: 22px;
  font-weight: 300;
  margin: 85px 0 300px;
  line-height: 1.7;
  letter-spacing: 0.4px;
  padding-right: 175px;
}
.work_bottom .wrap .charts .chart {
  float: left;
  width: 50%;
}
.work_bottom .wrap .charts .chart.chart1 {
  text-align: left;
}
.work_bottom .wrap .charts .chart.chart2 {
  text-align: right;
}
.work_bottom .wrap .charts .chart svg {
  width: 750px;
  height: 750px;
}
.work_bottom .wrap .charts .chart svg .parts > g.clickable {
  cursor: pointer;
}
.work_bottom .wrap .charts .chart svg .parts > g circle {
  stroke-width: 1;
  transition: stroke-width 0.3s ease;
}
.work_bottom .wrap .charts .chart svg .parts > g.active circle {
  stroke-width: 50;
}
.work_bottom .wrap .charts .chart svg .texts {
  pointer-events: none;
}
.work_bottom .wrap .charts .chart svg g.inner_text2 {
  transform: translate(-38px, -132px);
}
.work_bottom .wrap .charts .chart svg g.inner_text1 {
  transform: translate(-38px, -152px);
}
.popup {
  background-color: #cecece;
  display: none;
  z-index: 2100;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 100%;
  left: 0;
  overflow-y: hidden;
  transition: top 1s;
}
.popup.open {
  display: block;
}
.popup.show {
  top: 0;
}
.popup.hide {
  top: 100%;
}
.popup .close_btn {
  position: absolute;
  right: 35px;
  top: 35px;
  z-index: 110;
  cursor: pointer;
  width: 38px;
  height: 38px;
  background: url(../img/close.png) no-repeat center;
  background-size: cover;
}
.popup .popup_wrap {
  padding: 330px 270px;
  height: 100%;
}
.popup .popup_wrap .desc {
  padding-bottom: 100px;
}
.popup .popup_wrap .desc h3 {
  font-size: 88px;
  font-weight: 700;
  color: white;
  line-height: 90px;
  word-wrap: break-word;
}
.popup .popup_wrap .desc h3 span {
  color: #f3dfcf;
}
.popup .popup_wrap .desc p {
  width: 60%;
  padding-top: 60px;
  font-size: 22px;
  font-weight: 300;
  color: white;
  letter-spacing: 0.4px;
    line-height: 1.6;
}
.no_scroll .popup {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 1880px) {
  .work_bottom .wrap {
    padding: 340px 125px 180px;
  }
  .work_bottom .wrap h2 {
    padding-right: 100px;
    font-size: 80px;
  }
  .work_bottom .wrap p {
    padding-right: 70px;
    font-size: 20px;
    margin: 85px 0 260px;
  }
  .work_bottom .wrap .charts .chart svg {
    width: 100%;
    height: auto;
  }
  .popup .popup_wrap {
    padding: 330px 250px;
  }
  .popup .popup_wrap .desc {
    padding-bottom: 100px;
  }
  .popup .popup_wrap .desc h3 {
    font-size: 84px;
    line-height: 88px;
  }
  .popup .popup_wrap .desc p {
    font-size: 22px;
    width: 90%;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 1200px) {
  .work_bottom .wrap {
    padding: 270px 100px 160px;
  }
  .work_bottom .wrap h2 {
    font-size: 64px;
    padding-right: 0;
  }
  .work_bottom .wrap p {
    padding-right: 0;
    margin: 85px 0 250px;
  }
  .work_bottom .wrap .charts .chart {
    width: 100%;
  }
  .work_bottom .wrap .charts .chart.chart1 {
    text-align: center;
  }
  .work_bottom .wrap .charts .chart.chart2 {
    text-align: center;
  }
  .work_bottom .wrap .charts .chart svg {
    width: 750px;
    height: 750px;
  }
  .popup .popup_wrap {
    padding: 280px 150px;
  }
  .popup .popup_wrap .desc {
    padding-bottom: 100px;
  }
  .popup .popup_wrap .desc h3 {
    font-size: 74px;
    line-height: 82px;
  }
  .popup .popup_wrap .desc p {
    font-size: 22px;
    width: 90%;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 992px) {
  .work_bottom .wrap {
    padding: 225px 80px 130px;
  }
  .work_bottom .wrap h2 {
    font-size: 50px;
  }
  .work_bottom .wrap p {
    font-size: 18px;
    line-height: 1.6;
    margin: 85px 0 200px;
  }
  .work_bottom .wrap .charts .chart svg {
    width: 95%;
    height: auto;
  }
  .popup .popup_wrap {
    padding: 270px 120px;
  }
  .popup .popup_wrap .desc {
    padding-bottom: 100px;
  }
  .popup .popup_wrap .desc h3 {
    font-size: 70px;
    line-height: 76px;
  }
  .popup .popup_wrap .desc p {
    font-size: 20px;
    width: 100%;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 768px) {
  .work_bottom .wrap {
    padding: 200px 72px 80px;
  }
  .work_bottom .wrap h2 {
    font-size: 40px;
  }
  .work_bottom .wrap p {
    font-size: 16px;
    line-height: 1.5;
    margin: 75px 0 120px;
  }
  .work_bottom .wrap .charts .chart svg {
    width: 95%;
    height: auto;
  }
  .popup .popup_wrap {
    padding: 220px 70px;
  }
  .popup .popup_wrap .desc {
    padding-bottom: 100px;
  }
  .popup .popup_wrap .desc h3 {
    font-size: 60px;
    line-height: 66px;
  }
  .popup .popup_wrap .desc p {
    font-size: 18px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 576px) {
  .work_top h1 {
    font-size: 50px;
  }
  .work_bottom .wrap {
    padding: 150px 20px 60px;
  }
  .work_bottom .wrap h2 {
    font-size: 32px;
  }
  .work_bottom .wrap p {
    margin: 75px 0 100px;
  }
  .work_bottom .wrap .charts .chart svg {
    width: 100%;
    height: auto;
  }
  .popup .popup_wrap {
    padding: 150px 20px;
  }
  .popup .popup_wrap .desc {
    padding-bottom: 100px;
  }
  .popup .popup_wrap .desc h3 {
    font-size: 36px;
    line-height: 40px;
  }
  .popup .popup_wrap .desc p {
    font-size: 18px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
.contact_top {
  height: 100vh;
  min-height: 410px;
  background: url(../img/contact.jpg) no-repeat center;
  background-size: cover;
}
.contact_top h1 {
  text-align: center;
  vertical-align: middle;
  font-size: 90px;
  font-weight: 700;
  color: white;
}
.contact_bottom {
  background-color: white;
}
.contact_bottom .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 238px 470px 107px 135px;
}
.contact_bottom .wrap h2 {
  font-size: 85px;
  font-weight: 700;
  line-height: 1;
}
.contact_bottom .wrap p {
  font-size: 28px;
  font-weight: 700;
  margin: 43px 0 132px;
  letter-spacing: 0.2px;
}
.contact_bottom .wrap .cities .city {
  width: 410px;
  float: left;
  padding: 0 15px;
}
.contact_bottom .wrap .cities .city a {
  text-decoration: none;
  color: #7c7c7c;
}
.contact_bottom .wrap .cities .city h3 {
  font-size: 30px;
  font-weight: 700;
}
.contact_bottom .wrap .cities .city address {
  font-size: 24px;
  font-weight: 300;
  font-style: normal;
}
@media (max-width: 1880px) {
  .contact_bottom .wrap {
    padding: 230px 125px 100px;
  }
  .contact_bottom .wrap h2 {
    font-size: 80px;
  }
  .contact_bottom .wrap p {
    font-size: 26px;
    margin: 41px 0 125px;
  }
  .contact_bottom .wrap .cities .city {
    width: 310px;
  }
  .contact_bottom .wrap .cities .city h3 {
    font-size: 26px;
  }
  .contact_bottom .wrap .cities .city address {
    font-size: 22px;
  }
}
@media (max-width: 1200px) {
  .contact_bottom .wrap {
    padding: 210px 110px 90px;
  }
  .contact_bottom .wrap h2 {
    font-size: 74px;
  }
  .contact_bottom .wrap p {
    font-size: 24px;
    margin: 41px 0 120px;
  }
  .contact_bottom .wrap .cities .city {
    width: 33.333%;
  }
  .contact_bottom .wrap .cities .city h3 {
    font-size: 26px;
  }
  .contact_bottom .wrap .cities .city address {
    font-size: 20px;
  }
}
@media (max-width: 992px) {
  .contact_bottom .wrap {
    padding: 190px 100px 81px;
  }
  .contact_bottom .wrap h2 {
    font-size: 70px;
  }
  .contact_bottom .wrap p {
    font-size: 22px;
    margin: 40px 0 110px;
  }
  .contact_bottom .wrap .cities .city {
    width: 100%;
    padding: 0 0 15px;
  }
}
@media (max-width: 768px) {
  .contact_bottom .wrap {
    padding: 160px 80px 70px;
  }
  .contact_bottom .wrap h2 {
    font-size: 66px;
  }
  .contact_bottom .wrap p {
    font-size: 20px;
    margin: 40px 0 100px;
  }
  .contact_bottom .wrap .cities .city h3 {
    font-size: 24px;
  }
  .contact_bottom .wrap .cities .city address {
    font-size: 18px;
  }
}
@media (max-width: 576px) {
  .contact_top h1 {
    font-size: 50px;
  }
  .contact_bottom .wrap {
    padding: 130px 20px 52px;
  }
  .contact_bottom .wrap h2 {
    font-size: 40px;
  }
  .contact_bottom .wrap p {
    font-size: 22px;
    margin: 40px 0 95px;
  }
}
@font-face {
  font-family: Zwizz;
  src: url(../fonts/Zwizz/OTF/Zwizz-Bold.otf);
}
.approach_top {
  height: 100vh;
  min-height: 410px;
  background: url(../img/approach.jpg) no-repeat center;
  background-size: cover;
}
.approach_top h1 {
  text-align: center;
  vertical-align: middle;
  font-size: 90px;
  font-weight: 700;
  color: white;
}
.segment {
  min-height: 100vh;
}
.segment .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 90px 135px 90px;
}
.segment .wrap .number {
  font-family: Zwizz, sans-serif;
  font-size: 128px;
  line-height: 1;
  letter-spacing: -7px;
}
.segment .wrap h2 {
  font-size: 85px;
  font-weight: 700;
  line-height: 1;
  margin: 70px 0 52px;
  padding-right: 450px;
}
.segment .wrap p {
  font-size: 22px;
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: 0.4px;
  padding-right: 180px;
}
.segment.white {
  background-color: white;
}
.segment.gray {
  color: white;
  background-color: #cfcece;
}
.segment.last .wrap {
  padding: 301px 135px 320px;
}
.segment.last .wrap .subsegment {
  float: left;
}
.segment.last .wrap .subsegment .number {
  font-size: 138px;
}
.segment.last .wrap .subsegment h2 {
  font-size: 70px;
  margin: 80px 0 28px;
  padding: 0;
}
.segment.last .wrap .subsegment p {
  padding-right: 100px;
}
.segment.last .wrap .subsegment.sub1 {
  width: 35%;
}
.segment.last .wrap .subsegment.sub2 {
  width: 40%;
}
.segment.last .wrap .subsegment.sub3 {
  width: 25%;
}
.segment.last .wrap .subsegment.sub3 p {
  padding-right: 16px;
}
@media (max-width: 1880px) {
  .segment .wrap {
    padding: 80px 120px 80px;
  }
  .segment .wrap .number {
    font-size: 120px;
  }
  .segment .wrap h2 {
    margin: 70px 0 45px;
    padding-right: 250px;
    font-size: 76px;
  }
  .segment .wrap p {
    font-size: 22px;
    padding-right: 80px;
  }
  .segment.last .wrap {
    padding: 270px 120px;
  }
  .segment.last .wrap .subsegment .number {
    font-size: 126px;
  }
  .segment.last .wrap .subsegment h2 {
    margin: 75px 0 24px;
    font-size: 62px;
  }
  .segment.last .wrap .subsegment p {
    padding-right: 80px;
    font-size: 22px;
  }
  .segment.last .wrap .subsegment.sub3 p {
    padding-right: 0;
  }
}
@media (max-width: 1200px) {
  .segment .wrap {
    padding: 60px 100px 90px;
  }
  .segment .wrap .number {
    font-size: 106px;
  }
  .segment .wrap h2 {
    margin: 70px 0 40px;
    padding-right: 0;
    font-size: 66px;
  }
  .segment .wrap p {
    font-size: 20px;
    padding-right: 0;
  }
  .segment.last .wrap {
    padding: 220px 100px 0px;
  }
  .segment.last .wrap .subsegment {
    padding-bottom: 60px;
  }
  .segment.last .wrap .subsegment.sub1,
  .segment.last .wrap .subsegment.sub2,
  .segment.last .wrap .subsegment.sub3 {
    width: 100%;
  }
  .segment.last .wrap .subsegment .number {
    font-size: 104px;
    float: left;
    height: 200px;
    width: 130px;
  }
  .segment.last .wrap .subsegment h2 {
    margin: 0 0 20px;
    font-size: 52px;
    float: left;
    width: calc(100% - 130px);
  }
  .segment.last .wrap .subsegment p {
    padding-right: 50px;
    font-size: 22px;
    float: left;
    width: calc(100% - 130px);
  }
}
@media (max-width: 992px) {
  .segment {
    min-height: initial;
  }
  .segment .wrap {
    padding: 45px 80px 90px;
  }
  .segment .wrap .number {
    font-size: 90px;
  }
  .segment .wrap h2 {
    margin: 70px 0 35px;
    padding-right: 0;
    font-size: 56px;
  }
  .segment .wrap p {
    font-size: 20px;
    padding-right: 20px;
  }
  .segment.last .wrap {
    padding: 160px 80px 80px;
  }
  .segment.last .wrap .subsegment .number {
    font-size: 92px;
  }
  .segment.last .wrap .subsegment h2 {
    margin: 0 0 17px;
    font-size: 44px;
  }
  .segment.last .wrap .subsegment p {
    font-size: 20px;
  }
}
@media (max-width: 768px) {
  .segment .wrap {
    padding: 35px 60px 80px;
  }
  .segment .wrap .number {
    font-size: 80px;
  }
  .segment .wrap h2 {
    margin: 70px 0 31px;
    padding-right: 0;
    font-size: 46px;
  }
  .segment .wrap p {
    font-size: 18px;
    padding-right: 0;
  }
  .segment.last .wrap {
    padding: 90px 60px 0;
  }
  .segment.last .wrap .subsegment {
    padding-bottom: 60px;
  }
  .segment.last .wrap .subsegment .number {
    height: 100px;
    width: 92px;
    font-size: 76px;
  }
  .segment.last .wrap .subsegment h2 {
    margin: 0 0 9px;
    width: calc(100% - 92px);
    font-size: 38px;
  }
  .segment.last .wrap .subsegment p {
    width: calc(100% - 92px);
    padding-right: 0;
    font-size: 18px;
  }
}
@media (max-width: 576px) {
  .approach_top h1 {
    font-size: 50px;
  }
  .segment .wrap {
    padding: 30px 40px 65px;
  }
  .segment .wrap .number {
    font-size: 70px;
  }
  .segment .wrap h2 {
    margin: 70px 0 28px;
    padding-right: 0;
    font-size: 36px;
  }
  .segment .wrap p {
    font-size: 16px;
    padding-right: 0;
  }
  .segment.last .wrap {
    padding: 70px 20px 0;
  }
  .segment.last .wrap .subsegment {
    padding-bottom: 50px;
  }
  .segment.last .wrap .subsegment.sub1,
  .segment.last .wrap .subsegment.sub2,
  .segment.last .wrap .subsegment.sub3 {
    width: 100%;
  }
  .segment.last .wrap .subsegment .number {
    height: 100px;
    width: 84px;
    font-size: 70px;
  }
  .segment.last .wrap .subsegment h2 {
    margin: 0 0 8px;
    width: calc(100% - 84px);
    font-size: 32px;
  }
  .segment.last .wrap .subsegment p {
    width: calc(100% - 84px);
    font-size: 16px;
  }
}
#about {
  background-color: #e2e2e2;
}
#about .wrap {
  max-width: 1920px;
  margin: 0 auto;
  padding: 372px 140px 244px;
}
#about .wrap h2 {
  text-align: center;
  padding: 0 200px 120px;
  font-size: 50px;
  font-weight: 700;
  color: white;
  letter-spacing: -1px;
}
#about .wrap .members .member {
  width: 25%;
  float: left;
  text-align: center;
  margin: 60px 0;
}
#about .wrap .members .member:nth-of-type(4n+1) {
  clear: both;
}
#about .wrap .members .member:hover h3 {
  color: #7c7c7c;
}
#about .wrap .members .member .img_cont {
  height: 345px;
  cursor: pointer;
}
#about .wrap .members .member .img_cont.mem0 {
  background: url(../img/people/stefanie_small.jpg) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem1 {
  background: url(../img/people/christian_small2.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem2 {
  background: url(../img/people/carolin_small1.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem3 {
  background: url(../img/people/gabriel_small1.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem4 {
  background: url(../img/people/shani_small.jpg) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem5 {
  background: url(../img/people/michio_small1.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem6 {
  background: url(../img/people/ivanka_small1_m.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member .img_cont.mem7 {
  background: url(../img/people/fabian_small1.png) no-repeat bottom;
  background-size: 100% auto;
}
#about .wrap .members .member h3 {
  font-size: 24px;
  font-weight: 700;
  color: white;
  margin-top: 26px;
  cursor: pointer;
  transition: color 300ms;
}
#about .wrap .members .member p {
  font-size: 24px;
  font-weight: 700;
  color: #e2ccbb;
  cursor: pointer;
}
#about .info {
  display: none;
  z-index: 2100;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 100%;
  left: 0;
  background: #cecece;
  overflow-y: hidden;
  transition: top 1s;
}
#about .info.open {
  display: block;
}
#about .info.show {
  top: 0;
}
#about .info.hide {
  top: 100%;
}
#about .info .info_bg {
  background: no-repeat bottom right;
  background-size: auto 50%;
  width: 100%;
  height: 100vh;
  position: fixed;
  z-index: -1;
  display: none;
}
#about .info .close_btn {
  position: absolute;
  right: 35px;
  top: 35px;
  z-index: 110;
  cursor: pointer;
  width: 38px;
  height: 38px;
  background: url(../img/close.png) no-repeat center;
  background-size: cover;
}
#about .info .info_wrap {
  padding: 150px 170px 90px 250px;
}
#about .info .info_wrap .desc {
  float: left;
  width: 60%;
}
#about .info .info_wrap .desc h3 {
  font-size: 88px;
  font-weight: 700;
  color: white;
  line-height: 1;
}
#about .info .info_wrap .desc h3 span {
  color: #f3dfcf;
}
#about .info .info_wrap .desc p {
  padding-top: 50px;
  padding-bottom: 100px;
  font-size: 22px;
  font-weight: 300;
  color: white;
  letter-spacing: 0.4px;
    line-height: 1.6;
}
.no_scroll #about .info {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 1880px) {
  #about .wrap {
    max-width: 1200px;
    padding: 250px 60px 244px;
  }
  #about .wrap h2 {
    padding: 0 100px 120px;
    font-size: 46px;
  }
  #about .wrap .members .member {
    margin: 10px 0;
  }
  #about .wrap .members .member .img_cont {
    height: 240px;
  }
  #about .info .info_wrap {
    width: 1200px;
    padding: 120px 20px 0;
    margin: 0 auto;
  }
  #about .info .info_wrap .desc h3 {
    font-size: 88px;
  }
  #about .info .info_wrap .desc p {
    padding-top: 50px;
    font-size: 22px;
    padding-bottom: 100px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 1200px) {
  #about .wrap {
    max-width: 992px;
    padding: 300px 55px 220px;
  }
  #about .wrap h2 {
    padding: 0 90px 100px;
    font-size: 40px;
  }
  #about .wrap .members .member .img_cont {
    height: 190px;
  }
  #about .info .info_wrap {
    width: 992px;
    padding: 110px 20px 0;
  }
  #about .info .info_wrap .desc h3 {
    font-size: 78px;
  }
  #about .info .info_wrap .desc p {
    padding-top: 45px;
    font-size: 20px;
    padding-bottom: 100px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 992px) {
  #about .wrap {
    max-width: 768px;
    padding: 310px 40px 200px;
  }
  #about .wrap h2 {
    padding: 0 75px 100px;
    font-size: 40px;
  }
  #about .wrap .members .member {
    width: 50%;
  }
  #about .wrap .members .member:nth-of-type(2n+1) {
    clear: both;
  }
  #about .wrap .members .member .img_cont {
    height: 300px;
  }
  #about .info .info_bg {
    display: none !important;
  }
  #about .info .info_wrap {
    width: 768px;
    padding: 60px 30px 0;
  }
  #about .info .info_wrap .desc {
    float: left;
    width: 100%;
    height: 70%;
    padding-top: 20px;
  }
  #about .info .info_wrap .desc h3 {
    font-size: 74px;
  }
  #about .info .info_wrap .desc p {
    padding-top: 40px;
    padding-bottom: 100px;
    font-size: 20px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 768px) {
  #about .wrap {
    max-width: 576px;
    padding: 310px 40px 200px;
  }
  #about .wrap h2 {
    padding: 0 50px 100px;
    font-size: 38px;
  }
  #about .wrap .members .member {
    width: 50%;
  }
  #about .wrap .members .member .img_cont {
    height: 220px;
  }
  #about .wrap .members .member h3 {
    font-size: 18px;
    margin-top: 22px;
  }
  #about .wrap .members .member p {
    font-size: 18px;
  }
  #about .info .info_wrap {
    width: 576px;
    padding: 60px 30px 0;
  }
  #about .info .info_wrap .desc h3 {
    font-size: 68px;
  }
  #about .info .info_wrap .desc p {
    font-size: 18px;
    padding-bottom: 100px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}
@media (max-width: 576px) {
  #about .wrap {
    max-width: 320px;
    padding: 230px 20px 140px;
  }
  #about .wrap h2 {
    padding: 0 20px 60px;
    font-size: 24px;
  }
  #about .wrap .members .member {
    width: 50%;
  }
  #about .wrap .members .member .img_cont {
    height: 125px;
  }
  #about .wrap .members .member h3 {
    font-size: 14px;
    margin-top: 14px;
  }
  #about .wrap .members .member p {
    font-size: 14px;
  }
  #about .info .info_wrap {
    width: 320px;
    padding: 60px 30px 0;
  }
  #about .info .info_wrap .desc h3 {
    font-size: 52px;
  }
  #about .info .info_wrap .desc p {
    font-size: 16px;
    padding-bottom: 100px;
    letter-spacing: 0.4px;
    line-height: 1.6;
  }
}