@charset "UTF-8";
:root {
  --color-main: #146EB8;
  --color-sub: #B81463;
  --color-white: #FFFFFF;
  --color-black: #000000;
  --font-pretendard: 'Pretendard', sans-serif;
  --font-montserrat: 'Montserrat', sans-serif;
  --gradient-light1: linear-gradient(180deg, #146EB8 0%, #0F416E 100%);
  --gradient-light2: linear-gradient(180deg, #146EB8 0%, #0A2A44 100%);
  --gradient-middle: linear-gradient(180deg, #111B31 0%, #081022 100%);
  --gradient-dark1: linear-gradient(180deg, #070D1B 0%, #0A1327 100%);
  --gradient-dark2: linear-gradient(180deg, #050A15 0%, #0A1327 100%);
  --gradient-opacity: linear-gradient(180deg,  #0A1327 0%, rgba(7, 13, 27, 0.70) 100%);
  --gradient-purple: linear-gradient(180deg, #B81463 0%, #9A1455 44.79%, #731542 100%);
}

.font35 {
  --fontsize: 3.5rem;
  font-size: var(--fontsize);
}

.font45 {
  --fontsize: 4.5rem;
  font-size: var(--fontsize);
}

.font50 {
  --fontsize: 5.0rem;
  font-size: var(--fontsize);
}

.font60 {
  --fontsize: 6.0rem;
  font-size: var(--fontsize);
}

.font70 {
  --fontsize: 7.0rem;
  font-size: var(--fontsize);
}

.font80 {
  --fontsize: 8.0rem;
  font-size: var(--fontsize);
}

.font100 {
  --fontsize: 10.0rem;
  font-size: var(--fontsize);
}

#sv {
  width: 100%;
  position: relative;
}

#sv .bg {
  width: 100%;
  position: absolute;
  z-index: -1;
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
  -webkit-transition: all 1.6s linear;
  transition: all 1.6s linear;
}

#sv .bg img {
  width: 100%;
}

#sv .flexBox {
  padding: 13.5% 0 26.085%;
  position: relative;
}

#sv .title *,
#sv .pathBox,
#sv .svText {
  opacity: 0;
  -webkit-transition: all 1.2s;
  transition: all 1.2s;
}

#sv .title * {
  -webkit-transform: translateX(80px);
          transform: translateX(80px);
}

#sv .title h2 {
  font-weight: 700;
  opacity: 0;
  margin: 0 0 25px;
}

#sv .title p {
  font-weight: 300;
  line-height: 1.6;
  font-family: var(--font-pretendard);
}

#sv .pathBox,
#sv .path {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#sv .pathBox {
  margin: 65px 0 0;
  position: relative;
  z-index: 2;
  -webkit-transform: translateY(80px);
          transform: translateY(80px);
}

#sv .pathBox .path::before {
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  background: var(--color-white);
  margin: 0 20px;
}

#sv .pathBox .path a {
  font-size: 2.0rem;
  font-weight: 700;
}

#sv .pathBox .path.regular a {
  font-weight: 400;
}

#sv .pathBox .path2 {
  position: relative;
}

#sv .pathBox .path2 button {
  gap: 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#sv .pathBox .path2 button span {
  font-size: 2.0rem;
  font-weight: 700;
}

#sv .pathBox .path2 button span br {
  display: none;
}

#sv .pathBox .path2 button figure {
  width: 22px;
  height: 22px;
  background: var(--color-white);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#sv .pathBox .path2 button figure img {
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

#sv .pathBox .path2 button.on figure img {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg);
}

#sv .pathBox .path2 ul {
  background: var(--color-main);
  border-radius: 15px;
  text-align: center;
  padding: 15px 25px;
  position: absolute;
  top: calc(100% + 15px);
  right: 0;
  display: none;
}

#sv .pathBox .path2 ul a {
  display: block;
  font-weight: 400;
  line-height: 1.3;
  font-family: var(--font-pretendard);
  white-space: nowrap;
  padding: 12px 0;
}

#sv .pathBox .path2 ul a br {
  display: none;
}

#sv .svText {
  font-weight: 300;
  line-height: 1.4;
  text-align: right;
  position: absolute;
  right: 0;
  bottom: 0;
  -webkit-transform: translateX(-80px);
          transform: translateX(-80px);
}

#sv .svText b {
  font-weight: 700;
}

#sv.on .bg {
  -webkit-transform: scale(1);
          transform: scale(1);
}

#sv.on .title *,
#sv.on .pathBox,
#sv.on .svText {
  opacity: 1;
}

#sv.on .title * {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

#sv.on .title p {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

#sv.on .pathBox {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

#sv.on .svText {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.subWrap {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.subWrap .paddingBox {
  padding: 150px 0;
}

.subWrap .paddingTop {
  padding: 150px 0 0;
}

.subWrap .paddingBottom {
  padding: 0 0 150px;
}

.subWrap .gap100 {
  gap: 100px 0;
}

.subWrap .gap150 {
  gap: 150px 0;
}

.subWrap .topTitle {
  margin: 0 0 70px;
}

.subWrap .topTitle .flexBox {
  gap: 0 20px;
}

.subWrap .topTitle .flexBox span {
  margin: auto 0 0.4em;
}

.subWrap .topTitle span,
.subWrap .topTitle p,
.subWrap .topTitle ol li {
  font-weight: 300;
  font-family: var(--font-pretendard);
}

.subWrap .topTitle span {
  font-size: 2.4rem;
}

.subWrap .topTitle > p {
  font-size: 2.0rem;
  line-height: 1.8;
  margin: 30px 0 0;
}

.subWrap .topTitle ol {
  padding-left: 1.8rem;
  margin: 10px 0 0;
}

