.work-list-wrap {
  padding: 50px 0 0; }
  @media (max-width: 767px) {
    .work-list-wrap {
      padding: 40px 0 0; } }
  .work-list-wrap .title-wrap {
    padding-bottom: 100px;
    text-align: center; }
    @media (max-width: 1024px) {
      .work-list-wrap .title-wrap {
        padding-bottom: 48px; } }
  .work-list-wrap .cta {
    padding-top: 6px; }

.work-list ul {
  list-style: none; }
  .work-list ul li {
    padding-bottom: 24px; }
    @media (max-width: 1024px) {
      .work-list ul li {
        padding-bottom: 32px; } }

.work-item {
  background: #F2F2F2;
  display: block;
  height: 100%;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
  .dark .work-item {
    background: #101519;
    color: #ADB5BD; }
    .dark .work-item:hover {
      color: #000; }
  .work-item__img {
    text-align: center; }
  .work-item__caption {
    text-align: center;
    padding: 30px; }
    .work-item__caption .h6 {
      padding-bottom: 20px; }
    .work-item__caption p {
      font-size: 16px;
      line-height: 26px;
      margin: 0; }

.filter-work-list .work-list {
  max-width: 1122px;
  margin: 0 auto; }
  .filter-work-list .work-list ul {
    display: block;
    column-count: 2;
    column-gap: 156px; }
    @media (max-width: 1100px) {
      .filter-work-list .work-list ul {
        column-gap: 100px; } }
    @media (max-width: 1024px) {
      .filter-work-list .work-list ul {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -16px;
        column-count: 0;
        column-gap: 0; } }
    .filter-work-list .work-list ul li {
      padding-bottom: 100px;
      width: 50%; }
      @media (max-width: 1100px) {
        .filter-work-list .work-list ul li {
          padding-bottom: 56px; } }
      @media (max-width: 1024px) {
        .filter-work-list .work-list ul li {
          padding: 50px 16px 0px; } }
      @media (max-width: 767px) {
        .filter-work-list .work-list ul li {
          padding-top: 32px;
          width: 100%; } }
      .filter-work-list .work-list ul li:not(.odd):nth-child(even) {
        padding-bottom: 0;
        padding-top: 50px; }
        @media (max-width: 767px) {
          .filter-work-list .work-list ul li:not(.odd):nth-child(even) {
            padding-top: 32px; } }
        .filter-work-list .work-list ul li:not(.odd):nth-child(even) a {
          margin-left: auto; }
          @media (max-width: 1024px) {
            .filter-work-list .work-list ul li:not(.odd):nth-child(even) a {
              margin: 0 auto; } }
      .filter-work-list .work-list ul li:not(.even):nth-child(odd) a {
        margin-right: auto; }
        @media (max-width: 1024px) {
          .filter-work-list .work-list ul li:not(.even):nth-child(odd) a {
            margin: 0 auto; } }
      .filter-work-list .work-list ul li:nth-last-child(1), .filter-work-list .work-list ul li:nth-last-child(2) {
        padding-bottom: 0; }
      .filter-work-list .work-list ul li a {
        max-width: 482px; }
        @media (max-width: 1100px) {
          .filter-work-list .work-list ul li a {
            max-width: 450px; } }
        @media (max-width: 1024px) {
          .filter-work-list .work-list ul li a {
            margin: 0 auto; } }
      .filter-work-list .work-list ul li.even {
        padding-bottom: 0;
        padding-top: 50px; }
        .filter-work-list .work-list ul li.even a {
          margin-left: auto; }

.stack-box {
  position: relative;
  z-index: 12345; }
  @media (max-width: 1199px) {
    .stack-box {
      height: auto !important; } }
  .stack-box .stack-box-contain {
    height: 100vh;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    counter-reset: my-awesome-counter; }
    @media (max-width: 1199px) {
      .stack-box .stack-box-contain {
        position: relative;
        height: auto;
        display: flex;
        flex-direction: column;
        gap: 60px; } }
    @media (max-width: 767px) {
      .stack-box .stack-box-contain {
        gap: 0; } }
  .stack-box .stack-item {
    height: 100vh;
    width: 100%;
    position: absolute;
    overflow: hidden;
    display: flex;
    align-items: center;
    counter-increment: my-awesome-counter; }
    @media (max-width: 1199px) {
      .stack-box .stack-item {
        position: relative;
        height: auto; } }
    .stack-box .stack-item > .stack-item-element {
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: -1;
      display: flex;
      align-items: center;
      height: 100vh; }
      @media (max-width: 1199px) {
        .stack-box .stack-item > .stack-item-element {
          position: static;
          height: auto; } }
    .stack-box .stack-item:nth-child(2n) .stack-box-row {
      background: #fff; }
      .dark .stack-box .stack-item:nth-child(2n) .stack-box-row {
        background: #03080e; }
    .stack-box .stack-item .stack-box-row {
      display: flex;
      min-height: 100vh;
      height: 100%;
      width: 100%;
      background: #F2F2F2; }
      .dark .stack-box .stack-item .stack-box-row {
        background: #101519; }
      @media (max-width: 1199px) {
        .stack-box .stack-item .stack-box-row {
          min-height: 100px; } }
      @media (max-width: 767px) {
        .stack-box .stack-item .stack-box-row {
          flex-direction: column; } }
      .stack-box .stack-item .stack-box-row .stack-box-col-left {
        width: 50%;
        position: relative; }
        @media (max-width: 767px) {
          .stack-box .stack-item .stack-box-row .stack-box-col-left {
            width: 100%;
            aspect-ratio: 1 / 1.1; } }
        .stack-box .stack-item .stack-box-row .stack-box-col-left img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%; }
        .stack-box .stack-item .stack-box-row .stack-box-col-left a {
          display: block;
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%; }
        .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-no {
          position: absolute;
          right: -60px;
          top: 60px;
          font-size: 160px;
          line-height: 1;
          font-weight: 600;
          text-transform: uppercase;
          color: rgba(0, 84, 87, 0.5); }
          .dark .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-no {
            color: rgba(0, 84, 87, 0.5); }
          @media (max-width: 767px) {
            .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-no {
              right: 50%;
              transform: translate(50%, 0);
              font-size: 100px;
              top: inherit;
              bottom: -50px; } }
          .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-no::before {
            content: "0" counter(my-awesome-counter); }
        .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-label {
          position: absolute;
          bottom: 0;
          right: 0;
          background: #fff;
          padding: 30px 10px;
          z-index: 1;
          font-size: 14px;
          font-weight: 600;
          text-transform: uppercase;
          transform: rotate(180deg);
          writing-mode: vertical-lr; }
          @media (max-width: 767px) {
            .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-label {
              display: none; } }
          .dark .stack-box .stack-item .stack-box-row .stack-box-col-left .stack-box-label {
            background: #0C1B1D; }
      .stack-box .stack-item .stack-box-row .stack-box-col-right {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 12%; }
        @media (max-width: 1199px) {
          .stack-box .stack-item .stack-box-row .stack-box-col-right {
            padding: 0 8%; } }
        @media (max-width: 767px) {
          .stack-box .stack-item .stack-box-row .stack-box-col-right {
            width: 100%;
            padding: 60px 40px; } }
  .stack-box .stack-box-content {
    max-width: 530px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px; }
    .stack-box .stack-box-content .stack-box-content-subtitle {
      font-size: 14px;
      font-weight: 700;
      text-transform: uppercase;
      display: flex;
      align-items: center;
      gap: 8px; }
      .stack-box .stack-box-content .stack-box-content-subtitle:before {
        content: '';
        width: 30px;
        height: 1px;
        background: #009093;
        display: block;
        flex-shrink: 0; }
      .stack-box .stack-box-content .stack-box-content-subtitle span {
        display: inline-block;
        color: #005457;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-image: linear-gradient(90deg, #009093 0%, #005457 100%); }
    .stack-box .stack-box-content .h1 {
      font-size: 60px;
      line-height: 1.2; }
      @media (max-width: 1024px) {
        .stack-box .stack-box-content .h1 {
          font-size: 48px; } }
      @media (max-width: 767px) {
        .stack-box .stack-box-content .h1 {
          font-size: 32px; } }

/*# sourceMappingURL=work-list.css.map */
