.next-spec {
  position: relative;
  z-index: 2;
  padding: 1rem;
}
@media (max-width: 767px) {
  .next-spec {
    background-color: var(--bg-dark-gray);
    border-radius: 1rem;
    padding: 0;
    overflow: hidden;
  }
  .next-spec .container {
    padding: 0 var(--container-padding);
  }
}
.next-spec-wrap {
  display: block;
  position: relative;
}
@media (max-width: 767px) {
  .next-spec-wrap {
    margin: 1rem;
  }
}
.next-spec-bg {
  position: absolute;
  z-index: 1;
  inset: 0;
}
@media (max-width: 767px) {
  .next-spec-bg {
    display: none;
  }
}
.next-spec-bg-inner {
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 1rem;
}
.next-spec-bg-solid {
  width: 100%;
  height: 100%;
  border-radius: 2rem;
  background-color: var(--bg-dark-gray);
}
@media (max-width: 1025px) {
  .next-spec-bg-solid {
    border-radius: 1rem;
  }
}
.next-spec-graphic {
  grid-column: 1/11;
  position: relative;
}
@media (max-width: 1025px) {
  .next-spec-graphic {
    grid-column: 1/7;
  }
}
@media (max-width: 767px) {
  .next-spec-graphic {
    grid-column: 1/-1;
    grid-row: 1/2;
  }
}
.next-spec-graphic-inner {
  position: sticky;
  top: 1rem;
  height: calc(100vh - 2rem);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -10rem;
  margin-right: 10rem;
}
@media (max-width: 1025px) {
  .next-spec-graphic-inner {
    margin-left: 0;
    margin-right: 0;
  }
}
@media (max-width: 767px) {
  .next-spec-graphic-inner {
    position: static;
    width: 100%;
    aspect-ratio: 1;
    height: auto;
  }
}
.next-spec-graphic-canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--bg-dark-gray);
}
@media (min-width: 768px) and (max-width: 1025px) {
  .next-spec-graphic-canvas {
    padding-left: 1.8rem;
  }
}
.next-spec-graphic-img {
  max-width: 80rem;
  margin-left: 1.2rem;
  display: none;
}
@media (max-width: 1025px) {
  .next-spec-graphic-img {
    margin-left: 1.8rem;
  }
}
.next-spec-title-wrap {
  display: block;
  margin-bottom: 8rem;
}
@media (max-width: 1025px) {
  .next-spec-title-wrap {
    margin-bottom: 5.6rem;
  }
}
@media (max-width: 767px) {
  .next-spec-title-wrap {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-bottom: 3.2rem;
  }
}
.next-spec-label {
  color: var(--cl-white-50);
  margin-bottom: 1.2rem;
}
.next-spec-title {
  color: var(--cl-white);
}
@media (max-width: 767px) {
  .next-spec-title {
    width: max-content;
    text-align: center;
    max-width: 32.5rem;
  }
}
@media (min-width: 768px) and (max-width: 1025px) {
  .next-spec-title .txt-54 {
    font-size: 3.6rem;
  }
}
.next-spec-main {
  grid-column: 12/-1;
  grid-row: 1/2;
  padding-block: 17.6rem;
  position: relative;
  z-index: 1;
}
@media (max-width: 1025px) {
  .next-spec-main {
    grid-column: 8/-1;
    padding-right: 1.8rem;
    padding-block: 12.4rem;
  }
}
@media (max-width: 767px) {
  .next-spec-main {
    grid-column: 1/-1;
    grid-row: 2/3;
    padding: 3rem 0 6.4rem;
  }
}
.next-spec-main-cover {
  grid-column: 12/-1;
  grid-row: 1/2;
  pointer-events: none;
  z-index: 2;
  position: relative;
}
@media (max-width: 767px) {
  .next-spec-main-cover {
    grid-column: 1/-1;
  }
}
.next-spec-main-cover-inner {
  height: calc(100vh - 2rem);
  top: 1rem;
  position: sticky;
  background: linear-gradient(180deg, var(--bg-dark-gray) 0%, rgba(37, 37, 37, 0) 17.6rem, rgba(37, 37, 37, 0) calc(100% - 17.6rem), var(--bg-dark-gray) 100%);
}
@media (max-width: 767px) {
  .next-spec-main-cover-inner {
    display: none;
  }
}
.next-spec-list-inner {
  display: flex;
  flex-direction: column;
  row-gap: 6rem;
}
@media (min-width: 768px) and (max-width: 1025px) {
  .next-spec-list-inner {
    gap: 6.4rem;
  }
}
@media (max-width: 767px) {
  .next-spec-list-inner {
    gap: 4rem;
  }
}
.next-spec-list-grp-title {
  color: var(--cl-white);
  margin-bottom: 2rem;
}
.next-spec-list-grp-item {
  display: flex;
  flex-direction: column;
  row-gap: 1.6rem;
}
.next-spec-list-grp-item-title {
  color: var(--cl-white);
}
.next-spec-list-grp-item-sub {
  color: var(--cl-white-50);
}
.next-spec-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 1.6rem;
  position: relative;
}
.next-spec-list-item-title {
  color: var(--cl-white-50);
}
.next-spec-list-item-sub {
  color: var(--cl-white-50);
}
.next-spec-list-item > .div-line {
  background-color: var(--cl-white-10);
  position: absolute;
  left: 0;
}
.next-spec-list-item > .div-line.top {
  top: 0;
  display: none;
}
.next-spec-list-item > .div-line.bot {
  bottom: 0;
}
.next-spec-list-item:first-child > .div-line.top {
  display: block;
}

/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../src/scss/sections/sc-next-spec.scss%22,%22../src/scss/global/tool.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAEA;EACI;EACA;EACA;;ACJF;EDCF;IAMQ;IACA;IACA;IACA;;EAEA;IACI;;;AAIR;EACI;EACA;;ACnBN;EDiBE;IAKQ;;;AAIR;EACI;EACA;EACA;;AC7BN;ED0BE;IAMQ;;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AClCV;ED8BM;IAOQ;;;AAKZ;EACI;EACA;;AC5CN;ED0CE;IAKQ;;;AC3DV;EDsDE;IASQ;IACA;;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AChEV;EDwDM;IAWQ;IACA;;;AChFd;EDoEM;IAgBQ;IACA;IACA;IACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AC9FV;EDqFM;IAYQ;;;AAIR;EACI;EACA;EACA;;AClGV;ED+FM;IAMQ;;;AAKZ;EACI;EACA;;AC5GN;ED0GE;IAKQ;;;AC3HV;EDsHE;IASQ;IACA;IACA;IACA;;;AAIR;EACI;EACA;;AAGJ;EACI;;AC5IN;ED2IE;IAIQ;IACA;IACA;;;AC3IV;ED8IM;IAEQ;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;ACpJN;ED+IE;IAQQ;IACA;IACA;;;ACrKV;ED2JE;IAcQ;IACA;IACA;;;AAKJ;EACI;EACA;EACA;EACA;EACA;;ACrLV;EDgLM;IAQQ;;;AAGJ;EACI;EACA;EACA;EACA;;AC/Ld;ED2LU;IAQQ;;;AAOZ;EACI;EACA;EACA;;ACvMV;EDoMM;IAMQ;;;AChNd;ED0MM;IAUQ;;;AAKJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAKJ;EACI%22,%22file%22:%22sc-next-spec.css%22%7D */