.sub-page .cont-sec {
  padding-top: 0 !important;
}

.headline {
  color: var(--Color-Gray-Black);
  letter-spacing: -1.28rem;
}

.sub-page .cont-sec:not(:first-child) {
  margin-top: 160rem;
}

.bdr {
  border-right: 1px solid var(--Color-Gray-200)
}

.thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

img {
  max-width: 100%;
}

.form-table thead th {
  color: var(--Color-Gray-900);
}

@media all and (max-width:1400px) {
  .inner-1220 {
    padding: 0 16rem;
  }
}

/* 비주얼  */
.visual-sec {
  position: relative;
  height: 100dvh;
  min-height: 40vw;
}

.visual-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.visual-sec .visual-bg-box {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}

.visual-sec .visual-bg-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visual-tit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24rem;
  max-width: 680rem;
  padding-inline: 16rem;
  text-align: center;
  color: var(--Color-Gray-White);
}

.visual-tit.type-txt {
  align-items: flex-start;
  width: 100%;
  max-width: 1220rem;
  text-align: left;
}

.visual-nav {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.visual-nav button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24rem;
}

.visual-nav button span {
  position: absolute;
  top: 50%;
  right: -56rem;
  display: block;
  width: 32rem;
  height: 32rem;
  background: url(/common/kr/images/icon-accor-arrow-wht.svg)no-repeat center / contain;
  transition: .3s;
  transform: translate(0, -50%) rotate(0);
}

.visual-nav button.on span {
  background: url(/common/kr/images/icon-accor-arrow-wht.svg)no-repeat center / contain;
  transform: translate(0, -50%) rotate(180deg);
}

.visual-nav ul {
  position: absolute;
  top: calc(100% + 8rem);
  left: 50%;
  display: none;
  width: 100%;
  max-width: 260rem;
  padding: 12rem;
  border-radius: var(--border-radius-md);
  background: var(--Color-Gray-White);
  transform: translateX(-50%);
}

.visual-nav ul li {}

.visual-nav ul li a.nav-link {
  text-align: left;
  display: block;
  padding: 12rem 20rem;
  border-radius: var(--border-radius-xs);
  color: var(--Color-Gray-500);
  transition: .3s;
}

.visual-nav ul li.active a.nav-link,
.visual-nav ul li:hover a.nav-link {
  color: var(--Color-Gray-white);
  background: var(--Color-Blue-Primary);
}


/* common */
#wrap:has(.half-wrap .left-div.sticky) {
  overflow: unset;
}

.half-wrap {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 173rem;
}



.half-wrap .right-div {
  width: 600rem;
  margin-left: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20rem;
}

.half-wrap .right-div>div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24rem;
}

.half-wrap .center-div {
  width: 910rem;
  margin: 0 auto;
}

.half-wrap .left-div.sticky {
  position: sticky;
  opacity: 1;
  top: 160rem;
  transition: top .3s ease;
}

.half-wrap .left-div.sticky .tit {
  position: relative;
  opacity: 0;
  top: 80rem;
  transition: top 1s ease, opacity 1s ease;
}

.half-wrap.active .left-div.sticky .tit {
  top: 0;
  opacity: 1;
}

#wrap:has(#header.hide) .half-wrap .left-div.sticky {
  top: 60rem;
}

@media all and (max-width: 1024px) {
  #wrap:has(.half-wrap .left-div.sticky) {
    overflow: hidden;
  }

  .half-wrap {
    flex-direction: column;
    gap: 20rem;
  }

  .half-wrap .right-div {
    width: 100%;
  }

  .half-wrap .center-div {
    width: 100%;
  }

  .half-wrap .left-div.sticky {
    position: unset;
  }

  #contents:has(.ceo-list) .half-wrap {
    gap: 40rem;
  }
}

/* --------------------회사소개-------------------- */


.overview.half-layout .title,
.brochure.half-layout .title {
  width: 100%;
  max-width: 365rem;
}

/* [개요] */

.overview .info-con-box {
  display: flex;
  flex-direction: column;
  gap: 60rem;
  width: 100%;
}

.overview .info-con-box .sub-txt {
  color: var(--Color-Gray-800);
}


.overview-list ul {
  border-top: 1px solid var(--Color-Gray-200);
}

.overview-list li {
  display: flex;
  align-items: center;
  gap: 20rem;
  padding-block: 32rem;
  border-bottom: 1px solid var(--Color-Gray-200);
}

.overview-list p.label {
  width: 80px;

}

.overview-list p:not(.label) {
  color: var(--Color-Gray-700);
}

.overview .sns-box {
  display: flex;
  align-items: center;
  gap: 20rem;
  width: 100%;
}

.overview .sns-box a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 56rem;
  height: 56rem;
  padding: 16rem;
  border-radius: 100rem;
  background: var(--Color-Blue-Primary);
  color: var(--Color-Gray-White);
  transition: all 0.3s ease;
  overflow: hidden;
  padding-right: 24rem;
}

.overview .sns-box a span {
  white-space: nowrap;
  opacity: 1;
  transform: translateX(0);
  margin-left: 8rem;
  max-width: 200rem;
}

/* .overview .sns-box a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 56rem;
  height: 56rem;
  padding: 16rem;
  border-radius: 100rem;
  background: var(--Color-Blue-Primary);
  color: var(--Color-Gray-White);
  transition: all 0.3s ease;
  overflow: hidden;
  
}

.overview .sns-box a span {
  white-space: nowrap;
  opacity: 0;
  transform: translateX(10px);
  max-width: 0;
  transition: all 0.3s ease;
}

.overview .sns-box a:hover {
  padding-right: 24rem;
}

.overview .sns-box a:hover span {
  opacity: 1;
  transform: translateX(0);
  margin-left: 8rem;
  max-width: 200rem;
} */

/* 브로슈어 */
.brochure .info-con-box {
  display: flex;
  flex-direction: column;
  gap: 20rem;
  width: 100%;
}



.brochure-box {
  position: relative;
  width: 100%;
  height: 580rem;
  background: var(--Color-Gray-50);
}

.brochure-box .img-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.brochure-box .img-box img {
  box-shadow: 0 4px 8px 3px rgba(0, 0, 0, 0.15), 0 1px 3px 0 rgba(0, 0, 0, 0.30);
}




@media (width <=1024px) {
  .overview .sns-box {
    flex-wrap: wrap;
    gap: 10rem;
  }

  .overview .info-con-box,
  .brochure .info-con-box {
    margin-top: 24rem;
  }

  /* .overview .sns-box a:hover {
    padding-right: 16rem;
  }

  .overview .sns-box a span,
  .overview .sns-box a:hover span {
    display: none;
  } */


  .overview-list li {
    flex-direction: column;
    align-items: flex-start;
    gap: 10rem;
    padding-block: 24rem;
  }

  .cont-box-info {
    gap: 120rem;
  }

  .brochure-box {
    height: 252rem;
  }
}


/* [ 기업개요 > 가치체계 ] */
.vision-area {
  position: relative;
}

.vision-area .vision {
  overflow: hidden;
  position: relative;
  left: 0;
  padding: 80rem;
  width: 1220rem;
  height: 720rem;
  border-radius: var(--border-radius-lg);
  cursor: pointer;
  transition: left 0.8s ease;
}

.vision-area .vision:nth-child(2) {
  position: absolute;
  top: 0;
  left: 510rem;
}

.vision-area .vision:nth-child(3) {
  position: absolute;
  top: 0;
  left: 1030rem;
}

.vision-area .vision .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.vision-area .vision .bg img {
  transform: scale(1);
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: var(--transition-default);
}

.vision-area .vision:hover .bg img {
  transform: scale(1.1);
}

.vision-area .vision .txt-wrap {
  position: relative;
  color: var(--Color-Gray-White);
  z-index: 1;
}

.vision-area .vision .txt-wrap .f-t1 {
  transform: scale(0.82);
  transition: var(--transition-default);
  transform-origin: left;
}

.vision-area .vision .txt-wrap .f-b2-r {
  margin-top: 32rem;
  opacity: 0;
  transition: var(--transition-default)
}

.vision-area .vision.on .txt-wrap .f-t1 {
  transform: scale(1)
}

.vision-area .vision.on .txt-wrap .f-b2-r {
  opacity: 1;
}

.vision-area:has(.vision.active:nth-child(1)) .vision:nth-child(2) {
  left: 1240rem
}

.vision-area:has(.vision.active:nth-child(1)) .vision:nth-child(3) {
  left: 2480rem
}

.vision-area .vision.active:nth-child(2) {
  left: 0
}

.vision-area:has(.vision.active:nth-child(2)) .vision:nth-child(1) {
  left: -1240rem
}

.vision-area:has(.vision.active:nth-child(2)) .vision:nth-child(3) {
  left: 1240rem
}

.vision-area .vision.active:nth-child(3) {
  left: calc((100vw - 1260rem) / 2)
}

.vision-area:has(.vision.active:nth-child(3)) .vision:nth-child(1) {
  left: -2140rem
}

.vision-area:has(.vision.active:nth-child(3)) .vision:nth-child(2) {
  left: calc((100vw - 3740rem) / 2)
}

.vision-area .vision.active .txt-wrap .f-t1 {
  transform: scale(1)
}

.vision-area .vision.active .txt-wrap .f-b2-r {
  opacity: 1;
  transition-delay: 0.15s;
}

.core-value-area {
  display: flex;
  gap: 20rem;
  flex-wrap: wrap;
}

.core-value-area .core-value-wrap {
  display: flex;
  flex-direction: column;
  gap: 36rem 0;
  align-items: center;
  position: relative;
  width: calc((100% - 20rem) / 2);
  min-height: 509rem;
  padding: 64rem;
  text-align: center;
  background: var(--Color-Gray-White);
  border-radius: var(--border-radius-lg);
}

.core-value-area .core-value-wrap .f-b3-r {
  margin-top: 16rem;
  color: var(--Color-Gray-800);
}

@media all and (max-width: 1024px) {
  .vision-area .vision {
    margin-top: 60rem;
    padding: 0;
    width: 100%;
    height: auto;
    border-radius: 0;
    cursor: unset;
  }

  .vision-area .vision:first-child {
    margin-top: 0;
  }

  .vision-area .vision:nth-child(1),
  .vision-area .vision:nth-child(2),
  .vision-area .vision:nth-child(3) {
    position: relative;
    left: 0 !important;
  }

  .vision-area .vision .bg {
    overflow: hidden;
    position: relative;
    height: 194rem;
    border-radius: var(--border-radius-md);
  }

  .vision-area .vision .txt-wrap {
    margin-top: 40rem;
  }

  .vision-area .vision .txt-wrap .f-t1 {
    transform: scale(1);
    color: var(--Color-Gray-900)
  }

  .vision-area .vision .txt-wrap .f-b2-r {
    margin-top: 20rem;
    color: var(--Color-Gray-800);
    opacity: 1;
  }

  .core-value-area .core-value-wrap {
    gap: 24rem 0;
    padding: 32rem 20rem;
    min-height: 0;
  }

  .core-value-area .core-value-wrap .icon img {
    width: 160rem;
    height: 160rem;
  }
}

@media all and (max-width: 600px) {
  .core-value-area .core-value-wrap {
    width: 100%;
  }
}

/* [ 기업개요 > CI ] */
.ci-area .img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 560rem;
  background: var(--Color-Blue-Light);
  border-radius: var(--border-radius-lg);
}

.ci-area .img-wrap img {
  width: 640rem;
}

.ci-area .txt-wrap {
  margin-top: 64rem;
  text-align: center;
}

.ci-area .txt-wrap .btn-wrap {
  margin-top: 40rem;
}

.color-system-area {
  overflow: hidden;
  display: flex;
  border-radius: var(--border-radius-lg);
}

