@charset "UTF-8";
/*------------------------------------ */
.wrapper-timeline main {
  font-size: 16px;
  line-height: 1.3em; }
  .wrapper-timeline main * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; }
  .wrapper-timeline main section {
    position: relative; }
  .wrapper-timeline main h1 {
    font-size: 4.4em;
    font-weight: 900; }
  .wrapper-timeline main hr {
    margin-top: 10px;
    margin-bottom: 10px; }
  .wrapper-timeline main p {
    margin-bottom: 24px; }

@media screen and (max-width: 768px) {
  .wrapper-timeline main h1 {
    font-size: 2.4em; } }

/*---------------------------------------------- */
.wrapper-timeline {
  /* width: 100%;  */
}
  .wrapper-timeline main .session {
    width: 100%; }
  .wrapper-timeline main .milestone_container {
    width: 100%;
    padding: 0; }
  .wrapper-timeline main .row {
    width: 100%;
    height: 100%;
    margin-left: 0;
    margin-right: 0; }
  .wrapper-timeline main .max-w-md {
    width: 100%;
    max-width: 1120px;
    margin: auto; }

/* txt ------------------------------------ */
.wrapper-timeline main .txt-center {
  text-align: center; }

.wrapper-timeline main .ver-middle {
  vertical-align: middle; }

.wrapper-timeline main .ver-top {
  vertical-align: top; }

