.section6_component {
  position: relative;
  width: 100%;
  height: 636px;

  overflow: hidden;
  background-color: #060415;

  @media(max-width: 744px) {
    align-self: center;
    width: 100%;
    height: 630px;
    margin: 0 24px;
    border-radius: 16px;
  }
}

.section6_bg {
  position: absolute;
  width: 1578px;
  height: 636px;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background-image: url('../images/section6/bg.png');
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
  border-radius: 60px;
  overflow: hidden;

  /*@media(max-width: 1300px) {*/
  /*  width: 1272px;*/
  /*  height: 636px;;*/
  /*}*/

  @media(max-width: 774px) {
    background-image: url('../images/section6/bg_m.png');
    height: 630px;
  }
}

.section6_inner {
  position: absolute;
  width: 984px;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  flex-direction: column;
  z-index: 3;


  @media (max-width: 984px) {
    width: 744px;
  }

  @media(max-width: 800px) {
    display: none;
  }
}

.section6_innerMobile {
  display: none;

  @media(max-width: 744px) {
    position: absolute;
    top: 0;
    left: 0;
    transform: unset;
    width: calc(100% - 48px);
    height: calc(100% - 48px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 3;

    padding: 24px;
  }
}

.section6_mobile_title {
  margin-bottom: 28px;
}

.section6_bar {
  margin-top: 64px;
  display: flex;
  flex-direction: row;
  align-items: flex-end;

}

.section6_dummy {
  width: 24px;
  height: 2px;
  background-color: #ff3c00;

  @media(max-width: 984px) {
    width: 16px;
  }
}

.section6_barItem {
  flex:1;
  display: flex;
  flex-direction: column;
  gap: 20px;

  > p {
    color: #FFF;
    font-size: 28px;
    font-weight: 400;
    line-height: 40px; /* 125% */

    > b {
      color: #ff3c00;
      font-size: 40px;
      font-weight: 700;
    }
  }

  /*@media(max-width: 984px) {*/
  /*  > p {*/
  /*    font-size: 26px;*/
  /*    >b {*/
  /*      font-size: 38px;*/
  /*    }*/
  /*  }*/
  /*}*/
}

.section6_line {
  height: 2px;
  background-color: #ff3c00;
  position: relative;
}

.section6_contents {
  margin-top: 16px;
  display: flex;
  flex-direction: row;
  gap: 24px;

  /*@media(max-width: 1300px) {*/
  /*  gap: 16px;*/
  /*}*/
}

.section6_section1 {
  display: flex;
  flex-direction: column;
  gap: 8px;

  @media(max-width: 1300px) {
    gap: 8px;
  }
}

.current_section {
  .section6_box{
    background: rgba(255, 255, 255, 0.1);
    > p {
      color: #FFF;
    }
  }
}

.section6_box {
  display: flex;
  flex-direction: row;
  width: calc(312px - 48px);
  height: calc(62px - 32px);

  padding: 16px 24px;
  align-items: center;
  gap: 8px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  > p {
    color: #A5A5A5;
    font-size: 16px;
    font-weight: 400;
  }

  > img {
    width: 16px;
    height: 16px;
  }

  @media(max-width: 984px) {
    width: calc(232px - 48px);

    > p {
      font-size: 12px;
    }
  }

  @media(max-width: 744px) {
    width: calc(100% - 24px);
    height: calc(36px - 24px);
    padding: 12px;
    border-radius: 8px;

    > img {
      width: 12px;
      height: 12px;
    }

    > p {
      font-size: 12px;
    }
  }
}

.section6_shadow {
  box-shadow: 0px 30px 30px 0px rgba(0, 0, 0, 0.50);
}


.section6_sectionMobile {
  display: flex;
  flex-direction: row;
  gap: 20px;
}

.section6_lineMobile {
  width: 2px;
  background-color: #ff3c00;
  position: relative;
}

.section6_dot {
  position: absolute;
  top: -12px;
  left: -5px;
  width: 26px;
  height: 26px;

  background-size: contain;
  background-image: url('../images/section6/dot.svg');

  @media(max-width: 744px) {
    top: -3px;
    left: -11.5px;
  }
}

.section6_dummyMobile {
  width: 2px;
  height: 16px;
  background-color: #ff3c00;
}

.section6_boxWrapper {
  flex :1;
  display: flex;
  flex-direction: column;
  gap: 12px;

  > p {
    color: white;
    font-size: 16px;

    > b {
      font-size: 24px;
      color: #ff3c00;
    }
  }
}

.section6_boxes {
  display: flex;
  flex-direction: column;
  gap: 8px;
}