.color-system-area .color-system-item {
  padding: 24rem;
  width: 20%;
  height: 480rem;
  color: var(--Color-Gray-White);
  background: var(--Color-Gray-White);
}

.color-system-area .color-system-item.eco {
  background: url("/common/kr/images/bg-hd-eco-green.jpg") no-repeat bottom center / 100% auto #00E600;
}

.color-system-area .color-system-item.heritage {
  background: url("/common/kr/images/bg-hd-heritage-green.jpg") no-repeat bottom center / 100% auto #00AD1D;
}

.color-system-area .color-system-item.prosperity {
  background: url("/common/kr/images/bg-hd-prosperity-green.jpg") no-repeat bottom center / 100% auto #008233;
}

.color-system-area .color-system-item.discovery {
  background: url("/common/kr/images/bg-hd-discovery-blue.jpg") no-repeat bottom center / 100% auto #003087;
}

.color-system-area .color-system-item.trust {
  background: url("/common/kr/images/bg-hd-trust-blue.jpg") no-repeat bottom center / 100% auto #002554;
}

.color-system-area .color-system-item .f-d1-r {
  margin-top: 114rem;
}

.cont-sec:has(.margin-rule-area) {
  display: flex;
  justify-content: space-between;
}

.margin-rule-area .margin-rule-item {
  padding: 48rem 65rem 64rem 48rem;
  margin-top: 40rem;
  width: 755rem;
  border: 1px solid var(--Color-Gray-300);
  border-radius: var(--border-radius-md);
}

.margin-rule-area .margin-rule-item:first-child {
  margin-top: 0;
}

.margin-rule-area .margin-rule-item .f-h2 {
  margin-bottom: 40rem;
}

.margin-rule-area .margin-rule-item img {
  padding-left: 15rem;
  width: 630rem;
}

.ci-info-area .ci-info-wrap {
  display: flex;
  gap: 12rem;
}

.ci-info-area .ci-info-wrap .ci-info {
  position: relative;
  padding: 30rem;
  width: calc((100% - 24rem) / 3);
  background: var(--Color-Gray-White);
  border-radius: var(--border-radius-md);
  border: 1px solid var(--Color-Gray-300);
}

.ci-info-area .ci-info-wrap .ci-info .num {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 30rem;
  right: 30rem;
  width: 32rem;
  height: 32rem;
  color: var(--Color-Gray-White);
  background: var(--Color-Green-Primary);
  border-radius: 50%;
}

.ci-info-area .ci-info-wrap .ci-info .f-h2 {
  color: var(--Color-Blue-Primary);
}

.ci-info-area .ci-info-wrap .ci-info .f-b4-r {
  margin-top: 20rem;
  color: var(--Color-Gray-800);
}

.ci-info-area .img {
  display: flex;
  justify-content: center;
  margin-top: 140rem;
}

.ci-info-area .img img {
  width: 941rem;
}

.font-download-area {
  text-align: center;
}

.font-download-area .f-t2 {
  color: var(--Color-Blue-Primary);
}

.font-download-area .f-b3-r {
  margin-top: 24rem;
  color: var(--Color-Gray-800);
}

.font-download-area .btn-wrap {
  margin-top: 60rem;
}

@media all and (max-width: 1024px) {
  .ci-area .img-wrap {
    height: 320rem;
  }

  .ci-area .img-wrap img {
    width: 260rem;
  }

  .ci-area .txt-wrap {
    margin-top: 24rem;
  }

  .ci-area .txt-wrap .btn-wrap {
    flex-wrap: wrap;
    margin-top: 20rem;
  }

  .color-system-area {
    flex-direction: column;
    gap: 20rem;
    border-radius: 0;
  }

  .color-system-area .color-system-item {
    width: 100%;
    height: 167rem;
    border-radius: var(--border-radius-lg);
  }

  .color-system-area .color-system-item.eco {
    background: url("/common/kr/images/bg-hd-eco-green-mo.jpg") no-repeat right center / auto 100% #00E600;
  }

  .color-system-area .color-system-item.heritage {
    background: url("/common/kr/images/bg-hd-heritage-green-mo.jpg") no-repeat right center / auto 100% #00AD1D;
  }

  .color-system-area .color-system-item.prosperity {
    background: url("/common/kr/images/bg-hd-prosperity-green-mo.jpg") no-repeat right center / auto 100% #008233;
  }

  .color-system-area .color-system-item.discovery {
    background: url("/common/kr/images/bg-hd-discovery-blue-mo.jpg") no-repeat right center / auto 100% #003087;
  }

  .color-system-area .color-system-item.trust {
    background: url("/common/kr/images/bg-hd-trust-blue-mo.jpg") no-repeat right center / auto 100% #002554;
  }

  .color-system-area .color-system-item .f-d1-r {
    margin-top: 8rem;
  }

  .cont-sec:has(.margin-rule-area) {
    flex-direction: column;
  }

  .margin-rule-area {
    margin-top: 20rem;
  }

  .margin-rule-area .margin-rule-item {
    padding: 24rem 15rem;
    margin-top: 20rem;
    width: 100%;
  }

  .margin-rule-area .margin-rule-item .f-h2 {
    margin-bottom: 24rem;
  }

  .margin-rule-area .margin-rule-item img {
    padding-left: 0;
    max-width: 100%;
  }

  .ci-info-area .ci-info-wrap {
    flex-wrap: wrap;
  }

  .ci-info-area .ci-info-wrap .ci-info {
    width: 100%;
  }

  .ci-info-area .ci-info-wrap .ci-info .f-h2 {
    margin-bottom: 6rem;
  }

  .ci-info-area .ci-info-wrap .ci-info .f-b4-r {
    margin-top: 16rem;
  }

  .ci-info-area .img {
    display: flex;
    justify-content: center;
    margin-top: 120rem;
  }

  .ci-info-area .img img {
    max-width: 100%;
    width: auto;
  }

  .font-download-area .btn-wrap {
    flex-wrap: wrap;
    margin-top: 40rem;
  }
}


/* [ 인사말 ] */
.left-div.ceo-img {
  width: 455rem;
}

.left-div .ceo-info {
  margin-top: 40rem;
}

@media (width <=1024px) {

  .left-div.ceo-img {
    width: 100%;
  }


}

/* [ 헤리티지 ] */
.history-con-wrap .history-con .img-wrap:has(.visual-wrap)::after,
.history-con-wrap .history-con .img-wrap:has(.visual-wrap) .img-con .history-img::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.history-con-wrap {
  position: unset !important;
  opacity: 1 !important;
}

.history-area {
  position: relative;
}

.history-con .img-wrap {
  position: relative;
  height: 300vh;
}

.history-con .img-wrap:has(.visual-wrap) {
  height: 550vh;
}