.wrapper-timeline main .txt-white {
  color: #fff; }

.wrapper-timeline main .txt-yellow {
  color: #FEC62C; }

.wrapper-timeline main .txt-grey {
  color: #707070; }

/*------------------------------------------ */
/*------------------------------------ */
.wrapper-timeline {
  /* max-width: 1280px;
  width: 100%; */
  margin-left: auto;
  margin-right: auto; }
  .wrapper-timeline .nav-timeline {
    color: #ccc; }

.wrapper-timeline main .intro-session {
  padding: 10px; }
  .wrapper-timeline main .intro-session .milestone_container .txt-title {
    font-family: 'Roboto Condensed', Helvetica, sans-serif;
    font-weight: bold;
    letter-spacing: -1px;
    margin-bottom: 0.4em; }

.wrapper-timeline main .timeline-session {
  position: relative; }
  .wrapper-timeline main .timeline-session .box-timeline {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 100%;
    padding: 40px 25px 100px 36px;
    z-index: 100; }
  .wrapper-timeline main .timeline-session .center-line {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    background: #3EBCAF;
    /*-webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);*/
    height: 100%;
    left: 36px;
    top: 40px; }
    /*.wrapper-timeline main .timeline-session .center-line::before,*/
    .wrapper-timeline main .timeline-session .center-line::after {
      content: 'NOW';
      background-image: url(../images/now_pin.svg);
      background-position: bottom;
      position: absolute;
      width: 102px;
      height: 93px;
      z-index: 10;
      text-align: center;
      color: #002194;
      font-size: 16px;
      font-weight: bold;
      padding-top: 32px;
      left: -50px;
      bottom: -60px;
      background-size: 92px; }
  .wrapper-timeline main .timeline-session > .row {
    padding-top: 180px; }
  .wrapper-timeline main .timeline-session .row-items {
    position: relative;
    margin: auto;
    max-width: 1400px;
    display: block;
    background: transparent;
    color: #000; }
    .wrapper-timeline main .timeline-session .row-items .item {
      position: relative;
      width: 100%;
      margin: 40px 0;
      max-width: 480px; }
      .wrapper-timeline main .timeline-session .row-items .item::before {
        content: "";
        position: absolute;
        top: 49px;
        width: 70px;
        height: 1px;
        background: #3EBCAF;
        left: 0;
        top: 0; }
      .wrapper-timeline main .timeline-session .row-items .item::after {
        content: '';
        position: absolute;
        top: 0;
        width: 14px;
        height: 14px;
        -webkit-transform: translate(0%, -50%);
        -ms-transform: translate(0%, -50%);
        transform: translate(0%, -50%);
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        left: 0;
        top: 0;
        z-index: 10;
        /*-webkit-box-shadow: 5px 5px 22px -5px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 5px 5px 22px -5px rgba(0, 0, 0, 0.4);
        box-shadow: 5px 5px 22px -5px rgba(0, 0, 0, 0.4);*/ }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container {
        width: 88%;
        margin-left: auto;
        margin-right: 0;
        position: relative; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_box-ctx {
        position: relative;
        overflow: hidden; }
      .wrapper-timeline main .timeline-session .row-items .item .img-cover {
        width: 100%; }
      .wrapper-timeline main .timeline-session .row-items .item .txt-desc {
        color: #707070;
        text-align: left;
        background: #fff;
        padding: 6px 0; }
      .wrapper-timeline main .timeline-session .row-items .item .txt-year {
        position: absolute;
        font-weight: bold;
        letter-spacing: -10px;
        font-size: 100px;
        font-family: 'roboto', Helvetica, sans-serif; }
        .wrapper-timeline main .timeline-session .row-items .item .txt-year span {
          position: relative;
          text-shadow: 4px 4px 9px rgba(0, 0, 0, 0.2); }
        .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(1) span:nth-child(2) {
          top: 60px; }
        .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(2) span:nth-child(1) {
          top: -20px; }
        .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(2) span:nth-child(2) {
          top: 30px; }
      .wrapper-timeline main .timeline-session .row-items .item.item-orange {
        padding-top: 3em; }
        .wrapper-timeline main .timeline-session .row-items .item.item-orange::after {
          background: #FC6B25; }
        .wrapper-timeline main .timeline-session .row-items .item.item-orange .txt-year {
          color: #FC6B25; }
        .wrapper-timeline main .timeline-session .row-items .item.item-orange .txt-desc {
          background: #fff;
          color: #000; }
  .wrapper-timeline main .timeline-session .row-year-navy .item::after {
    background: #3EBCAF; }
  .wrapper-timeline main .timeline-session .row-year-orange .item::after {
    background: #FEC62C; }
  .wrapper-timeline main .timeline-session .row-year-orange .row-items .item::before {
    background: #FEC62C;
  }

@media screen and (max-width: 1120px) {
  .wrapper-timeline main .timeline-session .center-line {
    height: 99%; }
  .wrapper-timeline main .timeline-session .row-items .item .txt-year {
    z-index: 10;
    top: -60px; }
    .wrapper-timeline main .timeline-session .row-items .item .txt-year span {
      position: relative;
      text-shadow: 4px 4px 9px rgba(100, 100, 100, 0.2); }
    .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(1) {
      left: 0; }
      .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(1) span:nth-child(2) {
        top: 20px; }
    .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(2) {
      left: 100px; }
      .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(2) span:nth-child(1) {
        top: 0px; }
      .wrapper-timeline main .timeline-session .row-items .item .txt-year:nth-child(2) span:nth-child(2) {
        top: 10px; } }

@media screen and (min-width: 1120px) {
  .wrapper-timeline main .timeline-session .center-line {
    left: 50%; }
  .wrapper-timeline main .timeline-session .box-timeline {
    max-width: 100%;
    margin-bottom: 100px; }
  .wrapper-timeline main .timeline-session .row-year {
    margin-top: 80px;
    margin-bottom: 80px;
    position: relative; }
  .wrapper-timeline main .timeline-session .row-items .item {
    position: absolute;
    width: 50%;
    max-width: 600px;
    margin: 0;
    top: 4000px; }
    .wrapper-timeline main .timeline-session .row-items .item.item-350 {
      max-width: 350px; }
    .wrapper-timeline main .timeline-session .row-items .item.item-400 {
      max-width: 400px; }
    .wrapper-timeline main .timeline-session .row-items .item.item-450 {
      max-width: 450px; }
    .wrapper-timeline main .timeline-session .row-items .item.item-500 {
      max-width: 500px; }
    .wrapper-timeline main .timeline-session .row-items .item.item-orange {
      padding-top: 0em; }
    .wrapper-timeline main .timeline-session .row-items .item::before {
      width: 50px;
      -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
      transform: scaleX(0);
      -webkit-transition: 500ms;
      transition: 500ms; }
    .wrapper-timeline main .timeline-session .row-items .item::after {
      width: 14px;
      height: 14px;
      -webkit-transform: scale(0) transform(50%, 50%);
      -ms-transform: scale(0) transform(50%, 50%);
      transform: scale(0) transform(50%, 50%);
      -webkit-transition: 500ms;
      transition: 500ms; }
    .wrapper-timeline main .timeline-session .row-items .item .milestone_container {
      width: 100%;
      position: relative; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container .txt-year {
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0);
        -webkit-transition: 500ms 300ms;
        transition: 500ms 300ms; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(1) {
        left: -87px;
        right: auto;
        top: -65px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(1) span:nth-child(1) {
          top: 10px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(1) span:nth-child(2) {
          top: 30px; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(2) {
        z-index: 10;
        left: 10px;
        right: auto;
        top: -54px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(2) span:nth-child(1) {
          top: 0px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-top .txt-year:nth-child(2) span:nth-child(2) {
          top: 10px; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year {
        top: -60px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(1) {
          z-index: 10;
          left: 57%;
          right: auto; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(1) span:nth-child(1) {
            top: 0px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(1) span:nth-child(2) {
            top: 20px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(2) {
          left: auto;
          right: -40px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(2) span:nth-child(1) {
            top: -10px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-top .txt-year:nth-child(2) span:nth-child(2) {
            top: 10px; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-center .txt-year {
        top: 55%;
        z-index: 10; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-center .txt-year:nth-child(1) {
          left: -180px;
          right: auto; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-center .txt-year:nth-child(1) span:nth-child(2) {
            top: 20px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-center .txt-year:nth-child(2) {
          right: auto;
          left: -90px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-left-center .txt-year:nth-child(2) span:nth-child(2) {
            top: -10px; }
      .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year {
        top: 45%; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year:nth-child(1) {
          z-index: 10;
          left: auto;
          right: -80px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year:nth-child(1) span:nth-child(2) {
            top: 30px; }
        .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year:nth-child(2) {
          left: auto;
          right: -170px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year:nth-child(2) span:nth-child(1) {
            top: -20px; }
          .wrapper-timeline main .timeline-session .row-items .item .milestone_container.pos-right-center .txt-year:nth-child(2) span:nth-child(2) {
            top: 10px; }
    .wrapper-timeline main .timeline-session .row-items .item .milestone_box-ctx {
      width: 100%;
      opacity: 0;
      -webkit-transition: 500ms;
      transition: 500ms; }
    .wrapper-timeline main .timeline-session .row-items .item[status="active"]::before {
      -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
      transform: scaleX(1); }
    .wrapper-timeline main .timeline-session .row-items .item[status="active"] .milestone_box-ctx {
      opacity: 1;
      -webkit-transform: translate(0%, 0);
      -ms-transform: translate(0%, 0);
      transform: translate(0%, 0); }
    .wrapper-timeline main .timeline-session .row-items .item[status="active"] .txt-year {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1); }
  .wrapper-timeline main .timeline-session .row-items .item-right {
    left: 50%;
    padding-left: 50px; }
    .wrapper-timeline main .timeline-session .row-items .item-right::before {
      -webkit-transform-origin: left;
      -ms-transform-origin: left;
      transform-origin: left; }
    .wrapper-timeline main .timeline-session .row-items .item-right::after {
      -webkit-transform-origin: left top;
      -ms-transform-origin: left top;
      transform-origin: left top;
      -webkit-transform: scale(0) translate(-50%, -50%);
      -ms-transform: scale(0) translate(-50%, -50%);
      transform: scale(0) translate(-50%, -50%); }
    .wrapper-timeline main .timeline-session .row-items .item-right .milestone_box-ctx {
      opacity: 0;
      -webkit-transform: translate(20%, 0);
      -ms-transform: translate(20%, 0);
      transform: translate(20%, 0);
      -webkit-transition: 500ms;
      transition: 500ms; }
      .wrapper-timeline main .timeline-session .row-items .item-right .milestone_box-ctx.active {
        opacity: 1;
        -webkit-transform: translate(0%, 0);
        -ms-transform: translate(0%, 0);
        transform: translate(0%, 0); }
    .wrapper-timeline main .timeline-session .row-items .item-right[status="active"]::after {
      -webkit-transform: scale(1) translate(-50%, -50%);
      -ms-transform: scale(1) translate(-50%, -50%);
      transform: scale(1) translate(-50%, -50%); }
  .wrapper-timeline main .timeline-session .row-items .item-left {
    right: 50%;
    padding-right: 50px; }
    .wrapper-timeline main .timeline-session .row-items .item-left::before {
      left: auto;
      right: 0;
      -webkit-transform-origin: right;
      -ms-transform-origin: right;
      transform-origin: right; }
    .wrapper-timeline main .timeline-session .row-items .item-left::after {
      left: auto;
      right: 0;
      -webkit-transform-origin: right top;
      -ms-transform-origin: right top;
      transform-origin: right top;
      -webkit-transform: scale(0) translate(50%, -50%);
      -ms-transform: scale(0) translate(50%, -50%);
      transform: scale(0) translate(50%, -50%); }
    .wrapper-timeline main .timeline-session .row-items .item-left .txt-year {
      left: auto;
      right: -55px; }
    .wrapper-timeline main .timeline-session .row-items .item-left .milestone_container {
      margin-left: 0;
      margin-right: auto; }
    .wrapper-timeline main .timeline-session .row-items .item-left .milestone_box-ctx {
      -webkit-transform: translate(-20%, 0);
      -ms-transform: translate(-20%, 0);
      transform: translate(-20%, 0); }
    .wrapper-timeline main .timeline-session .row-items .item-left[status="active"]::after {
      -webkit-transform: scale(1) translate(50%, -50%);
      -ms-transform: scale(1) translate(50%, -50%);
      transform: scale(1) translate(50%, -50%); } }

.wrapper-timeline main .timeline-session .fg {
  display: none; }

@media screen and (min-width: 1120px) {
  .wrapper-timeline main .timeline-session .box-fg {
    pointer-events: none;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1; }
    .wrapper-timeline main .timeline-session .box-fg .box-fg-layer {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%; }
      .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg {
        display: inline-block;
        position: absolute; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg17 {
          right: 88%;
          top: -100%;
          width: 120px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg18 {
          right: 78%;
          top: -8%;
          width: 60px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg19 {
          left: 95%;
          top: -18%;
          width: 300px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg20 {
          left: 55%;
          top: -7.5%;
          width: 84px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg16 {
          left: 80%;
          width: 250px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg15 {
          left: 78%;
          top: 20%;
          width: 30px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg14 {
          right: 84%;
          top: -48%;
          width: 150px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg13 {
          right: 85%;
          top: -30.5%;
          width: 200px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg12 {
          left: 85%;
          top: 10.5%;
          width: 100px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg11 {
          right: 30%;
          top: -40.5%;
          width: 140px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg10 {
          right: 95%;
          top: -150.5%;
          width: 140px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg9 {
          left: 55%;
          top: -20.5%;
          width: 100px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg8 {
          right: 80%;
          top: 10%;
          width: 100px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg7 {
          right: 65%;
          bottom: -80.5%;
          width: 200px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg6 {
          left: 90%;
          bottom: -20%;
          width: 20px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg5 {
          right: 80%;
          top: 60%;
          width: 250px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg4 {
          left: 60%;
          top: 0%;
          width: 100px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg3 {
          right: 90%;
          top: -5%;
          width: 50px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg2 {
          left: 100%;
          top: -35%;
          width: 100px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg1 {
          right: 70%;
          bottom: -35%;
          width: 250px; }
        .wrapper-timeline main .timeline-session .box-fg .box-fg-layer .fg.fg0 {
          left: 70%;
          top: 5%;
          width: 130px; } }

@media screen and (max-width: 768px) {
  .wrapper-timeline main .md-hidden {
    display: none !important; }
  .wrapper-timeline main .md-show {
    display: none; }
  .wrapper-timeline main .md-hide {
    display: inline-block; } }

@media screen and (min-width: 767px) {
  .wrapper-timeline main .md-show {
    display: inline-block; }
  .wrapper-timeline main .md-hide {
    display: none; } }

/*# sourceMappingURL=style.css.map */