.subWrap .topTitle ol li {
  color: rgba(255, 255, 255, 0.7);
  font-size: 1.8rem;
  line-height: 1.8;
}

.subWrap ol.number {
  list-style: auto;
}

.subWrap ol.number,
.subWrap ol.number * {
  font-family: var(--font-pretendard);
}

.subWrap .gradient {
  background: var(--gradient-opacity);
  border-radius: 20px;
}

.subWrap .borderW {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
}

.subWrap h5.line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  gap: 0 30px;
  color: var(--color-main);
  font-weight: 600;
  white-space: nowrap;
  margin: 0 0 70px;
}

.subWrap h5.line::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: var(--color-main);
  -webkit-transform: translateY(-0.1em);
          transform: translateY(-0.1em);
}

.subWrap .popup {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: none;
}

.subWrap .popup .cover,
.subWrap .popup .flexBox {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .popup .cover {
  background: rgba(0, 0, 0, 0.9);
  z-index: -1;
  width: 100%;
  height: 100%;
}

.subWrap .popup .flexBox {
  gap: 0 10px;
}

.subWrap .popup .inner {
  max-height: calc(100vh - 100px);
  overflow-y: scroll;
}

.subWrap .popup .inner::-webkit-scrollbar {
  width: 0;
}

.subWrap .popup button {
  width: 65px;
  height: 65px;
  flex-shrink: 0;
  background: #222;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .popup button i {
  font-size: 2.8rem;
}

.subWrap .subPage .credit {
  margin: 180px 0 60px;

  /* 24.11.01 */
  display: none;
}

.subWrap .subPage .credit .item {
  height: 250px;
  gap: 0 14%;
  background: var(--gradient-middle);
  border-radius: 20px;
  padding: 0 8%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .subPage .credit h4 {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-weight: 700;
}

.subWrap .subPage .credit .gridBox {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (auto)[4];
      grid-template-columns: repeat(4, auto);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.subWrap .subPage .credit .gridBox.type5 {
  -ms-grid-columns: (auto)[5];
      grid-template-columns: repeat(5, auto);
}

.subWrap .subPage .credit dl dt {
  font-size: 2.2rem;
  font-weight: 500;
  margin: 0 0 15px;
}

.subWrap .subPage .credit dl dd {
  font-size: 1.8rem;
  font-weight: 300;
  font-family: var(--font-pretendard);
}

.subWrap .biobank .gradient {
  padding: 70px;
}

.subWrap .biobank .gradient .border {
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.subWrap .biobank .gradient .border.dashed {
  border-style: dashed;
}

.subWrap .biobank .gradient ul li:not(.gradientX),
.subWrap .biobank .gradient dl:not(.gradientX) {
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}

.subWrap .biobank .gradient ul li:not(.gradientX) > *,
.subWrap .biobank .gradient dl:not(.gradientX) > * {
  position: relative;
  z-index: 1;
}

.subWrap .biobank .gradient ul li:not(.gradientX)::before,
.subWrap .biobank .gradient dl:not(.gradientX)::before {
  content: "";
  display: block;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biobank .platform h4 {
  font-weight: 700;
  text-align: center;
  margin: 15px 0 50px;
}

.subWrap .biobank .platform .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 30px;
}

.subWrap .biobank .platform .item {
  width: calc(50% - 15px);
  padding: 50px 45px 35px;
}

.subWrap .biobank .platform .item *:not(h5) {
  text-align: center;
}

.subWrap .biobank .platform .item h5 {
  font-weight: 500;
  margin: 0 0 20px;
}

.subWrap .biobank .platform .item h5 em {
  font-size: 3.0rem;
  font-weight: 300;
}

.subWrap .biobank .platform .item ul li::before,
.subWrap .biobank .platform .item dl::before {
  background: var(--gradient-light1);
}

.subWrap .biobank .platform .item ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px 0;
}

.subWrap .biobank .platform .item ul li {
  height: 82px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biobank .platform .item ul b, .subWrap .biobank .platform .item ul em {
  display: block;
  line-height: 1.6;
}

.subWrap .biobank .platform .item ul b {
  font-size: 2.0rem;
  font-weight: 600;
}

.subWrap .biobank .platform .item ul em {
  font-size: 1.8rem;
  font-weight: 300;
}

.subWrap .biobank .platform .bottom {
  width: 100%;
}

.subWrap .biobank .platform .bottom .flexBox {
  gap: 0 30px;
}

.subWrap .biobank .platform .bottom .flexBox > * {
  width: calc(50% - 15px);
}

.subWrap .biobank .platform .bottom dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 20px 45px 25px;
}

.subWrap .biobank .platform .bottom dl dt {
  font-size: 2.2rem;
  font-weight: 600;
}

.subWrap .biobank .platform .bottom dl dd {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
  gap: 5px;
  margin: auto 0 0;
}

.subWrap .biobank .platform .bottom dl span {
  width: 100%;
  height: 35px;
  border-radius: 5px;
  font-size: 1.4rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biobank .platform .bottom dl span::before {
  content: "";
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 5px;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biobank .platform .bottom ul li {
  height: 100px;
}

.subWrap .biobank .tree .itemBox {
  display: -ms-grid;
  display: grid;
      grid-template-areas: "item1 . item2"
 ". center ."
 "item3 . item4";
  -ms-grid-columns: (minmax(auto, 400px))[3];
      grid-template-columns: repeat(3, minmax(auto, 400px));
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 30px 80px;
  margin: 0 0 60px;
}

.subWrap .biobank .tree .itemBox .item {
  width: 100%;
  max-width: 400px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.subWrap .biobank .tree .itemBox .item dl {
  height: 100%;
}

.subWrap .biobank .tree .itemBox .item dl::before {
  background: var(--gradient-light2);
}

.subWrap .biobank .tree .itemBox .item dl dt {
  font-size: 2.4rem;
  font-weight: 600;
  margin-bottom: 15px;
}

.subWrap .biobank .tree .itemBox .item dl dd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px 0;
}

.subWrap .biobank .tree .itemBox .item dl dd p {
  font-weight: 300;
  line-height: 1.3;
  font-family: var(--font-pretendard);
}

.subWrap .biobank .tree .itemBox .item:not(.center) {
  padding: 40px 10px 10px;
}

.subWrap .biobank .tree .itemBox .item:not(.center) dl {
  padding: 25px 20px 20px;
}

.subWrap .biobank .tree .itemBox .item1 {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: item1;
}

.subWrap .biobank .tree .itemBox .item2 {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: item2;
}

.subWrap .biobank .tree .itemBox .item3 {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  grid-area: item3;
}

.subWrap .biobank .tree .itemBox .item4 {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: item4;
}

.subWrap .biobank .tree .itemBox .center {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: center;
  margin: -140px 0;
  position: relative;
}

.subWrap .biobank .tree .itemBox .center::before, .subWrap .biobank .tree .itemBox .center::after {
  content: "";
  display: block;
  width: 80px;
  height: 160px;
  border-top: 1px dashed var(--color-sub);
  border-bottom: 1px dashed var(--color-sub);
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.subWrap .biobank .tree .itemBox .center::before {
  left: -80px;
}

.subWrap .biobank .tree .itemBox .center::after {
  right: -80px;
}

.subWrap .biobank .tree .itemBox .center .inner {
  border-radius: 20px;
  padding: 50px 30px 35px;
  position: relative;
  overflow: hidden;
}

.subWrap .biobank .tree .itemBox .center .inner > * {
  position: relative;
  z-index: 1;
}

.subWrap .biobank .tree .itemBox .center .inner::before {
  content: "";
  display: block;
  background: var(--gradient-purple);
  border-radius: 20px;
  opacity: 0.6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biobank .tree .itemBox .center dl dt {
  margin-top: 30px;
}

.subWrap .biobank .tree .itemBox .center dl dd {
  gap: 25px 0;
}

.subWrap .biobank .tree .itemBox .title {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.subWrap .biobank .tree .itemBox .title h5 {
  font-weight: 500;
}

.subWrap .biobank .tree .itemBox .title p {
  font-size: 1.4rem;
  font-weight: 200;
  font-family: var(--font-pretendard);
  margin: 5px 0 20px;
  opacity: 0.5;
}

.subWrap .biobank .tree .bottom {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[3];
      grid-template-columns: repeat(3, 1fr);
  gap: 0 45px;
}

.subWrap .biobank .tree .bottom .border {
  height: 120px;
  color: rgba(255, 255, 255, 0.3);
  font-size: 3.0rem;
  font-weight: 500;
  margin: 0 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biobank .tree .bottom span {
  display: block;
  color: rgba(255, 255, 255, 0.5);
  font-size: 1.4rem;
  font-weight: 300;
  text-align: right;
  font-family: var(--font-pretendard);
}

.subWrap .biobank .tree .item * {
  text-align: center;
}

.subWrap .biobank .information {
  margin: 100px 0;
}

.subWrap .biobank .information .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 70px 0;
}

.subWrap .biobank .information .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0 120px;
}

.subWrap .biobank .information .reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  gap: 0 60px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-left: 100px;
}

.subWrap .biobank .information .icon {
  width: 29.32%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: var(--gradient-opacity);
  border-radius: 20px;
  padding: 14.66% 0;
  position: relative;
}

.subWrap .biobank .information .icon img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biobank .information .text {
  padding: 40px 0 0;
}

.subWrap .biobank .information .text h4 {
  font-weight: 700;
  margin: 0 0 45px;
}

.subWrap .biobank .information .text dl * {
  font-family: var(--font-pretendard);
}

.subWrap .biobank .information .text dl dt {
  font-size: 2.2rem;
  font-weight: 600;
  margin: 0 0 15px;
}

.subWrap .biobank .information .text dl dt em {
  font-weight: 300;
}

.subWrap .biobank .information .text dl dd * {
  font-weight: 300;
}

.subWrap .biobank .information .text dl dd p {
  font-size: 1.8rem;
  line-height: 1.6;
  margin: 0 0 30px;
  opacity: 0.7;
}

.subWrap .biobank .information .text dl dd span {
  font-size: 1.4rem;
  opacity: 0.5;
}

.subWrap .biobank .description table {
  position: relative;
}

.subWrap .biobank .description table * {
  color: rgba(255, 255, 255, 0.9);
  font-family: var(--font-pretendard);
}

.subWrap .biobank .description table.center td {
  text-align: center;
}

.subWrap .biobank .description table th,
.subWrap .biobank .description table td {
  height: 100px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.subWrap .biobank .description table th.rightX,
.subWrap .biobank .description table td.rightX {
  border-right: none;
}

.subWrap .biobank .description table th {
  font-size: 2.2rem;
  font-weight: 600;
}

.subWrap .biobank .description table td {
  font-size: 2.0rem;
}

.subWrap .biobank .description table td em {
  font-size: 1.5rem;
  line-height: 1.2;
}

.subWrap .biobank .description table thead th {
  height: 70px;
  border-top: 1px solid var(--color-main);
}

.subWrap .biobank .description table thead th:not(.empty) {
  background: var(--gradient-light2);
}

.subWrap .biobank .description table thead th.empty {
  border-bottom: 1px solid var(--color-main);
}

.subWrap .biobank .description table thead .top th {
  height: 80px;
  background: none;
  border: none;
  color: var(--color-sub);
  font-size: 2.4rem;
}

.subWrap .biobank .description table thead .top .mark {
  width: calc((67.35% / 5) * 3);
  height: 100%;
  border: 2px solid var(--color-sub);
  position: absolute;
  top: 0;
  right: 0;
}

.subWrap .biobank .description table thead .top .mark {
  width: calc((67.35% / 4) * 2);
}

.subWrap .biobank .description .note {
  margin: 30px 0 0;
}

.subWrap .biobank .description .note span {
  display: block;
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 1.6;
  font-family: var(--font-pretendard);
  padding-left: 25px;
  position: relative;
}

.subWrap .biobank .description .note span::before {
  position: absolute;
  left: 0;
}

.subWrap .biobank .description .note .note1::before {
  content: "*";
}

.subWrap .biobank .description .note .note2::before {
  content: "**";
}

.subWrap .biomarkers .tlbm .flexBox,
.subWrap .biomarkers .framework .flexBox,
.subWrap .biomarkers .example .flexBox {
  gap: 0 20px;
}

.subWrap .biomarkers .tlbm .flexBox > *,
.subWrap .biomarkers .framework .flexBox > *,
.subWrap .biomarkers .example .flexBox > * {
  width: calc(50% - 10px);
}

.subWrap .biomarkers .tlbm .gradient {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 55px 20px 40px;
}

.subWrap .biomarkers .tlbm h5 {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-weight: 500;
  text-align: center;
  margin: 0 0 55px;
}

.subWrap .biomarkers .tlbm figure {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biomarkers .framework .itemBox > p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 3px;
  font-size: 1.4rem;
  font-family: var(--font-pretendard);
  line-height: 1.3;
  margin: 20px 0 0;
  opacity: 0.7;
}

.subWrap .biomarkers .framework .itemBox > p::before {
  content: "*";
}

.subWrap .biomarkers .framework .gradient {
  text-align: center;
  padding: 50px 30px;
  position: relative;
}

.subWrap .biomarkers .framework .case .blurCircle {
  width: 72.5%;
  background: rgba(20, 110, 184, 0.15);
  border-radius: 50%;
  padding: 31.5% 0;
  -webkit-filter: blur(60px);
          filter: blur(60px);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biomarkers .framework .case ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0 5px;
  text-align: center;
}

.subWrap .biomarkers .framework .case ul p {
  font-size: 1.8rem;
  font-weight: 500;
  margin: 20px 0 0;
}

.subWrap .biomarkers .example .gradient {
  padding: 50px 60px;
}

.subWrap .biomarkers .example ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 15px 0;
  margin: 0 0 25px;
}

.subWrap .biomarkers .example ul li {
  gap: 0 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .biomarkers .example ul span {
  width: 100px;
  height: 100px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border-radius: 50%;
  font-size: 3.0rem;
  font-weight: 300;
  line-height: 1.3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biomarkers .example ul span em {
  font-size: 3.5rem;
}

.subWrap .biomarkers .example ul .bgS {
  background: var(--color-sub);
}

.subWrap .biomarkers .example ul .bgM {
  background: var(--color-main);
}

.subWrap .biomarkers .example dl dt {
  font-size: 2.4rem;
  font-weight: 600;
  margin: 0 0 15px;
}

.subWrap .biomarkers .example dl dd,
.subWrap .biomarkers .example dl dd b {
  font-family: var(--font-pretendard);
}

.subWrap .biomarkers .example dl dd {
  font-size: 1.8rem;
  font-weight: 300;
  line-height: 1.3;
}

.subWrap .biomarkers .example dl dd b {
  font-size: 2.0rem;
  font-weight: 600;
}

.subWrap .biomarkers .example table * {
  font-family: var(--font-pretendard);
}

.subWrap .biomarkers .example table th,
.subWrap .biomarkers .example table td {
  height: 45px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  text-align: center;
}

.subWrap .biomarkers .example table th:last-child,
.subWrap .biomarkers .example table td:last-child {
  border-right: none;
}

.subWrap .biomarkers .example table thead {
  border-radius: 5px;
  position: relative;
}

.subWrap .biomarkers .example table thead::before {
  content: "";
  display: block;
  background: var(--gradient-light1);
  border-radius: 5px;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biomarkers .example table thead span {
  font-size: 1.8rem;
  font-weight: 500;
  position: relative;
  z-index: 1;
}

.subWrap .biomarkers .example table tbody td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-weight: 500;
  line-height: 1.2;
}

.subWrap .biomarkers .process .flexBox {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.subWrap .biomarkers .process .circleBox,
.subWrap .biomarkers .process ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.subWrap .biomarkers .process .circleBox {
  width: 65.34%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.subWrap .biomarkers .process ul {
  width: 28.35%;
}

.subWrap .biomarkers .process span,
.subWrap .biomarkers .process span::after {
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.subWrap .biomarkers .process span {
  height: 1px;
  background: var(--color-white);
}

.subWrap .biomarkers .process span:not(.arrowX)::after {
  content: "";
  width: 5px;
  height: 6px;
  background: url("/img/sub/biomarkersArrow.png") no-repeat center/cover;
  right: -5px;
}

.subWrap .biomarkers .process em {
  font-size: 2.4rem;
  white-space: nowrap;
  position: absolute;
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biomarkers .process .circle {
  width: 20.40%;
  padding: 10.20% 0;
}

.subWrap .biomarkers .process .circle span {
  width: 25%;
  right: -25%;
}

.subWrap .biomarkers .process .circle,
.subWrap .biomarkers .process ul li {
  position: relative;
}

.subWrap .biomarkers .process .circle::before,
.subWrap .biomarkers .process ul li::before {
  content: "";
  display: block;
  background: var(--gradient-light1);
  opacity: 0.5;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .biomarkers .process .circle::before {
  border-radius: 50%;
}

.subWrap .biomarkers .process ul {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px 0;
  position: relative;
}

.subWrap .biomarkers .process ul::before {
  content: "";
  display: block;
  width: 1px;
  height: calc(100% - 80px);
  background: var(--color-white);
  position: absolute;
  top: 50%;
  left: -10.5%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.subWrap .biomarkers .process ul li {
  height: 80px;
}

.subWrap .biomarkers .process ul li::before {
  border-radius: 10px;
}

.subWrap .biomarkers .process ul li span {
  width: 8%;
  left: -10.5%;
}

.subWrap .biomarkers .pipeline .tableBox * {
  font-family: var(--font-pretendard);
  line-height: 1.2;
  text-align: center;
}

.subWrap .biomarkers .pipeline table tr {
  width: 100%;
  position: -webkit-sticky !important;
  position: sticky !important;
}

.subWrap .biomarkers .pipeline table th {
  font-size: 2.0rem;
  font-weight: 600;
}

.subWrap .biomarkers .pipeline table thead {
  border-top: 1px solid var(--color-main);
  border-bottom: 1px solid var(--color-main);
}

.subWrap .biomarkers .pipeline table thead th {
  height: 85px;
  color: var(--color-main);
}

.subWrap .biomarkers .pipeline table thead th:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.subWrap .biomarkers .pipeline table tbody th, .subWrap .biomarkers .pipeline table tbody td {
  height: 75px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.subWrap .biomarkers .pipeline table tbody td,
.subWrap .biomarkers .pipeline table tbody td * {
  font-size: 1.6rem;
}

.subWrap .biomarkers .pipeline table tbody td {
  font-weight: 300;
}

.subWrap .biomarkers .pipeline table tbody td.font18 {
  font-size: 1.8rem;
}

.subWrap .biomarkers .pipeline table tbody td:not(.borderX) {
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.subWrap .biomarkers .pipeline table div {
  height: 50px;
  position: absolute;
}

.subWrap .biomarkers .pipeline table .inset {
  width: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.subWrap .biomarkers .pipeline table .inner {
  width: 100%;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: right center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .biomarkers .pipeline table .colorL {
  background-image: url("/img/sub/biomarkersBarL.png");
}

.subWrap .biomarkers .pipeline table .colorD {
  background-image: url("/img/sub/biomarkersBarD.png");
}

.subWrap .biomarkers .pipeline table span {
  white-space: nowrap;
  opacity: 0;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}

.subWrap .discovery .framework .flexBox {
  gap: 0 25px;
}

.subWrap .discovery .framework .flexBox > * {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .discovery .framework .gradient {
  padding: 55px 65px;
}

.subWrap .discovery .deepct .flexBox {
  gap: 0 20px;
}

.subWrap .discovery .deepct .flexBox > .gradient {
  padding: 120px 50px 40px;
}

.subWrap .discovery .deepct .borderW,
.subWrap .discovery .deepct .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.subWrap .discovery .deepct .borderW {
  padding: 25px 10px 10px;
}

.subWrap .discovery .deepct .borderW h5 {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-weight: 500;
  margin: 0 0 10px;
}

.subWrap .discovery .deepct .itemBox {
  height: 100%;
}

.subWrap .discovery .deepct .itemBox .gradient {
  padding: 20px;
}

.subWrap .discovery .deepct .itemBox .margin {
  padding: 0 40px;
  margin: auto 0 0;
  position: relative;
}

.subWrap .discovery .deepct .itemBox .margin .y {
  -webkit-transform: translateY(-12%);
          transform: translateY(-12%);
}

.subWrap .discovery .deepct .itemBox .line {
  width: 39.5%;
  position: absolute;
  top: -19%;
  left: -20%;
}

.subWrap .response .example .gridBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (auto)[2];
      grid-template-columns: repeat(2, auto);
  gap: 0 20px;
}

.subWrap .response .example .gradient {
  padding: 70px 70px 60px;
}

.subWrap .response .example .gradient h6 {
  width: 100%;
  height: 76px;
  border: 1px solid var(--color-white);
  border-radius: 10px;
  font-size: 2.4rem;
  font-weight: 600;
  white-space: nowrap;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .response .example .gradient h6 .arrow {
  position: absolute;
  top: 50%;
  right: -11.5%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.subWrap .response .example .gradient .img {
  margin: 10px 0 45px;
}

.subWrap .response .example .gradient dl * {
  font-family: var(--font-pretendard);
}

.subWrap .response .example .gradient dl dt {
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 1.6;
  margin: 0 0 20px;
}

.subWrap .response .example .gradient dl dd::before {
  content: "⦁";
  margin: 0 10px;
}

.subWrap .response .example .gradient dl p {
  display: inline-block;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 300;
  line-height: 1.6;
}

.subWrap .response .example .gradient dl p.underline {
  color: var(--color-white);
  text-decoration: underline;
}

.subWrap .repurposing .framework .borderW {
  padding: 50px 70px;
}

.subWrap .repurposing .framework ol {
  padding-left: 2.0rem;
  margin: 0 0 25px;
}

.subWrap .repurposing .framework ol li {
  font-size: 2.0rem;
  font-weight: 500;
  line-height: 2;
}

.subWrap .repurposing .framework .gridBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
  gap: 0 80px;
}

.subWrap .repurposing .framework .gridBox * {
  text-align: center;
}

.subWrap .repurposing .framework .gradient {
  padding: 30px;
}

.subWrap .repurposing .framework .item p {
  font-weight: 300;
  font-family: var(--font-pretendard);
  margin: 20px 0 0;
}

.subWrap .repurposing .example .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 20px;
}

.subWrap .repurposing .example .item {
  width: calc(50% - 100px);
}

.subWrap .repurposing .example .item figure {
  width: 100%;
  height: 350px;
  background: var(--color-white);
  border-radius: 10px;
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .repurposing .example .item3 {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}

.subWrap .repurposing .example .arrow {
  height: 350px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .repurposing .example .arrowL {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}

.subWrap .repurposing .example .top {
  width: 66.15%;
  height: 90px;
  border-radius: 10px 10px 0 0;
  padding: 25px 40px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .repurposing .example .top::before {
  content: "";
  background: var(--gradient-light1);
  border-radius: 10px 10px 0 0;
  opacity: 0.5;
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .repurposing .example .top .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 18px;
}

.subWrap .repurposing .example .top span {
  width: 18px;
  height: 18px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: var(--color-white);
  border-radius: 50%;
  color: #0B3357;
  font-size: 10px;
  font-weight: 900;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .repurposing .example .top p,
.subWrap .repurposing .example .top em {
  font-family: var(--font-pretendard);
  line-height: 1.1;
}

.subWrap .repurposing .example .top p {
  font-size: 2.0rem;
  font-weight: 600;
  -webkit-transform: translateY(-0.1em);
          transform: translateY(-0.1em);
}

.subWrap .repurposing .example .top em {
  display: block;
  font-size: 1.8rem;
  font-weight: 300;
}

.subWrap .combination .itemBox * {
  text-align: center;
}

.subWrap .combination .text {
  margin: 0 0 30px;
}

.subWrap .combination .text h4 {
  font-weight: 700;
}

.subWrap .combination .text p {
  margin: 20px 0 0;
}

.subWrap .combination .gradient {
  padding: 85px 70px 60px;
}

.subWrap .combination .borderW {
  padding: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .combination .column {
  gap: 50px 0;
}

.subWrap .combination .gridBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
  gap: 0 30px;
}

.subWrap .combination .gridBox .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.subWrap .combination .gridBox .item .borderW {
  height: 100%;
}

.subWrap .combination .gridBox .item > p {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.subWrap .combination .item p {
  font-size: 1.8rem;
  white-space: nowrap;
  text-align: center;
  margin: 25px 0 0;
}

.subWrap .combination .item .bgBlack {
  background: rgba(0, 0, 0, 0.2);
}

.subWrap .combination .item ul,
.subWrap .combination .item ul li {
  width: 100%;
}

.subWrap .combination .item ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 25px;
}

.subWrap .combination .item ul * {
  font-family: var(--font-pretendard);
}

.subWrap .combination .item ul li {
  padding: 40px 20px 50px;
}

.subWrap .combination .item ul h6 {
  font-size: 1.8rem;
  font-weight: 600;
  white-space: nowrap;
  margin: 0 0 35px;
}

.subWrap .combination .item ul .pBox {
  gap: 16px 0;
}

.subWrap .combination .item ul p {
  width: 100%;
  height: 35px;
  background: #40153C;
  border-radius: 100px;
  font-size: 1.6rem;
  font-weight: 500;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .combination .item ul p:nth-child(2) {
  background: var(--color-sub);
}

.subWrap .combination .arrow {
  margin: 0 0 25px;
  position: relative;
}

.subWrap .combination .arrow p {
  font-size: 2.0rem;
  font-weight: 700;
  line-height: 1.3;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .overview .video {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: -1;
  overflow: hidden;
  display: none;
}

.subWrap .overview .video video,
.subWrap .overview .video .cover {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .overview .video video {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.subWrap .overview .video .cover {
  width: 100%;
  height: 100%;
}

.subWrap .overview .video .cover img {
  max-width: inherit;
  width: 100%;
  height: 100%;
}

.subWrap .overview .information {
  height: 100vh;
  margin: 40px 0 0;
  position: relative;
}

.subWrap .overview .information .logo {
  width: 36.65%;
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(24);
          transform: translate(-50%, -50%) scale(24);
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-transition: all 1.6s;
  transition: all 1.6s;
}

.subWrap .overview .information .logo.scale {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
          transform: translate(-50%, -50%) scale(1);
}

.subWrap .overview .information .logo.small {
  width: 16%;
  top: 20%;
}

.subWrap .overview .information .text {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  padding: 60px 0 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .overview .information .text span,
.subWrap .overview .information .text .pBox {
  opacity: 0;
  -webkit-transition: all 0.8s;
  transition: all 0.8s;
}

.subWrap .overview .information .text span {
  display: block;
  font-weight: 600;
  line-height: 1.4;
}

.subWrap .overview .information .text span:first-child {
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
}

.subWrap .overview .information .text span:last-child {
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
}

.subWrap .overview .information .text .pBox {
  gap: 25px 0;
  margin: 60px 0 0;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}

.subWrap .overview .information .text .pBox p {
  font-size: 2.0rem;
  font-weight: 300;
  line-height: 1.8;
  font-family: var(--font-pretendard);
}

.subWrap .overview .information .text.spanOn span {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

.subWrap .overview .core {
  margin: 140px 0 0;
}

.subWrap .overview .core h4 {
  font-weight: 600;
  text-align: center;
  margin-bottom: 90px;
}

.subWrap .overview .core .line {
  padding-left: 80px;
}

.subWrap .overview .core .item {
  gap: 0 130px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .overview .core .item *:not(span) {
  font-family: var(--font-pretendard);
}

.subWrap .overview .core .item figure {
  width: 30%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border-radius: 20px;
  padding: 17.6675% 0;
  overflow: hidden;
}

.subWrap .overview .core .item figure img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .overview .core .item h5 {
  font-weight: 600;
  margin: 0 0 25px;
}

.subWrap .overview .core .item em {
  font-size: 2.0rem;
}

.subWrap .overview .core .item span {
  color: var(--color-main);
  font-weight: 600;
}

.subWrap .overview .core .item ul {
  margin: 20px 0 -20px;
}

.subWrap .overview .core .item ul li {
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .overview .core .item ul li::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: var(--color-white);
  border-radius: 50%;
  margin: 0 10px;
}

.subWrap .overview .core .reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

.subWrap .overview .core .text {
  margin: 90px 0 0;
}

.subWrap .overview .core .text h6 {
  font-size: 2.0rem;
  line-height: 1.3;
  margin: 0 0 20px;
}

.subWrap .overview .core .text .pBox {
  gap: 30px 0;
}

.subWrap .overview .core .text p {
  font-weight: 300;
  line-height: 1.8;
  opacity: 0.7;
}

.subWrap .history .contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 80px;
  padding-bottom: 400px;
}

.subWrap .history .year {
  width: 240px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 30px 0;
  text-align: right;
}

.subWrap .history .year button {
  color: rgba(255, 255, 255, 0.3);
  font-size: 4.0rem;
  font-weight: 700;
}

.subWrap .history .year .on button {
  color: var(--color-white);
  font-size: 10.0rem;
}

.subWrap .history .year.fixed {
  position: fixed;
  top: 20px;
}

.subWrap .history .column {
  margin: 0 0 0 auto;
}

.subWrap .history h6 {
  display: none;
}

.subWrap .history .listBox {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 10px 0;
  opacity: 0.4;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  -webkit-filter: blur(1px);
          filter: blur(1px);
}

.subWrap .history .listBox.on {
  opacity: 1;
  -webkit-filter: blur(0px);
          filter: blur(0px);
}

.subWrap .history .list {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: 0 50px;
  background: var(--gradient-opacity);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 20px;
  padding: 35px 70px;
}

.subWrap .history .list * {
  font-size: 2.4rem;
  font-weight: 600;
  font-family: var(--font-pretendard);
  line-height: 1.3;
}

.subWrap .history .list em {
  color: var(--color-main);
}

.subWrap .certi em {
  background: var(--color-main);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .certi p {
  font-weight: 400;
  line-height: 1.3;
  font-family: var(--font-pretendard);
}

.subWrap .certi .itemBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[5];
      grid-template-columns: repeat(5, 1fr);
  gap: 70px 30px;
}

.subWrap .certi .item {
  cursor: pointer;
}

.subWrap .certi .item .img {
  position: relative;
}

.subWrap .certi .item figure {
  border-radius: 7px;
  padding: 70.655% 0;
  position: relative;
  overflow: hidden;
}

.subWrap .certi .item figure img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .certi .item .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 10px;
  margin: 20px 0 0;
}

.subWrap .certi .item em {
  width: 25px;
  height: 25px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.subWrap .certi .item p {
  -webkit-transform: translateY(0.1em);
          transform: translateY(0.1em);
}

.subWrap .certi .item .hover {
  background: var(--gradient-light2);
  border-radius: 7px;
  opacity: 0;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .certi .item:hover .hover {
  opacity: 0.95;
}

.subWrap .certi .popup .inner,
.subWrap .certi .popup figure {
  border-radius: 10px;
}

.subWrap .certi .popup .inner {
  width: 500px;
  background: var(--color-white);
  padding: 25px 20px 20px;
}

.subWrap .certi .popup .inner > * {
  width: 100%;
}

.subWrap .certi .popup .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 15px;
  margin: 0 0 20px;
}

.subWrap .certi .popup figure {
  padding: 70.8% 0;
  position: relative;
}

.subWrap .certi .popup figure img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .certi .popup em {
  width: 41px;
  height: 41px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.subWrap .certi .popup p {
  color: #111;
  font-size: 1.8rem;
}

.subWrap .location .mapBox {
  width: 1800px;
  height: 800px;
  border-radius: 20px;
  position: relative;
  left: 50%;
  overflow: hidden;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.subWrap .location .root_daum_roughmap,
.subWrap .location .root_daum_roughmap .wrap_map {
  width: 100%;
  height: 100%;
}

.subWrap .location .infoBox,
.subWrap .location .infoBox .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.subWrap .location .infoBox {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.subWrap .location .infoBox > *:nth-child(1) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

.subWrap .location .infoBox > *:nth-child(2) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

.subWrap .location .infoBox > *:nth-child(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.subWrap .location .infoBox .item {
  gap: 0 20px;
}

.subWrap .location .infoBox dl {
  -webkit-transform: translateY(0.2em);
          transform: translateY(0.2em);
}

.subWrap .location .infoBox dl dt {
  color: var(--color-main);
  font-size: 2.4rem;
  font-weight: 700;
  margin: 0 0 20px;
}

.subWrap .location .infoBox dl dd {
  color: var(--color-white);
  font-size: 2.0rem;
  font-family: var(--font-pretendard);
}

.subWrap .location .infoBox .column {
  gap: 20px 0;
}

.subWrap .location .infoBox .column dl {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .location .infoBox .column dl dt {
  width: 85px;
  margin: 0;
}

.subWrap .location .infoBox .column dl dd {
  font-family: var(--font-montserrat);
}

.subWrap .press .slideWrap {
  position: relative;
}

.subWrap .press .slideWrap::after {
  content: "";
  display: block;
  width: 14%;
  height: 100%;
  background: #050A15;
  position: absolute;
  top: 0;
  right: -14%;
  z-index: 1;
  -webkit-filter: opacity(0.8);
          filter: opacity(0.8);
}

.subWrap .press .slideWrap .item .date {
  display: block;
  color: var(--color-white);
  font-size: 3.0rem;
  font-weight: 700;
  font-family: var(--font-roboto);
  position: relative;
}

.subWrap .press .slideWrap .item .date::before, .subWrap .press .slideWrap .item .date::after {
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: -10px;
}

.subWrap .press .slideWrap .item .date::before {
  width: 100%;
  background: rgba(255, 255, 255, 0.2);
}

.subWrap .press .slideWrap .item .date::after {
  width: 0;
  background: #007BC4;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.subWrap .press .slideWrap .item .date em {
  color: #555555;
  font-family: var(--font-roboto);
}

.subWrap .press .slideWrap .item dl {
  margin: 55px 0 25px;
}

.subWrap .press .slideWrap .item dl dt {
  color: var(--color-main);
  font-weight: 600;
  margin: 0 0 20px;
}

.subWrap .press .slideWrap .item dl dd {
  height: 3.4em;
  color: var(--color-white);
  font-size: 2.0rem;
  font-family: var(--font-pretendard);
  line-height: 1.7;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-wrap: break-word;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.subWrap .press .slideWrap .item .img {
  padding: 27.78% 0;
  position: relative;
  overflow: hidden;
}

.subWrap .press .slideWrap .item .img img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .press .slideWrap .item:hover .date::after {
  width: 100%;
}

.subWrap .press .slideButtons {
  width: calc(100% + 120px);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .culture .topText {
  text-align: center;
}

.subWrap .culture .topText h3 {
  line-height: 1.4;
  margin: 0 0 60px;
}

.subWrap .culture .topText h3 b {
  font-weight: 600;
}

.subWrap .culture .topText p {
  font-size: 2.0rem;
  font-weight: 300;
  line-height: 1.8;
}

.subWrap .culture .contents h6 {
  color: var(--color-main);
  font-weight: 600;
  text-align: center;
}

.subWrap .culture .contents .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 75px;
  margin: 80px 0 0;
}

.subWrap .culture .contents .item {
  width: calc((100% - 150px) / 3);
  height: 500px;
  background: linear-gradient(189deg, #146EB8 -18.68%, rgba(20, 110, 184, 0.16) 99.14%);
  border-radius: 20px;
  position: relative;
}

.subWrap .culture .contents .title,
.subWrap .culture .contents .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 60px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}

.subWrap .culture .contents .title {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  height: 100%;
}

.subWrap .culture .contents .icon {
  margin: 0 0 0 auto;
}

.subWrap .culture .contents dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  gap: 0 15px;
  margin: auto 0 0;
}

.subWrap .culture .contents dl dt {
  font-weight: 700;
}

.subWrap .culture .contents dl dd {
  gap: 0 10px;
  font-size: 1.8rem;
  font-weight: 600;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .culture .contents dl dd::before {
  content: "/";
}

.subWrap .culture .contents .text {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 40px 0;
  position: absolute;
  top: calc(50% + 100px);
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .culture .contents .text p {
  font-size: 2.2rem;
  line-height: 1.6;
}

.subWrap .culture .contents .item:hover .title {
  opacity: 0;
}

.subWrap .culture .contents .item:hover .text {
  opacity: 1;
  top: 50%;
}

.subWrap .recruit .process .itemBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .recruit .process .item {
  width: 100%;
  height: 300px;
  background: var(--gradient-light1);
  border-radius: 30px;
  padding: 55px 20px 50px;
}

.subWrap .recruit .process .item.pass {
  background: var(--gradient-purple);
}

.subWrap .recruit .process .icon {
  height: 82px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .recruit .process .icon img {
  width: auto;
  max-height: 100%;
}

.subWrap .recruit .process .text {
  text-align: center;
  margin: 50px 0 0;
}

.subWrap .recruit .process .text em {
  font-size: 1.4rem;
  font-weight: 500;
}

.subWrap .recruit .process .text p {
  font-size: 3.0rem;
  font-weight: 600;
  font-family: var(--font-pretendard);
  margin: 15px 0 0;
}

.subWrap .recruit .process .arrow {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.subWrap .recruit .process .arrow span {
  display: block;
  width: 75px;
  height: 1px;
  border-top: 1px dashed var(--color-main);
}

.subWrap .recruit .process .arrow figure {
  width: 35px;
  height: 35px;
  background: #050A15;
  border: 2px solid var(--color-main);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.subWrap .recruit .process > p {
  font-weight: 300;
  text-align: right;
  opacity: 0.7;
  margin: 30px 0 0;
}

.subWrap .recruit .join,
.subWrap .recruit .join a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.subWrap .recruit .join {
  gap: 0 160px;
  margin: 50px 0 0;
}

.subWrap .recruit .join .flexBox {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 40px;
}

.subWrap .recruit .join dl dt {
  color: var(--color-main);
  font-size: 2.6rem;
  font-weight: 600;
  margin: 0 0 20px;
}

.subWrap .recruit .join dl dd {
  font-size: 2.0rem;
  font-weight: 300;
  font-family: var(--font-pretendard);
}

.subWrap .recruit .join a {
  width: 360px;
  height: 90px;
  gap: 0 20px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 20px;
}

.subWrap .recruit .join a span {
  font-size: 2.2rem;
  font-weight: 500;
}

.subWrap .recruit .join a i {
  font-size: 3.0rem;
}