.history-con .img-wrap .img-con {
  display: flex;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  /* width: 100vw; */
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.history-con .img-wrap .img-con .history-top-text {
  position: absolute;
  top: 200rem;
  left: 195rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  width: 600rem;
  opacity: 0;
  text-align: center;
}

.history-con .img-wrap .img-con .history-top-text p:first-child {
  color: var(--Color-Blue-Primary);
}

.history-con .img-wrap .img-con .history-img {
  position: absolute;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.history-con .img-wrap .img-con .history-img:has(.visual-wrap) {
  top: 0;
  width: 100%;
  height: 100%;
}

.history-con .img-wrap .img-con .history-img :is(.history-wrap, .visual-wrap) {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.history-con .img-wrap .img-con .history-img:has(.visual-wrap) .history-wrap {
  opacity: 0;
  visibility: hidden;
}

.history-con .img-wrap .img-con .history-img .visual-wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.history-con .img-wrap .img-con .history-img .img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.history-con .img-wrap .img-con .history-img .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.history-con .img-wrap .img-con .history-img .img-dimd {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, .5);
}

.history-con .img-wrap .img-con .history-img .txt-div {
  width: 1220rem;
}



.history-con .img-wrap .img-con .history-img .history-wrap .img img.history-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
}


.history-con .img-wrap .img-con .history-img .history-wrap .txt-div {
  position: relative;
  text-align: center;
  color: #fff;
}

.history-con .img-wrap .img-con .history-img .history-wrap .txt-div .year {
  overflow: hidden;
  transition: font 1s ease, top 1s ease;
}

.history-con .img-wrap .img-con .history-img .history-wrap .txt-div:not(.active) .year {
  font-size: 160rem;
}



.history-con .img-wrap .img-con .history-img .history-wrap .txt-div .f-t1:not(.year) {
  margin-top: 142rem;
}

.history-con .img-wrap .img-con .history-img .history-wrap .txt-div .f-b3-r {
  margin-top: 40rem;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .img-dimd {
  opacity: 0;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .img-dimd.active {
  opacity: 1;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div {
  position: relative;
  color: #fff;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .f-h2 {
  position: relative;
  top: 80rem;
  opacity: 0;
  transition: top 1s ease, opacity 1s ease;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .f-d3 {
  position: relative;
  top: 80rem;
  margin-top: 64rem;
  opacity: 0;
  transition: top 1s ease, opacity 1s ease;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .f-b3-r {
  position: relative;
  top: 80rem;
  margin-top: 40rem;
  opacity: 0;
  transition: top 1s ease, opacity 1s ease;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .btns {
  position: relative;
  top: 80rem;
  margin-top: 40rem;
  opacity: 0;
  transition: top 1s ease, opacity 1s ease;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div.active .f-h2 {
  top: 0;
  opacity: 1;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div.active .f-d3 {
  top: 0;
  opacity: 1;
  transition-delay: 0.15s;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div.active .f-b3-r {
  top: 0;
  opacity: 1;
  transition-delay: 0.3s;
}

.history-con .img-wrap .img-con .history-img .visual-wrap .txt-div.active .btns {
  top: 0;
  opacity: 1;
  transition-delay: 0.45s;
}

/* motion */
.history-con .img-wrap .img-con .history-img .txt-div {
  position: relative;
}

.history-con .img-wrap .img-con .history-img .txt-div .year {
  position: absolute;
  top: calc(50% - 120rem);
  width: 100%;
  text-align: center;
  line-height: 150%;
}

.history-con .img-wrap .img-con .history-img .txt-div .year span {
  transform: translateY(100%);
  transition: transform 1s ease;
}

.history-con .img-wrap .img-con .history-img .txt-div .year.on span {
  transform: translateY(0);
}

.history-con .img-wrap .img-con .history-img .txt-div .f-t1:not(.year),
.history-con .img-wrap .img-con .history-img .txt-div .f-b3-r {
  position: relative;
  top: 80rem;
  opacity: 0;
  transition: top 1s ease, opacity 1s ease;
}

.history-con .img-wrap .img-con .history-img .txt-div .f-t1:not(.year) {
  transition-delay: 0s;
}

.history-con .img-wrap .img-con .history-img .txt-div .f-b3-r {
  transition-delay: 0s;
}

.history-con .img-wrap .img-con .history-img .txt-div.active .year {
  top: 0;
}

.history-con .img-wrap .img-con .history-img .txt-div.active .year span {
  transform: translateY(0);
}

.history-con .img-wrap .img-con .history-img .txt-div.active .f-t1:not(.year),
.history-con .img-wrap .img-con .history-img .txt-div.active .f-b3-r {
  top: 0;
  opacity: 1;
}

.history-con .img-wrap .img-con .history-img .txt-div.active .f-t1:not(.year) {
  transition-delay: .3s;
}

.history-con .img-wrap .img-con .history-img .txt-div.active .f-b3-r {
  transition-delay: .45s;
}

.history-con .con-wrap {
  display: flex;
  justify-content: space-between;
  width: 600rem;
  margin-left: auto;
  margin-right: 195rem;
}

.history-con .con-wrap :is(.year) {
  font-family: "Pretendard-Bold";
  font-size: 44rem;
  color: var(--Color-Gray-900);
  line-height: 140%;
}



.history-con .con-wrap .history-list {
  flex: 1;
}

.history-con .con-wrap .history-list .list-wrap {
  margin-bottom: 120rem;
}

.history-con .con-wrap .history-list .list-wrap .list-divs {
  display: flex;
  flex-direction: column;
  gap: 32rem;
  margin-top: 80rem;
}

.history-con .con-wrap .history-list .list-wrap .list-divs .list-div {
  display: flex;
  gap: 24rem;
}

.history-btn-wrap.on {
  bottom: -1px !important;
}

.history-btn-wrap {
  position: fixed;
  bottom: -80rem;
  left: 0;
  right: 0;
  width: 100%;
  height: 80rem;
  background: rgba(0, 0, 0, .4);
  backdrop-filter: blur(20px);
  z-index: 5;
  border-top: 1px solid rgba(255, 255, 255, .2);
  transition: bottom 0.8s ease;
}

.history-btn-wrap .swiper-container {
  padding: 0 60rem;
  height: 100%;
}

.history-btn-wrap .swiper-container .swiper-wrapper {}

.history-btn-wrap .swiper-container .swiper-slide {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 0 16rem;
  width: auto;
  height: 100%;
}

.history-btn-wrap .swiper-container .swiper-slide:first-child {
  margin-left: 0;
}

.history-btn-wrap .swiper-container .swiper-slide:last-child {
  margin-right: 0;
}

.history-btn-wrap .swiper-container .swiper-slide span {
  color: var(--Color-Gray-White)
}

.history-btn-wrap .swiper-container .swiper-slide.on:before {
  display: block;
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: var(--Color-Green-Eco)
}

.history-btn-wrap .swiper-container .swiper-slide.on span {
  color: var(--Color-Green-Eco)
}

.history-con .con-wrap .history-list .list-wrap .list-divs.100vh {
  min-height: calc(100vh - 260rem - 80rem - 160rem);
}

.con-wrap {
  position: relative;
}

.scroll-progress {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 1px;
  height: 100%;
  border-radius: 999rem;
  background: var(--Color-Gray-100);
  /* overflow: hidden; */
  display: none;
  z-index: 4;
}

.scroll-progressbar {
  position: relative;
  width: 100%;
  height: 0;
  background: var(--Color-Blue-Primary);
  transition: 0.4s ease-out;
}

.scroll-marker {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);


}

.scroll-marker span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 9px;
  height: 9px;
  border-radius: 100px;
  border: 2px solid var(--Color-Blue-Primary);
  background: var(--Color-Gray-White);
  z-index: 4;
}

.scroll-marker::after,
.scroll-marker::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 100px;
  z-index: 3;
}

.scroll-marker::after {
  width: 23rem;
  height: 23rem;
  background: rgba(0, 48, 135, .2);
}


.scroll-marker::before {
  width: 15rem;
  height: 15rem;
  background: rgba(0, 48, 135, .5);
}


.year-list-mo-top {
  opacity: 0;
  visibility: hidden;
  transition: .5s;
}

@media (width <=1024px) {

  .scroll-progress {
    position: absolute;
    left: 11.5rem;
    transform: translateX(0);
  }


  .year-list-mo-top {
    opacity: 1;
    visibility: visible;
    display: grid;
    gap: 40rem;

    margin-bottom: 40rem;
  }

  .year-list-mo-top .img {
    border-radius: var(--border-radius-md);
    overflow: hidden;
  }

  .year-list-mo-top .txt-div {
    display: grid;
    gap: 8rem;
  }

  .year-list-mo-top .txt-div .f-t1.year {
    color: var(--Color-Blue-Primary);
    font-size: 32rem;
  }

  .year-list-mo-top .txt-div .f-t1 {
    color: var(--Color-Gray-900);
    font-size: 20rem;

  }

  .history-con .con-wrap :is(.year) {
    font-size: 24rem;
  }

  .history-con .con-wrap .list-divs .f-h2,
  .history-con .con-wrap .list-divs .f-b3-r {
    font-size: 16rem;
  }

  .history-con .con-wrap .history-list .list-wrap .list-divs .list-div {
    gap: 19rem;
  }
}



@media all and (max-width: 1024px) {
  .history-con .img-wrap {
    height: 100vh;
  }

  .history-con .img-wrap:has(.visual-wrap) {
    height: 400vh;
  }

  .history-con .img-wrap .img-con:not(:has(.visual-wrap)) {
    position: unset;
  }

  .history-con .img-wrap .img-con .history-img:not(:has(.visual-wrap)) {
    top: 0;
    position: unset;
  }

  .history-con .img-wrap .img-con .history-img .txt-div {
    width: calc(100% - 32rem);
  }

  .history-con .img-wrap .img-con .history-img .history-wrap .txt-div:not(.active) .year {
    font-size: 44rem;
  }

  .history-con .img-wrap .img-con .history-img .history-wrap .txt-div .f-t1:not(.year) {
    margin-top: 60rem;
  }

  .history-con .img-wrap .img-con .history-img .history-wrap .txt-div .f-b3-r {
    margin-top: 20rem;
  }

  .history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .f-d3 {
    margin-top: 32rem;
  }

  .history-con .img-wrap .img-con .history-img .visual-wrap .txt-div .f-b3-r {
    margin-top: 24rem;
  }

  .history-con .con-wrap {
    display: block;
    width: calc(100% - 32rem);
    margin: 0 auto !important;
    overflow: hidden;
  }

  .history-con .con-wrap .history-list {
    padding-top: 120rem;
    padding-left: 48rem;
  }

  .history-con .con-wrap .history-list .list-wrap {
    padding-bottom: 40rem;
    margin: unset;
  }

  .history-con .con-wrap .history-list .list-wrap .year span {
    display: inline-block;
  }

  .history-con .con-wrap .history-list .list-wrap .list-divs {
    gap: 16rem;
    margin-top: 20rem;
  }

  .history-con .img-wrap .img-con .history-img .txt-div .year {
    top: 0;
    line-height: 140%;
  }

  .history-con .img-wrap .img-con .history-img .txt-div .f-t1:not(.year),
  .history-con .img-wrap .img-con .history-img .txt-div .f-b3-r {
    top: 40rem;
  }

  .history-con .con-wrap .history-list .list-wrap .list-divs.100vh {
    min-height: unset;
  }

  .history-btn-wrap .swiper-container {
    padding: 0 16rem;
  }

  .history-btn-wrap .swiper-container .swiper-slide {
    margin: 0 8rem;
  }

  .scroll-motion2 {
    position: relative;
    opacity: 0;
    top: 40rem;
    transition: top 1s ease, opacity 1s ease;
  }

  .scroll-motion2.active {
    opacity: 1;
    top: 0;
  }
}



/* --------------------에프터 마켓-------------------- */


.card-info {
  margin-bottom: 120rem;
}


.card-info .af-market-card-slide.type02 ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16rem;
}

.card-info .af-market-card-slide ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16rem;
}


.card-info .af-market-card-slide ul li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 530rem;
  padding: 48rem;
  border-radius: 16rem;
  /* background: #1171B2; */
  color: var(--Color-Gray-White);
  box-sizing: border-box;
}


.card-info ul li:nth-child(1) {
  height: calc(530rem - 90rem);
}

.card-info ul li:nth-child(3) {
  height: calc(530rem - 140rem);
}

.card-info .af-market-card-slide.slide-on ul {
  display: flex;
  gap: 0;
}

.card-info .af-market-card-slide.slide-on ul li:nth-child(1),
.card-info .af-market-card-slide.slide-on ul li:nth-child(3),
.card-info .af-market-card-slide.slide-on ul li {
  height: 420rem;
}

.card-info .af-market-card-slide.slide-on .swiper-control {
  margin-top: 40rem;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--Color-Blue-Primary);
}

.af-market-card-slide li {
  position: relative;
}

.af-market-card-slide .img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  border-radius: 16rem;
  overflow: hidden;
}

.af-market-card-slide .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;

}


.content-af-market {
  margin-bottom: 120rem;
}

.af-market-tit {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.content-af-market>ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 120rem;
  margin-top: 120rem;
}

.content-af-market>ul>li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40rem;
  width: 100%;
}

.af-market-box {
  display: flex;
  align-items: flex-start;
  gap: 120rem;
  width: 100%;
}

.af-market-slide {
  width: 100%;
  max-width: 400rem;
  border-radius: var(--border-radius-md);
}

.af-market-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.af-market-control.show-mo {
  position: static;
  background: none;
  width: 100%;
  max-width: none;
  width: 100%;
  transform: none;
  padding: 0;
  border-radius: 0;
  height: auto;
  display: none;
}

.show-mo .swiper-pagination-progress {
  position: relative;
  width: 100%;
  height: 4px;
  background: rgba(0, 0, 0, 0.25);
  overflow: hidden;
}

.show-mo .swiper-pagination-progress span {
  display: block;
  width: 0%;
  height: 100%;
  background: var(--Color-Blue-Primary);
  transition: width 0.3s ease;
}

@media all and (max-width:1024px) {
  .content-af-market {
    margin-bottom: 80rem;
  }

  .content-af-market>.f-t2 {
    margin-bottom: 40rem;
  }

  .af-market-control.show-mo {
    display: block;
  }

}



.af-market-control {
  position: absolute;
  bottom: 24rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 80rem;
  height: 28rem;
  padding-inline: 12rem 8rem;
  gap: 4rem;
  border-radius: 999px;
  background: var(--dimed-dark-50, rgba(0, 0, 0, 0.50));
  box-sizing: border-box;
  z-index: 10;
}


.af-market-control .swiper-pagination {
  display: flex;
  align-items: center;
  gap: 2px;
  position: static;
  color: var(--Color-Gray-White);
  font-size: 12rem;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.24rem;
}

.af-market-control .swiper-pagination .swiper-pagination-current {
  opacity: 1;
}

.af-market-control .swiper-pagination .swiper-pagination-total {
  opacity: 0.6;
}





.af-market-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 56rem;
  padding-block: 56rem;
  border-top: 1px solid var(--Color-Gray-200);
  border-bottom: 1px solid var(--Color-Gray-200);
  box-sizing: border-box;
  width: 100%;
}

.af-market-info>p {
  color: var(--Color-Gray-800);
}

.af-market-info>div {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.af-market-tit .f-t1 {
  color: var(--Color-Gray-Black);
}

/* .af-market-info>div>p {
  color: var(--Color-Gray-800);
} */

.af-market-info .part-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8rem;
}

.af-market-info .part-list li {
  border-radius: var(--border-radius-xs);
  padding: 24rem;
  background: var(--Color-Blue-Light);
  text-align: center;

}

/* 스마트 케어 */
.sub-tit-area.smt-care {
  display: flex;
  flex-direction: column;
  padding: 240rem 0;
}

.sub-count-list.ltsa {
  background-image: url(/common/kr/images/img-smt-banner02.jpg);
}

.sub-count-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-image: url(/common/kr/images/img-smt-banner.jpg);
  color: var(--Color-Gray-White);
  padding: 111rem 120rem;
  background-repeat: no-repeat;
  border-radius: 24rem;
  overflow: hidden;
  background-size: cover;
}

.sub-shipping-top {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.sub-count-list>li>div {
  display: flex;
  flex-direction: column;
  gap: 24rem;
}

@media all and (max-width:1024px) {
  .sub-count-list {
    flex-direction: column;
    justify-content: center;
    background: url(/common/kr/images/img-smt-banner-mo.jpg) center;
    padding: 111rem 120rem;
    background-repeat: no-repeat;
    border-radius: 24rem;
    overflow: hidden;
    background-size: 100% 100%;
    background-size: cover;
  }

  .sub-count-list.ltsa {
    background: url(/common/kr/images/img-smt-banner02-mo.jpg) center;
    background-repeat: no-repeat;
    border-radius: 24rem;
    overflow: hidden;
    background-size: 100% 100%;
    background-size: cover;
  }

  .sub-count-list>li>div {
    align-items: center;
    text-align: center;
    gap: 16rem;
  }

  .sub-count-list {
    gap: 80rem;
    padding: 80rem;
  }

  .sub-tit-area.smt-care {
    padding: 200rem 0;
  }
}

/* LTSA */
.content-ltsa-info {
  margin: 120rem 0;
  overflow-x: auto;
}

.content-ltsa-info::-webkit-scrollbar {
  width: 6px;
  height: 4px;
  background-color: var(--Color-Gray-200);
}



.content-ltsa-info::-webkit-scrollbar-thumb {
  background-color: var(--Color-Blue-Primary);
}



.content-ltsa-info::-webkit-scrollbar-track {
  background-color: transparent;
}

.content-ltsa-info .img {
  min-width: 980rem;
}

.content-ltsa-info .img img {
  width: 100%;
}

.content-ltsa-info::-webkit-scrollbar-button {
  display: none !important;
}

.content-ltsa-prc .img {
  margin-top: 40rem;
}

.content-ltsa-prc .img img {
  width: 100%;
}

.content-ltsa-prc {
  margin-bottom: 120rem;
}

.smt-sol-info.type02 {
  padding-top: 40rem;
}

.square-border-btn.link.type02 span {
  padding-right: 24rem;
  background: url("/common/kr/images/icon-btn-link-black02.svg") no-repeat right center/20rem auto;
}


@media all and (max-width:1024px) {
  .content-ltsa-prc .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .content-ltsa-info {
    margin-top: 80rem;
    padding-bottom: 40rem;
  }

  .smt-sol-info.type02 {
    padding-top: 0rem;
  }

  .smt-sol-info.type02>div>p {
    padding-top: 40rem !important;
  }

  .smt-sol-info.type02>div {
    flex-direction: column;
  }

  .smt-sol-info .info-list {
    gap: 0 !important;
  }

  .etc-area {
    margin: 80rem 0 0rem !important;
  }

  .smt-sol-info.type02 .f-h1 {
    font-size: 18rem;
  }

}

.content-global-network {
  margin-bottom: 160rem;
}


.content-global-network .inner-1220 p {
  margin-bottom: 60rem;
}

.map {
  position: relative;
}

.map-dots {
  visibility: visible;
  opacity: 1;
}

.map-dots .dot {
  position: absolute;
  z-index: 50;
}

/* 2025.12.30 위치 수정 */
.map-dots .dot.a {
  left: 369rem;
  top: 550rem;
}

.map-dots .dot.b {
  left: 604rem;
  top: 546rem;
}

.map-dots .dot.c {
  left: 1448rem;
  top: 613rem;
}

.map-dots .dot.d {
  left: 1427rem;
  top: 665rem;
}

.map-dots .dot.e {
  left: 1556rem;
  top: 666rem;
}



.map-dots .dot {
  position: absolute;
  width: 12rem;
  height: 12rem;
  background: #005BFF;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  z-index: 50;
  animation: dotpulse 1.2s infinite ease-in-out;
}

.map-dots .dot::before {
  width: 35rem;
  height: 35rem;
  opacity: .2;
}

.map-dots .dot::after {
  width: 45rem;
  height: 45rem;
  opacity: .1;
}

/* before/after 생성 */
.map-dots .dot::before,
.map-dots .dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  background: var(--Color-Blue-Primary);
  transform: translate(-50%, -50%) scale(0.6);

  z-index: 5;
}

.map-dots .dot::after {
  animation-delay: 0.3s;
}

/* Keyframes */
@-webkit-keyframes dotpulse {
  0% {
    transform: translate(-50%, -50%) scale(0.6);
  }

  50% {
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    transform: translate(-50%, -50%) scale(0.6);
  }
}

@keyframes dotpulse {
  0% {
    transform: translate(-50%, -50%) scale(0.6);
  }

  50% {
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    transform: translate(-50%, -50%) scale(0.6);
  }
}



.modal-wrap {
  position: fixed;
  inset: 0;
  z-index: 20;
}

.modal-wrap .modal-cont .por {
  position: relative;
  padding: 60rem;
}

.modal-wrap .modal-cont {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--Color-Gray-White);
  border-radius: 12rem;
  z-index: 990 !important;
  max-width: 600rem;
  width: 100%;
}

.modal-wrap .modal-cont .btn-close {
  position: absolute;
  top: 30rem;
  right: 30rem;
}

.modal-wrap .modal-cont .f-h2 {
  margin-bottom: 30rem;
}

.modal-wrap .modal-cont span.f-b3-b {
  color: var(--Color-Blue-Primary);
}

.modal-wrap .modal-cont .desc {
  color: var(--Color-Gray-800);
  margin-top: 16rem;
}

.modal-wrap .modal-cont .desc span {
  margin-right: 8rem;
}

.map .need-scroll::-webkit-scrollbar {
  height: 2rem;
  background-color: transparent;
}

.map .need-scroll::-webkit-scrollbar-thumb {
  height: 2rem;
  background-color: #003087;
  border-radius: 0;
}

.map .need-scroll::-webkit-scrollbar-track {
  background-color: transparent;
  margin: 0 16rem;
}

.modal-dim {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 9;
  display: none;
}


.map {
  background: #F1F4F8;
  padding-bottom: 20rem;
}

.map .dot-thumb img {
  width: 100%;
  flex-shrink: 0;
  -webkit-user-drag: none;
  user-select: none;
}

.map .need-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;

}

.map .need-scroll .dot-thumb {
  position: relative;
  width: 1920rem;
}

.inner-1480 {
  max-width: 1480rem;
  width: 100%;
  margin: 0 auto;
}

@media all and (max-width:1024px) {



  .modal-wrap .modal-cont .btn-close {
    width: 30rem;
    height: 30rem;
  }

  .modal-wrap .modal-cont {
    max-width: none;
    width: calc(100% - 32rem);
  }

  .map .dot-thumb {
    height: 800rem;
    transform: translateY(-15%);
  }


}



.content-bunkering-info {
  display: flex;
  gap: 80rem;
  justify-content: space-between;
  margin-bottom: 120rem;
}

.content-bunkering-info li {
  flex: 1;
}

.content-bunkering-info li p {
  margin-top: 24rem;
  color: var(--Color-Gray-800);
}

.content-oil-info {
  margin-bottom: 120rem;
}

.content-oil-info>p {
  margin-bottom: 40rem;
}

.content-oil-info ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16rem;

}

.content-oil-info ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 12rem;
  border: 1px solid var(--Color-Gray-200);
  background: var(--Color-Gray-White);
  padding: 48rem 0;
}

.content-oil-info ul li span {
  display: block;
  margin: 37rem 0 16rem;
}

.content-oil-info ul li p {
  color: var(--Color-Gray-800);
}


@media all and (max-width:1024px) {
  .content-bunkering-info {
    flex-direction: column;
  }

  .content-oil-info ul {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 16rem;

  }
}

.etc-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 107rem 0 4rem;
}

.total-sol {
  margin-top: 14rem;
}

.content-af-market p.f-b3-r {
  color: var(--Color-Gray-800);
}

.square-border-btn.bdr {
  border-radius: 999rem;
  border: 1px solid var(--Color-Gray-900);
  width: fit-content;

}

.af-market-tit .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content-smart-solution .etc-area {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20rem;
}

.content-smart-solution .etc-area-tit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.content-smart-solution .square-border-btn.link span {
  background: url(/common/kr/images/ico-link-external.svg) no-repeat right center / 20rem auto;
}

.smt-sol-info>div {
  display: flex;
  justify-content: flex-end;
}

.smt-sol-info.type02>div {
  display: flex;
  justify-content: space-between;
}

.smt-sol-info.type02>div>p {
  padding-top: 80rem;
}

.content-smart-solution .img {
  margin-top: 40rem;
}

.content-smart-solution .img img {
  width: 100%;
}

.content-smart-solution .smt-sol-info .info-list {
  margin: 0rem 0 40rem;
}

.content-smart-solution .info-list li+li {
  border-top: 1px solid var(--Color-Gray-200);
}

.content-smart-solution .info-list {
  gap: 0;
  max-width: 755rem;
  width: 100%;
}

.content-smart-solution .info-list li {
  gap: 24rem;
  padding: 80rem 0;
}

.content-smart-solution .info-list li.fdr {
  flex-direction: row;
  justify-content: space-between;
}

.content-smart-solution .img-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16rem;
}

.content-smart-solution .img-list .img {
  margin-top: 0;
}

.content-smart-solution>ul>li>.f-b3-r {
  margin-top: 16rem;
  color: var(--Color-Gray-800);
}

.content-smart-solution>.f-b3-r {
  color: var(--Color-Gray-800);
}

@media all and (max-width:1024px) {
  .content-af-market .square-border-btn {
    margin-bottom: 24rem;
  }

  /* .dl-area p,
  .content-af-market p.f-b3-r {
    margin-bottom: 8rem;
  } */

  .content-af-market .dl-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 64rem 0 0rem;
  }

  .content-smart-solution .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .content-smart-solution .info-list li {
    gap: 16rem;
    padding: 40rem 0;
  }

  .content-smart-solution .etc-area {
    gap: 0rem;
  }

  .etc-area .f-b3-r {
    margin: 16rem 0 24rem;
  }

  .content-smart-solution .info-list li.fdr {
    flex-direction: column;
  }

  .content-smart-solution .img-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20rem 20rem;
  }
}




/* 에프터 마켓 하단 */
.af-market-bottom {
  display: flex;
  flex-direction: column;
  gap: 40rem;
}

.af-market-bottom ul {
  display: flex;
  justify-content: space-between;
  padding: 64rem 100rem;
  border-radius: var(--border-radius-md);
  border: 1px solid var(--Color-Gray-Black);
  background: var(--Color-Gray-White);
  box-sizing: border-box;
}

.af-market-bottom ul li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40rem;
}

.af-market-bottom ul li>div {
  display: flex;
  flex-direction: column;
  gap: 12rem;
}

.af-market-bottom ul li p {
  width: 100%;
  max-width: 208rem;
}

.af-market-bottom ul li.line {
  width: 1px;
  background: var(--Color-Gray-300);
}


@media all and (max-width: 1024px) {
  .card-info {
    margin-bottom: 80rem;
  }

  .card-info .af-market-card-slide ul li {
    padding: 32rem 24rem;
  }

  .af-market-box {
    flex-direction: column;
    gap: 40rem;
  }

  .af-market-slide {
    max-width: 320rem;
  }

  .af-market-info {
    gap: 40rem;
    padding-block: 40rem;
  }

  .content-af-market>ul {
    /* gap: 64rem;
    margin-top: 64rem; */
    gap: 80rem;
    margin-top: 80rem;
  }

  .af-market-info .part-list {
    grid-template-columns: 1fr;
  }

  .af-market-info .part-list li {
    padding: 16rem;
  }

  .info-list {
    gap: 40rem !important;
  }


  .af-market-bottom ul {
    flex-direction: column;
    gap: 40rem;
    padding: 40rem 24rem;
  }

  .af-market-bottom ul li {
    gap: 32rem;
  }

  .af-market-bottom ul li p {
    max-width: 100%;
  }

  .af-market-bottom ul li.line {
    width: 100%;
    height: 1px;
  }
}

.info-list {
  display: flex;
  flex-direction: column;
  gap: 56rem;
}

.info-list li {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.info-list li p {
  color: var(--Color-Gray-800);
}

.af-market-check {
  margin-bottom: 160rem;
}

.af-market-check>p {
  margin-bottom: 40rem;
}

.af-market-check ul {
  max-width: 910rem;
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 50rem;
  margin-top: 40rem;
}

.af-market-check li span {
  color: var(--Color-Blue-Primary);

}

.af-market-check li p {
  margin-top: 24rem;
  color: var(--Color-Gray-900);
}

.af-market-check .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.certi-logo {}

.certi-logo .img-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16rem;
}

.certi-logo .img-list .img {
  border-radius: 8rem;
  overflow: hidden;
}

.certi-logo .img-list .img img {
  width: 100%;

}

@media all and (max-width: 1024px) {
  .af-market-check ul {
    max-width: 910rem;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 32rem;
    margin-top: 40rem;
  }

  .af-market-check {
    margin-bottom: 120rem;
  }

  .certi-logo .img-list {
    display: flex;
    align-items: center;

  }
}

@media all and (max-width: 768px) {

  .certi-logo .img-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}




/* --------------------미디어허브-------------------- */

.item-date {
  display: flex;
  align-items: center;
  gap: 10rem;
}

.item-date p:first-child {
  color: var(--Color-Gray-800);
}

.item-date p:last-child {
  display: flex;
  align-items: center;
  gap: 10rem;
  color: var(--Color-Gray-700);
}

.item-date p:last-child::before {
  content: "";
  width: 1px;
  height: 10rem;
  background: #E4E4E4;
}

.card-list.grid2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 80rem;
}

@media (width <=1024px) {
  .card-list.grid2 {
    grid-template-columns: 1fr;
    gap: 40rem;
  }
}

.board-sub-cate {
  margin-block: 40rem;
}

.board-sub-cate a {
  display: flex;
  align-items: flex-start;
  gap: 4rem;
  width: auto;
  margin-right: 20rem;
}

.board-sub-cate a p {
  color: var(--Color-Gray-700);
  transition: .3s;
}

.board-sub-cate a.on p {
  color: var(--Color-Gray-900);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: 25%;
  text-underline-position: from-font;
}

.board-sub-cate a span {
  color: var(--Color-Gray-700);
  font-feature-settings: 'sups' on;
}

.board-sub-cate a.on span {
  color: var(--Color-Gray-900);
}

.card-wrap {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}

.card-wrap .img-box {
  border-radius: 16rem;
  overflow: hidden;
}

.card-wrap .post-text {
  display: flex;
  flex-direction: column;
  gap: 18rem;
}

.card-wrap .post-text .post-info {
  display: flex;
  flex-direction: column;
  gap: 10rem;
}

.card-wrap .post-text .post-info>div {
  display: flex;
  align-items: center;
  gap: 10rem;

}

.card-wrap .post-text .post-info .cate {
  color: var(--Color-Blue-Primary);
}

.card-wrap .post-text .post-info .tit {
  color: var(--Color-Gray-900);
}


.post-text .tag {
  display: flex;
  align-items: center;
  gap: 4rem;
  color: var(--Color-Gray-800);
}

.post-text .tag p {
  padding: 4rem 14rem;
  border-radius: 100px;
  border: 1px solid var(--Color-Gray-200);
  background: var(--Color-Gray-White);
  box-sizing: border-box;
}

/* 웹진 상세 */

.view-detail-con .detail-tit .tit-wrap .f-b4-b {
  margin-bottom: 20rem;
  color: var(--Color-Blue-Primary);
}

.view-detail-con .detail-tit .tit-wrap .item-date {
  justify-content: center;
}

.detail-con .post-text {
  margin-block: 80rem 60rem;
}

.detail-con .post-text .tag {
  justify-content: center;
}

.media-top {
  position: relative;
  padding: 80rem 0 106rem;
  margin-left: -118rem;
  margin-right: -118rem;
}

.media-top::before {
  content: "";
  z-index: -1;
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  width: 100vw;
  transform: translateX(-50%);
  background: var(--Color-Blue-Primary);
}

.media-top>p.f-h2 {
  margin-bottom: 20rem;
  color: var(--Color-Gray-White);
}

.media-top-area {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15rem;
}

.media-top-area .img-box {
  width: 100%;
}

.media-top-area .media-big {
  border-radius: 16rem;
  overflow: hidden;
}

.media-top-area .media-big>div {
  background: var(--Color-Gray-White);
}

.media-top-area .media-big .txt-wrap {
  padding: 40rem;
}

.media-top-area .media-big .txt-wrap .f-h3 {
  color: var(--Color-Gray-900);
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.media-top-area .media-big .txt-wrap .f-b4-r {
  margin-block: 8rem 20rem;
  color: var(--Color-Gray-800);
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}




.media-thumb-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15rem;
  padding: 30rem;
  border-radius: 16px;
  background: var(--Color-Gray-White);
  overflow: hidden;
}

.media-thumb-list .thumb-item .img-box {
  border-radius: var(--border-radius-xs);
  overflow: hidden;
}

.media-thumb-list .thumb-item .txt-wrap>p {
  margin-block: 20rem 10rem;
  color: var(--Color-Gray-900);
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}


.media-big>div,
.thumb-item,
.has-sns-btn {
  position: relative;
}

.media-big .sns-btn,
.thumb-item .sns-btn,
.has-sns-btn .sns-btn {
  position: absolute;
  top: 15rem;
  left: 15rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40rem;
  height: 40rem;
  border-radius: 100px;
  background: var(--Color-Blue-Primary);
}



@media (width <=1024px) {
  .media-top {
    margin-left: 0;
    margin-right: 0;
    padding-block: 80rem;
  }

  .media-top-area {
    grid-template-columns: 1fr;
  }

  .media-top-area .media-big .txt-wrap {
    padding: 24rem;
  }

  .media-thumb-list {
    grid-template-columns: 1fr;
    padding: 0;
    border-radius: 0;
    background: none;
  }

  .media-thumb-list .thumb-item {
    border-radius: var(--border-radius-xs);
    overflow: hidden;
  }

  .media-thumb-list .thumb-item a {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    background: var(--Color-Gray-White);

  }

  .media-thumb-list .thumb-item .img-box {
    border-radius: 0;

  }

  .media-thumb-list .thumb-item a .txt-wrap {
    padding: 10rem 16rem;
  }

  .media-thumb-list .thumb-item .txt-wrap>p {
    margin-block: 0 4rem;

  }
}



/* 유튜브 레이어 */


.youtube-layer {
  position: fixed;
  inset: 0;

  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.youtube-layer .dimmed {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
}

.youtube-layer.open {
  opacity: 1;
  visibility: visible;
}

.youtube-layer .layer-close {
  position: absolute;
  top: 40rem;
  right: 40rem;
}

.youtube-layer>div:not(.dimmed) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  gap: 30rem;
  max-width: 926rem;
}

.youtube-layer .video-wrap {


  width: 926rem;
  height: 521rem;

}

.youtube-layer .txt-wrap {
  padding: 30rem;
  border-radius: var(--border-radius-sm);
  background: var(--Color-Gray-White);
}

.youtube-layer .txt-wrap .video-info-box {
  height: 150rem;
  padding: 16rem;
  margin-top: 20rem;
  border-radius: var(--border-radius-xs);
  border: 1px solid var(--Color-Gray-300);
  background: var(--Color-Gray-White);
}

.youtube-layer .txt-wrap .video-info-box>div {
  height: 100rem;
  padding-right: 10rem;
  overflow-y: auto;
}

.youtube-layer .txt-wrap .video-info-box>div::-webkit-scrollbar {
  width: 4rem;

  background-color: transparent;
}

.youtube-layer .txt-wrap .video-info-box>div::-webkit-scrollbar-thumb {
  width: 4rem;
  background-color: #C9C6C2;
  border-radius: 100px;
}

.youtube-layer .txt-wrap .video-info-box>div::-webkit-scrollbar-track {
  background-color: transparent;
}

/* --------------------//미디어허브-------------------- */
/* --------------------지속가능경영-------------------- */
.esg-area-tit {
  margin-bottom: 60rem;
}

.esg-area-tit .title {
  margin-bottom: 120rem;
}


.esg-area-info {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.esg-area-info .f-b3-r {
  color: var(--Color-Gray-800);
}



.visual-sec.type02 {}


.visual-sec.type02 .visual-tit {
  width: 100%;
  max-width: 1220rem;
  align-items: flex-start;
  text-align: left;
  gap: 64rem;
}

.visual-sec.type02 .visual-tit>div {
  display: flex;
  flex-direction: column;
  gap: 24rem;
}

@media (width <=1024px) {
  .visual-sec.type02 .f-h1 {
    font-size: 20rem;
  }
}


.esg-area-cont .esg-vision-box {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40rem;
}

.esg-area-cont .esg-vision-box>li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40rem;
}

.esg-area-cont .esg-vision-box li .tit {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 16rem;
  border-radius: var(--border-radius-sm);
  background: var(--Color-Gray-White);
}



.esg-area-cont .esg-vision-box li .circle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20rem;
  width: 280rem;
  height: 280rem;
  border-radius: 999px;
}

.esg-area-cont .esg-vision-box li .circle p {
  text-align: center;
  color: var(--Color-Gray-White);
}

.esg-area-cont .esg-vision-box li .txt-box {
  display: flex;
  flex-direction: column;
  gap: 16rem;
  width: 100%;
  padding: 24rem;
  border-radius: var(--border-radius-sm);
}

.esg-area-cont .esg-vision-box li .txt-box>p {
  text-align: center;
}

.esg-area-cont .esg-vision-box li .txt-box>div {
  display: flex;
  flex-direction: column;
  gap: 16rem;
  padding: 20rem;
  border-radius: var(--border-radius-xs);
  background: var(--Color-Gray-White);
}

.esg-area-cont .esg-vision-box li .txt-box>div>div {
  display: flex;
  flex-direction: column;
  gap: 8rem;
  padding-bottom: 16rem;
  border-bottom: 1px solid #F2F9F5;
}

.esg-area-cont .esg-vision-box li .txt-box>div>div:last-child {
  border-bottom: 0;
}


.esg-area-cont p.green {
  color: var(--Color-Green-Primary);
}

.esg-area-cont p.blue {
  color: var(--Color-Blue-Primary);
}

.esg-area-cont p.purple {
  color: #3D109D;
}

.esg-area-cont p.gray {
  color: var(--Color-Gray-700);
}


.esg-area-cont .esg-vision-box li:nth-child(1) .tit {
  border: 1px solid var(--Color-Green-Primary);
}

.esg-area-cont .esg-vision-box li:nth-child(1) .circle {
  background: var(--Color-Green-Primary);

}

.esg-area-cont .esg-vision-box li:nth-child(1) .txt-box {
  background: #F2F9F5;
}

.esg-area-cont .esg-vision-box li:nth-child(2) .tit {
  border: 1px solid var(--Color-Blue-Primary);
}

.esg-area-cont .esg-vision-box li:nth-child(2) .circle {
  background: var(--Color-Blue-Primary);
}

.esg-area-cont .esg-vision-box li:nth-child(2) .txt-box {
  background: #F2F5F9;
}

.esg-area-cont .esg-vision-box li:nth-child(3) .tit {
  border: 1px solid #3D109D;
}

.esg-area-cont .esg-vision-box li:nth-child(3) .circle {
  background: #3D109D;
}

.esg-area-cont .esg-vision-box li:nth-child(3) .txt-box {
  background: #F0ECF8;
}



.basic-table ul {
  text-align: left;
}

@media (width <=1024px) {
  .esg-area-tit .title {
    margin-bottom: 80rem;
  }

  .esg-area-cont .esg-vision-box {
    grid-template-columns: 1fr;
  }
}


/* 지속가능경영 - 환경 */

.esg-cont-wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 60rem;
}

.esg-cont-wrap .esg-cont-info {
  display: grid;
  grid-template-columns: 445rem 1fr;
  gap: 20rem;
}

.esg-cont-wrap .esg-tit {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.esg-cont-wrap .esg-tit .f-b3-r {
  color: var(--Color-Gray-800);
}

.img-box.border-img-box {
  border-radius: var(--border-radius-md);
  overflow: hidden;
}

.img-box.need-scroll {
  width: calc(100% + 20rem);
  padding-right: 20rem;
  overflow-x: auto;
}

.img-box.need-scroll::-webkit-scrollbar {
  width: 4rem;
  height: 4rem;
  background: transparent;
}

.img-box.need-scroll::-webkit-scrollbar-track {
  display: none;
}

.img-box.need-scroll::-webkit-scrollbar-thumb {
  background-color: var(--Color-Gray-300);
  border-radius: var(--border-radius-xs);
}

.img-box.need-scroll img {
  min-width: 1220rem;
}

.esg-cont-box {
  display: grid;
  grid-template-columns: 1fr;
  gap: 80rem;
}

.esg-cont-box>.esg-cont-info>div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24rem;
  padding-bottom: 80rem;
  border-bottom: 1px solid var(--Color-Gray-200);
}

.esg-cont-box>.esg-cont-info:last-child>div {
  padding-bottom: 0;
  border-bottom: none;
}

.esg-cont-info .f-b3-r {
  color: var(--Color-Gray-800);
}

.esg-cont-info .btn {
  display: flex;
  align-items: center;
  gap: 8rem;
}

/*지속가능경영 - 사회 */
.esg-cont-wrap .esg-cont .btn {
  margin-top: 24rem;
}

.esg-num-list-box {
  display: flex;
  flex-direction: column;
  gap: 40rem;
  margin-top: 80rem;
}

.esg-num-list-box .esg-num-list-tit {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.esg-num-list-box .esg-num-list-tit .f-b3-r {
  color: var(--Color-Gray-800);
}

.esg-num-list {
  display: flex;
  flex-direction: column;
  gap: 32rem;
  padding: 32rem;
  border-radius: var(--border-radius-md);
  border: 1px solid var(--Color-Gray-200);
  background: var(--Color-Gray-White);
  box-sizing: border-box;
}

.esg-num-list .f-h3 {
  color: var(--Color-Blue-Primary);
}

.esg-num-list ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16rem;
}

.esg-num-list ul li {
  display: flex;
  align-items: center;
  gap: 10rem;
}

.esg-num-list ul li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32rem;
  height: 32rem;
  border-radius: 100%;
  background: var(--Color-Blue-Primary);
}

.esg-num-list ul li .f-b4-b {
  color: var(--Color-Gray-White);
}

.esg-num-list ul li .f-b4-r {
  color: var(--Color-Gray-800);
}


.esg-area-cont.img-type .img-box {
  margin-top: 60rem;
}

.esg-area-cont.img-type2 {
  margin-top: 60rem;
}

.esg-area-cont.img-type2 .img-box {
  margin-top: 40rem;
}

.esg-cont .grid2-box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16rem;
  margin-top: 60rem;
}

.esg-cont .grid2-box>div {
  padding: 24rem 34rem;
  border-radius: var(--border-radius-sm);
  background: var(--Color-Blue-Light);
  box-sizing: border-box;
  text-align: center;
}


/* 아코디언 리스트 */

.esg-accordion-list {
  border-radius: 16rem;
  border: 1px solid var(--Color-Gray-400);
  background: var(--Color-Gray-White);
  overflow: hidden;
}



.esg-accordion-list li:first-child .accordion-title {
  border-top: none;
}

.esg-accordion-list .accordion-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 32rem;
  border-top: 1px solid var(--Color-Gray-400);
  box-sizing: border-box;
}

.esg-accordion-list .accordion-title span {
  position: relative;
}

.esg-accordion-list .accordion-title span img {
  transition: .3s;
}

.esg-accordion-list li .icon-minus {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
}

.esg-accordion-list li .icon-plus {
  display: block;

}

.esg-accordion-list li.on .icon-minus {
  opacity: 1;
}

.esg-accordion-list li.on .icon-plus {
  opacity: 0;
}

.esg-accordion-list .accordion-info {
  display: flex;
  flex-direction: column;
  gap: 24rem;
  padding: 36rem 56rem;
  background: var(--Color-Gray-50);
  box-sizing: border-box;
}

.esg-accordion-list li.accordion-flex .accordion-info {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.esg-accordion-list li.accordion-flex .accordion-info>div:not(.img-box) {
  display: flex;
  flex-direction: column;
  gap: 24rem;
}

.txt-div .border-btn.white.link {
  margin-top: 64rem;
}

.center .txt-div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.center .txt-div .f-t1,
.center .txt-div .f-b3-r {
  text-align: center;
}

@media (width <=1024px) {
  .esg-cont-wrap .esg-cont-info {
    grid-template-columns: 1fr;
    gap: 60rem;
  }

  .esg-cont-wrap .esg-cont-box .esg-cont-info {
    gap: 0rem;
  }

  .esg-cont-wrap .esg-cont-info .esg-tit {
    max-width: 100%;
  }

  .esg-cont-info .btn {
    flex-direction: column;
    align-items: flex-start;
  }

  .esg-cont .grid2-box {
    grid-template-columns: 1fr;
  }

  .esg-accordion-list .accordion-title {
    padding: 30rem 16rem;
  }

  .esg-accordion-list .accordion-info {
    padding: 36rem 16rem;
  }

  .esg-accordion-list li.accordion-flex .accordion-info {
    flex-direction: column;
  }
}



.esg-report-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80rem 20rem;
}

.esg-report-list .img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 320rem;
  background: var(--Color-Blue-Light);
  border-radius: var(--border-radius-md);
}

.esg-report-list .img img {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}

.esg-report-list .f-h3 {
  overflow: hidden;
  margin-top: 24rem;
  text-align: center;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-all;
}

.esg-report-list .btn-wrap {
  margin-top: 24rem;
}

.esg-report-list .img img {
  width: 100%;
  max-width: 70%;
  max-height: 70%;
}



@media all and (max-width: 1024px) {
  .cont-area:has(.esg-report-list) .cont-tit-wrap .cont-txt {
    margin-top: 8rem;
  }

  .esg-report-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 40rem;
  }
}

@media all and (max-width: 600px) {
  .esg-report-list {
    grid-template-columns: repeat(1, 1fr);
  }

  .esg-report-list .img {
    height: 260rem;
  }
}

/* [ ESG Library > 평가등급 ] */
.esg-eval-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20rem;
}

.esg-eval-list .esg-eval-item {
  overflow: hidden;
  display: flex;
  height: 240rem;
  border: 1px solid var(--Color-Gray-300);
  border-radius: var(--border-radius-md)
}

.esg-eval-list .esg-eval-item .img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 240rem;
  background: var(--Color-Blue-Light)
}

.esg-eval-list .esg-eval-item:nth-child(1) .img img {
  width: 154rem;
}

.esg-eval-list .esg-eval-item:nth-child(2) .img img {
  width: 128rem;
}

.esg-eval-list .esg-eval-item:nth-child(3) .img img {
  width: 158rem;
}

.esg-eval-list .esg-eval-item:nth-child(4) .img img {
  width: 118rem;
}

.esg-eval-list .esg-eval-item .txt-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 21rem;
  justify-content: flex-end;
  padding: 24rem 40rem;
  width: 360rem;
  text-align: right;
}

.esg-eval-list .esg-eval-item .txt-wrap .grade-wrap {
  display: flex;
  gap: 16rem;
  padding: 4rem 12rem;
  color: var(--Color-Gray-700);
  background: #F1F8F4;
  border-radius: var(--border-radius-xs)
}

.esg-eval-list .esg-eval-item .txt-wrap .grade-wrap span {
  color: var(--Color-Green-Primary)
}

.esg-eval-list .esg-eval-item .txt-wrap .f-d1-r {
  margin-top: 38rem;
  color: var(--Color-Gray-800)
}

.esg-eval-list .esg-eval-item .txt-wrap .f-d3 {
  color: var(--Color-Green-Primary);
  white-space: nowrap;
}

@media all and (max-width: 1024px) {
  .esg-eval-list .esg-eval-item {
    flex-direction: column;
    height: auto;
  }

  .esg-eval-list .esg-eval-item .img {
    width: 100%;
    height: 200rem;
  }

  .esg-eval-list .esg-eval-item:nth-child(1) .img img {
    width: 198rem;
  }

  .esg-eval-list .esg-eval-item:nth-child(2) .img img {
    width: 183rem;
  }

  .esg-eval-list .esg-eval-item:nth-child(3) .img img {
    width: 248rem;
  }

  .esg-eval-list .esg-eval-item:nth-child(4) .img img {
    width: 162rem;
  }

  .esg-eval-list .esg-eval-item .txt-wrap {
    padding: 24rem;
    width: 100%;
  }

  .esg-eval-list .esg-eval-item .txt-wrap .f-d3 {
    font-size: 44rem;
  }

  .esg-eval-list .esg-eval-item .txt-wrap .f-d1-r {
    margin-top: 8rem;
  }
}

@media all and (max-width: 600px) {
  .esg-eval-list {
    display: flex;
    flex-direction: column;
  }
}

/* --------------------//지속가능경영-------------------- */




/* --------------------고객지원-------------------- */
/* Contact us */
.contact-bottom {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  height: 400rem;
  padding: 80rem;
}

.contact-bottom p {
  color: var(--Color-Gray-White);
}

.contact-bottom .f-d1-r {
  text-align: right;

}

.contact-bottom .contact-left {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}

.contact-bottom .contact-left>div {
  display: flex;
  align-items: center;
  gap: 20rem;
}

.contact-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.contact-bg-box {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  border-radius: var(--border-radius-lg);
  overflow: hidden;
}

.contact-bg-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media all and (max-width: 1024px) {
  .contact-bottom {
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    height: 440rem;
    gap: 40rem;
    padding: 60rem 15rem;
    text-align: center;
  }

  .contact-bottom .contact-left {
    text-align: left;
  }


  .contact-right {
    align-items: flex-start;
  }
}

/* 글로벌 네트워크 */

.form-table>.f-h2 {
  margin-bottom: 20rem;
}

.global-network-map {
  position: relative;
}

.map-list {
  background: #F1F4F8;
  padding-bottom: 20rem;
}

.map-list .need-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
}

.need-scroll {
  cursor: grab;

}

.need-scroll.is-dragging {
  cursor: grabbing;
  user-select: none;
}


.map-list .need-scroll::-webkit-scrollbar {

  height: 2rem;
  background-color: transparent;

}

.map-list .need-scroll::-webkit-scrollbar-thumb {
  height: 2rem;
  background-color: #003087;
  border-radius: 0;
}

.map-list .need-scroll::-webkit-scrollbar-track {
  background-color: transparent;
  margin: 0 16rem;
}

.map-list .need-scroll ul {
  display: none;

}

.map-list .need-scroll ul.on {
  display: block;
}

.map-list .need-scroll li {
  display: none;
  min-width: 1920rem;
  margin: 0 auto;
}

.map-list .need-scroll ul.on li.on {
  display: block;
}

.map-list .need-scroll li:first-child {}

.map-tab {
  position: absolute;
  top: 50%;
  left: 80rem;
  transform: translateY(-50%);
  z-index: 10;
}

.map-tab ul {
  display: flex;
  flex-direction: column;
  gap: 30rem;
}

.map-tab ul li {
  display: flex;
  align-items: center;
  transition: all .3s;
  cursor: pointer;
}

.map-tab ul li p {
  color: #B0BBCA;
}

.map-tab ul li.on p {
  padding-left: 18rem;
  transition: .3s;
}

.map-tab ul li span {
  opacity: 0;
  color: var(--Color-Blue-Primary);
  font-size: 0;
  font-feature-settings: 'sups' on;
  transition: .3s;
}

.map-tab ul li::before {
  content: "";
  transition: .3s;
}


.map-tab ul li.on::before {
  width: 2rem;
  height: 30rem;
  background: #005BFF;
}

.map-tab ul li.on p {
  color: var(--Color-Gray-900);
}

.map-tab ul li.on span {
  opacity: 1;
  font-size: 20rem;
}


.global-dots {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.global-dots .dot-box {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  /* min-width: 12rem;
  min-height: 12rem; */
  z-index: 100;
}

.global-dots .dot-box .dot {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  background: #005BFF;
  min-width: 12rem;
  min-height: 12rem;
  padding: 0;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: dotAni 1.2s infinite ease-in-out;
}

.global-dots .dot::before {
  width: 20rem;
  height: 20rem;
  opacity: .2;
}

.global-dots .dot::after {
  width: 28rem;
  height: 28rem;
  opacity: .1;
}

.global-dots .dot::before,
.global-dots .dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  background: var(--Color-Blue-Primary);
  transform: translate(-50%, -50%);
  z-index: 5;
}

.global-dots .dot::after {
  animation-delay: 0.3s;
}

@-webkit-keyframes dotAni {
  0% {
    transform: translate(-50%, -50%) scale(0.6);
  }

  50% {
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    transform: translate(-50%, -50%) scale(0.6);
  }
}

@keyframes dotAni {
  0% {
    transform: translate(-50%, -50%) scale(0.6);
  }

  50% {
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    transform: translate(-50%, -50%) scale(0.6);
  }
}

.map-list li {
  position: relative;
}

.map-list .need-scroll>ul>li .img-box {
  position: relative;
}

.map-list .need-scroll>ul>li .img-box img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -webkit-user-drag: none;
  user-select: none;
  opacity: 0;
  transition: opacity .3s;
}

.map-list .need-scroll>ul>li .img-box img:first-child {
  opacity: 1;
  position: relative;
}

.map-list00 .dot-box.a {
  top: 483rem;
  left: 785rem;
}

.map-list00 .dot-box.b {
  top: 410rem;
  left: 320rem;
}

.map-list00 .dot-box.c {
  top: 470rem;
  left: 368rem;
}

.map-list00 .dot-box.d {
  top: 478rem;
  left: 829rem;
}

.map-list00 .dot-box.e {
  top: 544rem;
  left: 753rem;
}

.map-list00 .dot-box.f {
  top: 598rem;
  left: 1414rem;
}

.map-list00 .dot-box.g {
  top: 488rem;
  left: 694rem;
}

.map-list00 .dot-box.h {
  top: 408rem;
  left: 297rem;
}

.map-list00 .dot-box.i {
  top: 487rem;
  left: 1335rem;
}

.map-list00 .dot-box.j {
  top: 628rem;
  left: 679rem;

}

.map-list00 .dot-box.k {
  top: 543rem;
  left: 485rem;
}

.map-list01 .dot-box.a {
  top: 483rem;
  left: 785rem;
}

.map-list02 .dot-box.a {
  top: 606rem;
  left: 1213rem;
}

.map-list02 .dot-box.b {
  top: 680rem;
  left: 1184rem;
}

.map-list03 .dot-box.a {
  top: 408rem;
  left: 297rem;
}

.map-list03 .dot-box.b {
  top: 487rem;
  left: 1335rem;
}

.map-list03 .dot-box.c {
  top: 628rem;
  left: 679rem;

}

.map-list03 .dot-box.d {
  top: 543rem;
  left: 485rem;
}

.map-list04 .dot-box.a {
  top: 410rem;
  left: 320rem;
}

.map-list04 .dot-box.b {
  top: 470rem;
  left: 368rem;
}

.map-list04 .dot-box.c {
  top: 478rem;
  left: 829rem;
}

.map-list04 .dot-box.d {
  top: 544rem;
  left: 753rem;
}

.map-list04 .dot-box.e {
  top: 598rem;
  left: 1414rem;
}

.map-list04 .dot-box.f {
  top: 488rem;
  left: 694rem;
}


/* layer-list */

.map-layer-list {
  position: fixed;
  inset: 0;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.map-layer-list.open {
  opacity: 1;
  visibility: visible;
}


.map-layer-list>ul {
  display: none;
}

.map-layer-list>ul.on {
  display: block;
}

.map-layer-list .dimmed {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.map-layer-list .dimmed.on {
  opacity: 1;
  visibility: visible;
}

.map-layer-list>ul>li {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 600rem;
  border-radius: var(--border-radius-md);
  background: var(--Color-Gray-White);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}

.map-layer-list>ul>li.on {
  opacity: 1;
  visibility: visible;
}

.map-layer-list li.none-img .img-box {
  display: none;
}

.map-layer-list li .map-info {

  padding: 60rem 60rem 55rem;
  box-sizing: border-box;
}

.map-layer-list li .map-info .badge-box {
  display: flex;
  align-items: center;
  gap: 8rem;
  margin-bottom: 16rem;
}

.map-layer-list li .map-info .badge-box p {
  padding: 4rem 8rem;
  border-radius: var(--border-radius-xs);
  border: 1px solid var(--Color-Blue-Primary);
}

.map-layer-list li .map-info .badge-box .f-d1-b {
  color: var(--Color-Blue-Primary);
}

.map-layer-list li .map-info .f-b3-b {
  margin-block: 30rem 16rem;
  color: var(--Color-Blue-Primary);
}

.map-layer-list li .map-info:has(.badge-box) .f-b3-b {
  margin-block: 30rem 8rem;
}


.map-layer-list li .map-info .f-b3-m {
  min-width: 80rem;
  max-width: 80rem;
}

.map-layer-list li .map-info .f-b3-r {
  color: var(--Color-Gray-800);
}



.map-layer-list li .map-info .info-border {
  padding-bottom: 30rem;
  border-bottom: 1px solid var(--Color-Gray-200);
}

.map-layer-list li .map-info ul {
  display: flex;
  flex-direction: column;
  gap: 8rem;
}

.map-layer-list li .map-info ul li {
  display: flex;
  align-items: flex-start;
  gap: 8rem;
}

.map-layer-list li .close-layer {
  position: absolute;
  top: 30rem;
  right: 30rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48rem;
  height: 48rem;
  border-radius: 999px;
  background: var(--Color-Gray-900) url(/common/kr/images/icon-close-btn-white-b.svg)no-repeat center /20rem;
}



.row-last tbody tr:not(:first-child) td:last-child {
  border-right: 1px solid var(--Color-Gray-200);
}


@media (width <=1024px) {

  .map-tab {
    position: static;
  }

  .map-tab ul {
    flex-direction: row;
    justify-content: center;
    gap: 20rem;
  }

  .map-tab ul li.on::before {
    content: none;
  }

  .map-tab ul li.on p {
    padding-left: 0;
  }

  .map-tab ul li.on span {
    font-size: 16rem;
  }

  .map-layer-list>ul>li {
    max-width: 328rem;
  }

  .map-list .need-scroll ul {
    display: none;
    height: 800rem;
    transform: translateY(-10%);
  }

  .map-list .need-scroll>ul>li .img-box img {
    object-fit: cover;
  }

  .map-layer-list li .map-info {
    /* padding: 30rem 16rem 55rem; */
    padding: 30rem 16rem;
  }

  .map-layer-list li .close-layer {
    top: 16rem;
    right: 17rem;
    width: 40rem;
    height: 40rem;
  }

  .map-layer-list li .map-info ul li {
    /* flex-direction: column; */
    align-items: flex-start;
  }

  /* .global-dots .dot-box .dot {
    animation: none;
  } */

  .map-layer-list li .map-info .badge-box .f-d1-b {
    font-size: 12rem;
  }
}


/* 1:1문의 */
.inquiry-link-list ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40rem;
  width: 100%;
}

.inquiry-link-list ul li {
  width: 100%;
  max-width: 380rem;
  aspect-ratio: 1 / 1;
  border-radius: var(--border-radius-md);

}

.inquiry-link-list ul li a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 60rem;
  color: var(--Color-Gray-White);
}

.inquiry-link-list ul li:nth-child(1) {
  background: url(/common/kr/images/img-inquiry01.jpg) no-repeat center / cover;
}

.inquiry-link-list ul li:nth-child(2) {
  background: url(/common/kr/images/img-inquiry02.jpg) no-repeat center / cover;
}

.inquiry-link-list ul li:nth-child(3) {
  background: url(/common/kr/images/img-inquiry03.jpg) no-repeat center / cover;
}


textarea.info-agree:read-only {
  background-color: var(--Color-Gray-White);
}

.form-checkbox.has-agree-info {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 8rem;
}

.btn-wrap.mt-154 {
  margin-top: 154rem;
}


/* FAQ */


.accordion-wrap.faq-list .accordion-item .accor-tit {
  gap: 8rem;
}

.accordion-wrap.faq-list .accordion-item .accor-tit .q-mark {
  color: var(--Color-Blue-Primary);
}

.accordion-wrap.faq-list .accordion-item .accor-cont .txt-list .item .txts {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.accordion-wrap.faq-list .accordion-item .accor-cont .txt-list .item {}

/* 다운로드 */
.download-sub-text {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20rem;
  margin-bottom: 80rem;
}

.form-table.no-border .flex-txt-wrap {
  display: flex;
  justify-content: space-between;
}

.form-table.no-border .flex-txt-wrap .txt-div {
  width: 820rem;
}

.form-table.no-border .flex-txt-wrap .txt-div .cate1 {
  color: var(--Color-Blue-Primary);
}

.form-table.no-border .flex-txt-wrap .txt-div .cate2 {
  color: var(--Color-Green-Primary);
}

.form-table.no-border .flex-txt-wrap .txt-div .cate3 {
  color: var(--Color-Blue-500);
}


.form-table.no-border .flex-txt-wrap .file-type,
.form-table.no-border .flex-txt-wrap .btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120rem;
}

@media all and (max-width: 1024px) {
  .download-sub-text {
    flex-direction: column;
    align-items: flex-start;
  }

  .form-table.no-border .flex-txt-wrap {
    flex-wrap: wrap;
  }

  .form-table.no-border .flex-txt-wrap .txt-div {
    width: 100%;
  }

  .form-table.no-border .flex-txt-wrap .file-type {
    justify-content: flex-start;
    width: 100%;
  }

  .form-table.no-border .flex-txt-wrap .file-type,
  .form-table.no-border .flex-txt-wrap .btn {
    margin-top: 24rem;
    width: calc((100% - 8rem) / 2)
  }

  .form-table.no-border .flex-txt-wrap .btn .square-border-btn {
    width: 100%;
  }
}

@media screen and (max-width: 1024px) {
  .inquiry-link-list ul {
    grid-template-columns: 1fr;
    gap: 24rem;
  }

  .inquiry-link-list ul li {
    aspect-ratio: auto;
  }

  .btn-wrap.mt-154 {
    margin-top: 80rem;
  }


}

/* 뉴스레터 */

.news-letter-link {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20rem;
  margin-bottom: 80rem;
}

.news-letter-cancel-link {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12rem;
  margin-top: 20rem;
}

.news-letter-cancel-link p {
  color: var(--Color-Gray-500);
  text-align: right;
  font-size: 16rem;
  font-weight: 500;
  line-height: 110%;
  letter-spacing: -0.32rem;
}

@media (width <=1024px) {
  .news-letter-link {
    flex-direction: column;
    align-items: flex-start;
  }
}



/* IR자료실 */

.txt-line-br:has(span) {
  display: flex !important;
  flex-direction: column;
}


/* IR 미팅 */

.ir-meeting {
  display: grid;
  grid-template-columns: repeat(2, 1fr);

}

.ir-meeting .left-box {
  width: 560rem;
  aspect-ratio: 1 / 1;
  padding: 48rem;
  background: url(/common/kr/images/img-ir-meeting.jpg) no-repeat center / cover;
  border-radius: 16rem;
  color: var(--Color-Gray-White);
  box-sizing: border-box;
  overflow: hidden;
}


.ir-meeting .right-box ul {
  display: flex;
  flex-direction: column;
  gap: 8rem;
  margin-top: 48rem;
}

.ir-meeting .right-box ul li {
  display: flex;
  align-items: flex-start;
  gap: 24rem;
}

.ir-meeting .right-box ul li>p {
  width: 90rem;
  color: var(--Color-Gray-800);
}

.ir-meeting .right-box ul li .mail-address a {
  color: var(--Color-Blue-Primary);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.ir-meeting .right-box ul li .address-num p {
  display: flex;
  align-items: flex-start;
  gap: 8rem;
}

.ir-meeting .right-box ul li .address-num p:first-child::before {
  content: "1)";
}

.ir-meeting .right-box ul li .address-num p:last-child::before {
  content: "2)";
}

.ir-meeting .right-box .btn-box {
  margin-top: 80rem;
}


@media (width <=1024px) {
  .ir-meeting {
    display: grid;
    grid-template-columns: 1fr;
    gap: 62rem;
  }

  .ir-meeting .left-box {
    width: 100%;
    padding: 23rem;
  }

  .ir-meeting .f-t3 {
    font-size: 28rem;
  }

  .ir-meeting .right-box ul {
    margin-top: 16rem;
  }

  .ir-meeting .right-box ul li {
    flex-direction: column;
    gap: 12rem;
  }

  .ir-meeting .right-box .f-t3 {
    font-size: 24rem;
  }
}



/* [ 지배구조 > 지배구조평가 > 기업지배구조헌장 ] */
.article-area .gray-border-swiper {
  margin-top: 32rem;
}

.article-area .gray-border-info {
  transition-delay: 0.6s
}

.article-area .cont-box:first-child {
  transition-delay: 0.6s
}

.form-table .bg-gray200 {
  background-color: var(--Color-Gray-50);
}


/* [ 지배구조 > 감사기구 ] */
.auditor-box {
  position: relative;
  padding: 80rem;
  border-radius: var(--border-radius-md);
  border: 1px solid var(--Color-Gray-300);
}

.auditor-box .logo {
  position: absolute;
  right: 80rem;
  top: 80rem;
  width: 156rem;
}

.auditor-box .logo img {
  width: 100%;
}

.auditor-box .info .name {
  color: var(--Color-Blue-Primary);
  margin-bottom: 16rem;
}

.auditor-box .info .tel {
  margin-top: 8rem;
}

.auditor-box .list-table {
  margin-top: 60rem;
}

@media (max-width: 1024px) {
  .auditor-box .logo {
    right: auto;
    top: auto;
    left: 32rem;
    bottom: 32rem;
    width: 100rem;
  }

  .auditor-box {
    padding: 32rem 24rem 172rem;
  }
}



/* [ 지배구조 > 계열사 ] */
.affiliate-main {
  position: relative;
  padding: 200rem 0;
  color: #fff;
}

.affiliate-main .tit-wrap .txt {
  margin-top: 16rem;
}

.affiliate-main .list-wrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 60rem;
  padding-right: 84rem;
}

.affiliate-main .list-wrap .list {
  display: grid;
  grid-template-columns: repeat(2, 205rem);
  gap: 106rem;
}

.affiliate-main .list-wrap .list .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.affiliate-main .list-wrap .list .item .name {
  margin-bottom: 8rem;
}

.affiliate-main .bg {
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  z-index: -1;
  width: 100vw;
  height: 100%;
  overflow: hidden;
}

.affiliate-main .bg img {
  position: relative;
  width: 100%;
  height: calc(100% + 220rem);
  object-fit: cover;
}

.affiliate-sub {
  display: flex;
  flex-direction: column;
  gap: 40rem;
}

.affiliate-sub .affi-div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.affiliate-sub .affi-div .blue-chk {
  flex-shrink: 0;
  padding-left: 24rem;
  color: var(--Color-Blue-Primary);
  background: url("/common/kr/images/icon-blue-check.svg") no-repeat top 3rem left / 16rem auto;
}

.affiliate-sub .affi-div .tit-wrap {
  width: 345rem;
}

.affiliate-sub .affi-div .tit-wrap .name {
  display: flex;
  justify-content: space-between;
  gap: 10rem;
  margin-bottom: 8rem;
}

.affiliate-sub .affi-div .tit-wrap .name .blue-chk {
  margin-top: 5rem;
}

.affiliate-sub .affi-div .tit-wrap .num {
  color: #003087;
}

.affiliate-sub .affi-div .list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16rem;
  width: 100%;
}

.affiliate-sub .affi-div .list .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  padding: 40rem;
  background-color: var(--Color-Blue-Light);
  border-radius: var(--border-radius-md);
  overflow: hidden;
}

.affiliate-sub .affi-div .list .item .name {
  display: flex;
  justify-content: space-between;
  gap: 10rem;
  margin-bottom: 8rem;
}

.affiliate-sub .item.full {
  padding: 40rem 44rem;
  width: 100%;
  border-radius: var(--border-radius-md);
  background: var(--Color-Blue-Primary);
  color: var(--Color-Gray-White);
}

@media all and (max-width: 1024px) {
  .affiliate-main {
    padding: 120rem 0 160rem;
  }

  .affiliate-main .list-wrap {
    margin-top: 87rem;
    padding: 0;
    width: 100%;
  }

  .affiliate-main .list-wrap .list {
    grid-template-columns: repeat(2, calc((100% - 12rem) / 2));
    gap: 40rem 12rem;
    width: 100%;
  }

  .affiliate-sub {
    gap: 60rem;
  }

  .affiliate-sub .affi-div {
    flex-direction: column;
    gap: 40rem;
  }

  .affiliate-sub .affi-div .tit-wrap {
    width: 100%;
  }

  .affiliate-sub .affi-div .list {
    gap: 8rem;
    width: 100%;
  }

  .affiliate-sub .affi-div .list .item {
    display: block;
    width: 100%;
    padding: 24rem;
  }

  .sub-page .cont-sec:not(:first-child) {
    margin-top: 80rem;
  }
}

@media all and (max-width: 600px) {
  .affiliate-sub .affi-div .list {
    grid-template-columns: repeat(1, 1fr);
  }
}


.form-textarea {
  position: relative;
}


.form-textarea .count-box {
  position: absolute;
  right: 16rem;
  bottom: 16rem;
  color: var(--Color-Gray-500);
}

.check-div .txt {
  margin-bottom: 20rem;
}

.check-div .f-b4-r {
  color: var(--Color-Gray-800);
}

.link-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12rem;
  margin-top: 20rem;
}

.link-contact p {
  display: flex;
  align-items: center;

}

.link-contact .img {
  display: flex;
}

.card-list:has(.annual) .item .txt-wrap .f-b4-r {
  margin-top: 8rem;
  color: var(--Color-Gray-700);
}

.sec-tit-wrap.fdr {
  flex-direction: column;
  align-items: flex-start;
  gap: 19rem;
}

.card-list.type02 .txt-wrap {
  display: block;
  padding: 32rem;
  border-radius: var(--border-radius-md);
  border: 1px solid var(--Color-Gray-300);
  transition: var(--transition-icon);
}

.card-list.type02 .txt-wrap:hover {
  border: 1px solid var(--Color-Blue-500);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.08);
}

.card-list.type02 .txt-wrap {
  display: flex;
  flex-direction: column;
  gap: 66rem;
  justify-content: space-between;
}

.card-list.type02 .txt-wrap .btn-area {
  display: flex;
  align-items: center;
  gap: 10rem;
  margin-left: auto;
}

.card-list.type02 .txt-wrap .date {
  color: var(--Color-Gray-700);
}

.card-list.type02 .txt-wrap a {
  width: 48rem;
  height: 48rem;
  flex-shrink: 0;
}

.card-list.type02 .txt-wrap .tit {
  margin-top: 16rem;
  -webkit-line-clamp: 1;
}

@media all and (max-width:600px) {
  .card-list.type02 .txt-wrap {
    gap: 40rem;
  }
}



/* 첨부파일 */
.file_box p {
  color: var(--Color-Gray-900);
}

.file_box {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start !important;
  padding: 24rem !important;
  gap: 40rem;
  border-radius: 2rem;
  background: var(--Color-Gray-100);
  margin-top: 24rem;
}

.file_box .thumb {
  height: 28.8rem;
  display: flex;
  align-items: center;
}

.file_box .thumb img {
  width: 24rem;
  height: 24rem;
  flex-shrink: 0;
}

.file_box>div {
  display: flex;
  align-items: center;
  gap: 8rem;
}

.file_box a {
  color: var(--Color-Gray-800);
}

@media all and (max-width:600px) {
  .file_box {
    flex-direction: column;
    gap: 24rem;
  }

  .file_box a {
    font-size: 15rem;
  }
  
}

/* 20260112 */

footer .certi{
  padding: 16rem 0;
  border-bottom: 1px solid var(--Color-Gray-200);
}
footer .certi .inner{
  display: flex;
  justify-content: flex-end;
  padding: 0;
}
footer .certi ul{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24rem;
}

@media all and (max-width:600px) {
  footer .certi ul{
  justify-content: space-between;
  }
}

#header nav .menu-list>li .two-menu-list .has-popup .two-dept::after {
  content: "";
  position: absolute;
  top: 18rem;
  right: 16rem;
  width: 16rem;
  height: 16rem;
  /*background: url("/common/kr/images/icon-txt-btn-arrow-black.svg") no-repeat center center / 100% auto;*/
  transition: background .2s ease;
}

#header nav .menu-list>li .two-menu-list>li.on.has-popup .two-dept {
  color: var(--Color-Gray-White);
  background-color: var(--Color-Green-Primary);
}
/*#header nav .menu-list>li .two-menu-list .on.has-popup .two-dept::after {
  background: url("/common/kr/images/icon-txt-btn-arrow-wht.svg") no-repeat center center / 100% auto;
}*/

header .popup-area {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background-color: #fff;
  z-index: 500;
  padding:48rem 0;
  width: 100%;
}

header .popup-area .inner .img{
  display: flex;
  justify-content: center;
}
header .popup-area .close{
  position: absolute;
  top: 60rem;
  right: 100rem;
  cursor: pointer;
}

.popup-dim {
  position: fixed;
  top:100px;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  z-index: 90;
  transition: opacity 0.3s;
}

.popup-dim.active {
  opacity: 1;
  visibility: visible;
}

.popup-area {
  position: fixed;
  z-index: 900;
  display: none;
}
/* 20260113 추가 */
.list-div .f-h2 {
  line-height: 110%;

}


@media all and (max-width:600px) {
  .count-list {
    gap: 30rem;
}
.shipping-top-count  .f-d1 {
  font-size: 40rem;
}
} 

@media all and (max-width:768px) {
  .popup-dim,
  .popup-area{
   display: none !important;
  }
} 
.global-sec .swiper-control.arrow48 .swiper-button-prev:hover {
  background-image: url("/common/kr/images/arrow0101.png");
}
.global-sec .swiper-control.arrow48 .swiper-button-next:hover {
  background-image: url("/common/kr/images/arrow0102.png");
}

/* 20260119 */
@media (min-width: 1024px) {
  .sub-count-list.ltsa .ml6{
    margin-left: -6px;
  }
}
#header .trsprnt {
  height: 53px;
}
#header nav .menu-list>li .two-menu-list>li.on.trsprnt .two-dept {
  color: none;
  background-color: transparent;
}

.accordion-wrap.faq-list  .accor-tit button {
  white-space: normal;
}