@import url(common.css);

html {
  overflow-x:hidden;
}
body {
  background: var(--color-white);
  transition: background 1s ease;
  overflow-x:hidden;
}

/* 공통 */
.title_wrap span {
  font-size: 1.6rem;
}

.title_wrap h3 {
  font-size: 7rem;
  font-weight: 500;
}

.inner {
  max-width: var(--inner-width);
  width: calc(100% - var(--inner-padding));
  margin: 0 auto;
}


/* main visual */

.main_visual .inner {
  position: relative;
  max-width: 100%;
  width: 100%;
}

.main_visual .hero_swiper {
  width: 100%;
  height: 100vh;
}

.main_visual .hero_swiper .swiper-wrapper {
  width: 100%;
  height: 100%;
}

.main_visual .hero_swiper .swiper-wrapper .swiper-slide {
  width: 100%;
  height: 100%;
  position: relative;
}

.main_visual .hero_swiper .swiper-wrapper .swiper-slide::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgb(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.main_visual .hero_swiper .swiper-wrapper .swiper-slide video,
.main_visual .hero_swiper .swiper-wrapper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main_visual .hero_swiper .autoplay-progress {
  display: none;
}

.main_visual .hero_title_wrap {
  visibility: hidden;
}

.main_visual .hero_title_wrap h2 {
  overflow: hidden;
}

.main_visual .hero_title_wrap .hero_char {
  display: inline-block;
}

.main_visual .hero_title_wrap {
  max-width: 172rem;

  width: calc(
    100% - clamp(12rem, 6vw, 20rem)
  );

  position: absolute;
  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%);

  z-index: 9;
}

.main_visual .hero_title_wrap p {
  font-size: 2rem;
  color: var(--color-white);
  margin-bottom: 2.4rem;
}

.main_visual .hero_title_wrap h2 {
  font-size: 8rem;
  font-weight: 500;
  color: var(--color-white);
}

.hero_cta {
  margin-top: 10rem;
  display: flex;
  gap: 2.4rem;
}

.hero_cta a {
  font-size: 2rem;
  padding: 1.6rem 5rem;
  border: 1px solid var(--color-white);
  color: var(--color-white);
  transition: 0.3s;
}

.hero_cta a.btn_white {
  background-color: var(--color-white);
  color: var(--color-text);
  display: inline-flex;
  align-items: center;
  position: relative;
  transition: 0.3s;
}

.hero_cta a.btn_white span {
  font-size: 2rem;
  transition: 0.3s;
}

.hero_cta a.btn_white img {
  position: absolute;
  right: 3rem;
  top: 50%;
  transform: translateY(-50%) translateX(-8px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--transition),
    transform var(--transition);
}

.main_visual .swiper-pagination {
  max-width: 172rem;
  width: calc(100% - 4rem) !important;
  position: absolute;
  left: 50%;
  bottom: 7.5rem;
  display: flex;
  gap: 1.2rem;
  z-index: 20;
  transform: translateX(-50%);
}

.main_visual .swiper-pagination-bullet {
  flex: 1;
  height: 6px;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 10px;
  opacity: 1;
  margin: 0 !important;
  overflow: hidden;
  position: relative;
}

.main_visual .swiper-pagination-bullet .progress {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-white);

  transform: scaleX(0);
  transform-origin: left center;
}

.main_visual .swiper-button-next, .main_visual .swiper-button-prev {
	color:#fff;
	width:3.6rem;
	height:3.6rem;
	opacity:0.8;
}
.main_visual .swiper-button-next {
	right:2rem;
}
.main_visual .swiper-button-prev {
	left:2rem;
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .hero_cta a:hover {
    transform: translateY(-.5rem);
    transition: 0.3s;
  }

  .hero_cta a.btn_line:hover {
    background-color: var(--color-white);
    color: var(--color-text);
  }

  .hero_cta a.btn_white:hover {
    padding-right: 7rem;
  }

  .hero_cta a.btn_white:hover img {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
  }
}







/* intro */
.intro {
  width: 100%;
  background-color: #eee;
  padding:25rem 0;
}

.intro .inner {
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  
}

.intro span {
  font-size: 2.4rem;
  margin-bottom: 5rem;
}

.intro h3 {
  font-size: 7rem;
  text-align: center;
  line-height: 1.4;
  font-weight: 600;
}

.intro h3 .line {
  background: linear-gradient(to right,
      var(--color-text) 50%,
      rgba(18, 18, 18, 0.18) 50%);
  background-size: 200% 100%;
  background-position-x: 100%;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}

.intro .btn_wrap {
  margin-top: 15rem;
}

.intro .btn_wrap a {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.6rem 3.2rem;
  font-size: 1.6rem;
  border: 1px solid var(--color-text);
  transition: 0.3s;
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .intro .btn_wrap a:hover {
    background-color: var(--color-text);
    color: var(--color-white);
    transition: 0.3s;
  }

  .intro .btn_wrap a:hover img {
    filter: invert(1) brightness(100%);
  }
}





/* how */
.how .inner {
  display: flex;
  flex-direction: column;
  row-gap: 8rem;
  margin: 30rem auto;
}

.how .title_wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.how .title_wrap .title {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.how .title_wrap .btn_wrap {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.6rem 3.2rem;
  border: 1px solid var(--color-text);
  transition: 0.3s;
}
.how .title_wrap .btn_wrap span {
  line-height:1;
}
.how .cont_wrap {
  display: flex;
  justify-content: space-between;
}

.how .cont_left {
  width: 32.55%;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.how .cont_left li {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  height:19rem;
  border: 1px solid var(--color-line);
  border-radius: 2rem;
  padding: 2.4rem 3rem;
  transition:
    background-color 0.2s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}

.how .cont_left li.active {
  background-color: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}

.how .cont_left li span {
  font-size: 1.6rem;
}

.how .cont_left li strong {
  font-size: 2.4rem;
  font-weight: 500;
  transition: font-size 0.3s ease;
}

.how .cont_left li.active strong {
  font-size: 3.6rem;
}

.how .cont_left li p {
  font-size: 1.6rem;
}

.how .cont_right {
  width: 61%;
}

.how .cont_right .img_list {
  position: relative;
  height: 60rem;
  overflow: hidden;
  border-radius: 2rem;
}

.how .cont_right .img_list .list_item {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(3rem);
  transition:
    opacity 0.7s ease,
    transform 0.9s ease,
    visibility 0.7s ease;
  cursor: pointer;
}

.how .cont_right .list_item.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  z-index: 2;
}

.how .cont_right .list_item .img_wrap {
  border-radius: 2rem;
  overflow: hidden;
  height: 60rem;
}

.how .cont_right .list_item .img_wrap::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.9) 100%);
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 2rem;
}

.how .cont_right .list_item .img_wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.how .cont_right .list_item .desc_wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  padding: 4rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.how .cont_right .desc_wrap .desc_top span {
  font-size: 2rem;
  color: var(--color-white);
}

.how .cont_right .desc_wrap .desc_top h5 {
  font-size: 4.5rem;
  color: var(--color-white);
}

.how .cont_right .desc_wrap .desc_bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.how .cont_right .desc_bottom .desc_bottom_left {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.how .cont_right .desc_bottom .desc_bottom_left li {
  font-size: 1.4rem;
  color: var(--color-white);
  padding: .4rem 1rem;
  border: 1px solid var(--color-white);
  border-radius: 10rem;
}

.how .cont_right .desc_bottom .desc_bottom_right {
  width: clamp(20rem, 25.77%, 28rem);
  flex-shrink: 0;
  padding: 1.6rem 2rem;
  border: 1px solid #333;
  display: flex;
  flex-direction: column;
}

.how .cont_right .desc_bottom .desc_bottom_right span {
  font-size: 1.2rem;
  color: #777;
  border-bottom: 1px solid #777;
  margin-bottom: .8rem;
  padding-bottom: .8rem;
}

.how .cont_right .desc_bottom .desc_bottom_right .output {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 1.2rem;
}

.how .cont_right .desc_bottom .desc_bottom_right .output li {
  font-size: 1.6rem;
  color: var(--color-white);
}

.how .cont_right .desc_bottom .desc_bottom_right .output li:first-child {
  color: #777;
}

.how .cont_right .desc_bottom .desc_bottom_right .output li.color {
  color: #4ADE80;
  position: relative;
}

.how .cont_right .desc_bottom .desc_bottom_right .output li.color::before {
  content: '';
  display: block;
  width: .8rem;
  height: .8rem;
  border-radius: 50%;
  background-color: #4ADE80;
  position: absolute;
  top: 50%;
  left: -1.2rem;
  transform: translateY(-50%);
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .how .title_wrap .btn_wrap:hover {
    background-color: var(--color-text);
    color: var(--color-white);
    transition: 0.3s;
  }

  .how .title_wrap .btn_wrap:hover img {
    filter: invert(1) brightness(100%);
  }

  .how .cont_left li:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
  }
}



/* solution */
.solution .inner {
  display: flex;
  flex-direction: column;
  gap: 8rem;
}

.solution .title_wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.solution .title_wrap .title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.solution .title_wrap .title p {
  font-size: 2.4rem;
  text-align: right;
}

.solution .cont_wrap {
  display: flex;
  gap: 10rem;
  align-items: center;
}

.solution .sol_img_list {
  width: 62%;
  height: 50rem;
}

.solution .sol_img_list .img_list_item {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.solution .img_list_item .img_wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4rem) scale(1.03);
  transition:
    opacity 0.6s ease,
    transform 1s ease,
    visibility 0.6s ease;
}

.solution .img_list_item .img_wrap.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  z-index: 2;
}

.solution .img_list_item .img_wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.solution .sol_desc_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.solution .desc_list_item a {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  cursor: pointer;
  transition: transform 0.4s ease;
}

.solution .desc_list_item .icon_wrap img {
  display: block;
  object-fit: cover;
}

.solution .desc_list_item .icon_wrap img.default {
  display: block;
}

.solution .desc_list_item .icon_wrap img.hover {
  display: none;
}

.solution .desc_list_item .text_wrap {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}

.solution .desc_list_item .text_wrap strong {
  font-size: 2.4rem;
  font-weight:500;
  color: #bdbdbd;
}

.solution .desc_list_item .text_wrap p {
  font-size: 1.6rem;
  color: #bdbdbd;
}

.solution .desc_list_item.active {
  transform: translateY(-0.6rem);
}

.solution .desc_list_item .text_wrap strong,
.solution .desc_list_item .text_wrap p {
  transition: color 0.4s ease;
}

.solution .desc_list_item.active .text_wrap strong,
.solution .desc_list_item.active .text_wrap p {
  color: var(--color-text);
}

.solution .desc_list_item.active .icon_wrap img.hover {
  display: block;
}

.solution .desc_list_item.active .icon_wrap img.default {
  display: none;
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .solution .desc_list_item a:hover .icon_wrap img.default {
    display: none;
  }

  .solution .desc_list_item a:hover .icon_wrap img.hover {
    display: block;
  }

  .solution .desc_list_item a:hover .text_wrap strong,
  .solution .desc_list_item a:hover .text_wrap p {
    color: var(--color-text);
  }
}



/* package */
.package {
  position: relative;
  overflow: visible;
}

.package .inner {
  margin: 30rem auto;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.package .package_bg {
	position:absolute;
	top:40%;
	left:-20%;
	transform:rotate(-77.18deg);
	z-index:-1;
}
.package .title_wrap {
  width: fit-content;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: sticky;
  top: 14rem;
  height: fit-content;
}

.package .cont_wrap {
  width: 52%;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  overflow-x: clip;
  overflow-y: visible;
}

.package .cont_wrap .cont_list {
  display: flex;
  flex-direction: column;
  row-gap: 5rem;
  padding: 4rem 0;
  align-items: center;
  position: relative;
}

.package .cont_list .cont_item a {
  padding: 4rem;
  display: flex;
  align-items: center;
  background-color: #eee;
  gap: 4rem;
  will-change: transform;
  transition: 0.3s;
}

.package .cont_item a .img_wrap {
  width: 17rem;
  height: 17rem;
  flex-shrink: 0;
}

.package .cont_item a .img_wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.package .cont_item a .text_wrap {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  justify-content: center;
}

.package .cont_item a .text_wrap span {
  font-size: 3rem;
  font-weight: 500;
}

.package .cont_item a .text_wrap p {
  font-size: 1.6rem;
  line-height: 1.5;
}

.package .cont_item a .btn_wrap {
  width: 2.4rem;
  height: 2.4rem;
  display: flex;
  justify-content: flex-end;
  flex-shrink: 0;
}

.package .cont_item a .btn_wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.package .cont_wrap>.btn_wrap a {
  display: inline-flex;
  justify-content: center;
  align-items:center;
  gap: 1rem;
  padding: 1.6rem 3.2rem;
  margin-top: 30px;
  border: 1px solid var(--color-text);
  transition: 0.3s;
}

.package .cont_wrap .btn_wrap a span {
  font-size: 1.6rem;
  line-height:1;
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .package .cont_wrap>.btn_wrap a:hover {
    background-color: var(--color-text);
    color: var(--color-white);
    transition: 0.3s;
  }

  .package .cont_wrap>.btn_wrap:hover a img {
    filter: invert(1) brightness(100%);
  }

  .package .cont_item a:hover .btn_wrap img {
    filter: invert(1) brightness(100%);
  }

  .package .cont_item a:hover {
    background-color: var(--color-primary);
    transition: 0.3s;
  }

  .package .cont_item a:hover .text_wrap span {
    color: var(--color-white);
  }

  .package .cont_item a:hover .text_wrap p {
    color: var(--color-white);
  }
}




/* global */
.global .inner {
  padding: 10rem 0;
  display: flex;
  flex-direction: column;
  gap: 10rem;
  position: relative;
  z-index: 1;
}

.global .title_wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

.global .title_wrap span {
  color: var(--color-white);
}

.global .title_wrap h3 {
  color: var(--color-white);
}

.global .world_map {
  position: relative;
  width:100%;
}

.global .world_map .img_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  z-index:2;
  width:100%;
}

.global .world_map .img_wrap img {
  display: block;
  width:100%;
  height:auto;
  object-fit: cover;
  opacity:0.6;
}

.global .world_map .country {
  position:absolute;
  width:2.8rem;
  height:2.8rem;
  transform:translate(-50%, -50%);
  z-index:5;
  pointer-events:auto;
}

.global .world_map .dongguan {
  top: 49%;
  right: 19.3%;
}

.global .world_map .vietnam02 {
  top: 52%;
  right: 22.5%;
}

.global .world_map .indonesia {
  top: 67%;
  right: 22%;
}

.global .world_map .vietnam {
  top: 57.5%;
  right: 22.5%;
}

.global .world_map .usa {
  top: 39%;
  right: 72.5%;
}

.global .world_map .korea {
  top: 42%;
  right: 16%;
}
.global .world_map .semarang {
  top: 68%;
  right: 20%;
}
.global .world_map .oregon {
  top: 36%;
  right: 85.7%;
}
.global .world_map .seoul {
  top: 40%;
  right: 16.5%;
}
.global .world_map .country .icon_wrap {
  width:100%;
  height:100%;
  position:relative;
  z-index:2;
  cursor:pointer;
}
.global .world_map .country .icon_wrap img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

.global .world_map .text_wrap {
  position:absolute;
  left:50%;
  bottom:calc(100% + .8rem);
  transform:translateX(-50%);
  z-index:10;
  pointer-events:none;
}

.global .world_map .text_wrap a {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  min-height:4rem;
  padding:.8rem 4rem .8rem 1.8rem;
  border-radius:1rem;
  background:#fff;
  opacity:0;
  visibility:hidden;
  transform:translateY(.5rem);
  transition:opacity .35s ease, transform .35s ease, visibility .35s ease;
  pointer-events:none;
}
.global .world_map .country:hover .text_wrap,
.global .world_map .country:focus-within .text_wrap {
  pointer-events:auto;
}
.global .world_map .country:hover .text_wrap a,
.global .world_map .country:focus-within .text_wrap a {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}

.global .world_map .text_wrap span {
  display:block;
  font-size:1.8rem;
  line-height:1.2;
  text-align:center;
  white-space:nowrap;
}
.global .world_map .text_wrap img {
  position:absolute;
  right:1.2rem;
  top:50%;
  transform:translateY(-50%);
}
.global .global_desc {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 4rem;
}

.global .global_desc li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 4rem 4rem 3rem;
  border-radius: 1rem;
  background-color: var(--color-white);
  flex: 1;
  height: 35rem;
}

.global .global_desc li span {
  font-size: 3rem;
}

.global .global_desc li .count_wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.global .global_desc li .count_wrap strong {
  font-size: 15rem;
  font-weight: 300;
}

.global .global_desc li .count_wrap strong.plus {
  position: relative;
}

.global .global_desc li .count_wrap strong.plus::after {
  content: '+';
  display: block;
  position: absolute;
  top: 50%;
  right: clamp(-8rem,8vw,-10rem);
  transform: translateY(-50%);
}

.global .global_desc li .count_wrap p {
  font-size: 5rem;
  margin-bottom: 1rem;
}

.mobile_location_nav {
  display:none;
}

.global .world_map .map_canvas {
  position:relative;
  width:100%;
  transform-origin:0 0;
}


@media (hover:hover) and (pointer:fine) {
  .global .world_map .country::before {
    content:'';
    position:absolute;
    left:50%;
    bottom:100%;
    width:6rem;
    height:1.2rem;
    transform:translateX(-50%);
    z-index:1;
  }

  .global .world_map .country:hover .text_wrap {
    pointer-events:auto;
  }

  .global .world_map .country:hover .text_wrap a {
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    pointer-events:auto;
  }
}







/* logo */
.logo_sec {
  width: 100%;
  overflow: hidden;
  padding: 12rem 0;
}

.logo_sec .inner {
  max-width: none;
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 10rem;
}

.logo_sec .logo_line01,
.logo_sec .logo_line02 {
  width: max-content;
  display: flex;
  align-items: center;
  gap: 20rem;
  flex-shrink: 0;
}

.logo_sec .inner li {
  width: 30rem;
  height: 8rem;
  flex-shrink: 0;
}

.logo_sec .inner li img {
  width: 100%;
  height: 4rem;
  display: block;
  object-fit: contain;
  opacity: 0.5;
  transition: opacity 0.3s;
}

.logo_sec .inner li img.cresyn {
  filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(230deg) brightness(120%) contrast(0%);
}




/* news */
.news .inner {
  padding: 15rem 0 30rem;
  display: flex;
  flex-direction: column;
  gap: 10rem;
  position: relative;
}

.news .title_wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.news .title_wrap .title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.news .title_wrap span {
  color: var(--color-white);
  line-height:1;
}

.news .title_wrap h3 {
  color: var(--color-white);
}

.news .title_wrap .btn_wrap a {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.6rem 3.2rem;
  border: 1px solid var(--color-white);
  transition: 0.3s;
}

.news .title_wrap .btn_wrap img {
  filter: invert(1) brightness(100%);
}

.news .swiper {
  width: 100%;
  position: static;
  overflow: visible;
}

.news .swiper .swiper-button-prev {
  left: -6rem;
}

.news .swiper .swiper-button-next {
  right: -6rem;
}

.news .swiper .swiper-button-prev::slotted(svg),
.news .swiper .swiper-button-prev svg,
.news .swiper .swiper-button-prev svg path,
.news .swiper .swiper-button-next::slotted(svg),
.news .swiper .swiper-button-next svg,
.news .swiper .swiper-button-next svg path {
  fill: var(--color-white);
}

.news .swiper .swiper-pagination-horizontal {
  position: absolute;
  top: auto;
  bottom: -5rem;
  left: 0;
  z-index: 20;
}

.news .swiper .swiper-pagination-horizontal .swiper-pagination-progressbar-fill {
  background: var(--color-white);
  border-radius: 10rem;
}

.news .swiper .swiper-slide {
  height: 55rem;
  border-radius: 1rem;
  overflow: hidden;
}
.news .swiper .swiper-slide > a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  color: inherit;
}
.news .news_swiper .swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.news .news_swiper .swiper-slide-visible {
  opacity: 1;
  pointer-events: auto;
}
.news .swiper .swiper-pagination-progressbar-fill {
  background: var(--color-white);
}

.news .swiper .swiper-slide .img_wrap {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: var(--color-white);
  display: flex;
  justify-content: center;
  align-items: center;
}

.news .swiper .swiper-slide .img_wrap::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%);
  position: absolute;
  top: 0;
  left: 0;
}

.news .swiper .swiper-slide .img_wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.news .swiper .swiper-slide .img_wrap.logo img {
  object-fit: contain;
  width: 80%;
}

.news .swiper .swiper-slide .news_title {
  width: 90%;
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  color: var(--color-white);
  z-index: 2;
  font-size: 2.4rem;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.news .news_empty {
  width: 100%;
  min-height: 40rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.news .news_empty p {
  font-size: 2rem;
  color: rgba(255, 255, 255, 0.65);
  text-align: center;
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .news .title_wrap .btn_wrap a:hover {
    background-color: var(--color-white);
    transition: 0.3s;
  }

  .news .title_wrap .btn_wrap a:hover span {
    color: var(--color-text);
  }

  .news .title_wrap .btn_wrap a:hover img {
    filter: invert(0) brightness(0);
  }
}



/* contact */
.contact .inner {
  max-width: none;
  width: calc(100% - 8rem);
  margin: 0 auto;
  padding: 10rem;
  border-radius: 5rem;
  background-color: var(--color-white);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15rem;
}

.contact .contact_cont {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.contact .title_wrap {
  display: flex;
  flex-direction: column;
  gap: 8rem;
}

.contact .title_wrap p {
  font-size: 3rem;
  line-height: 1.5;
}

.contact .title_wrap .title {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.contact .form_wrap {
  width: 41.66%;
}

.contact .form_wrap form {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.contact .form_wrap form .form_item {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.contact .form_item label {
  font-size: 2rem;
}

.contact .form_item label .required {
  color: #FF6B35;
}

.contact .form_item input {
  height: 5rem;
  border-radius: .5rem;
  background-color: var(--color-gray);
  font-size: 1.6rem;
  padding: 1.6rem 2rem;
}

.contact .form_item textarea {
  height: 20rem;
  border-radius: .5rem;
  background-color: var(--color-gray);
  resize: none;
  font-size: 1.6rem;
  padding: 1.6rem 2rem;
}

.contact .form_item span {
  font-size: 2rem;
}

.contact .form_wrap form .form_item.checkbox {
  flex-direction: row;
  align-items: center;
  gap: 1rem;
}

.contact .form_item.checkbox input {
  height: auto;
}

.contact .form_item.select .country_sel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  width: 100%;
  height: 5rem;
  border-radius: .5rem;
  background-color: var(--color-gray);

}

.contact .form_item.select .country_sel li {
  font-size: 2rem;
}

.contact .submit_btn {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.6rem 3.2rem;
  border: 1px solid var(--color-text);
  transition: 0.3s;
}

.contact .submit_btn span {
  font-size: 2.2rem;
  line-height: 1;
}

.contact input,
.contact textarea {
  border: 1px solid transparent;
  transition: 0.3s;
}

.contact input:focus,
.contact textarea:focus {
  border-color: var(--color-primary);
  background-color: var(--color-white);
  outline: none;
}

.contact input[type="checkbox"] {
  accent-color: var(--color-primary);
  cursor: pointer;
}



.country_sel,
.family_sel {
  position: relative;
  width: 100%;
  cursor: pointer;
}

/* 문의하기 select */
.country_sel .select_ex {
  height: 5rem;
  padding: 0 2rem;

  display: flex !important;
  align-items: center;
  justify-content: space-between;

  border-radius: .5rem;
  background: var(--color-gray);

  color: #999;

  position: relative;
  z-index: 3;

  transition: 0.3s;
}

/* 선택 완료 시 */
.country_sel.selected .select_ex {
  color: var(--color-text);
}

/* 패밀리사이트 */
.family_sel .select_ex {
  height: 5rem;
  padding: 0 2rem;

  display: flex !important;
  align-items: center;
  justify-content: space-between;

  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: .5rem;

  background: transparent;
  color: var(--color-white);

  position: relative;
  z-index: 3;
}

/* 패밀리사이트 dropdown */
.family_sel .option_list {
  background: var(--color-primary);
  border: 1px solid var(--color-white);
}

.family_sel .option_list li {
  color: var(--color-white);
}

/* 드롭다운 */
.option_list {
  position: absolute;
  top: 100%;
  left: 0;

  width: 100%;

  background: var(--color-gray);
  border-radius: .5rem;

  overflow: hidden;

  opacity: 0;
  visibility: hidden;

  transform: translateY(-10px);

  transition:
    opacity .3s,
    transform .3s;

  z-index: 10;
}

.option_list li {
  padding: 1.6rem 2rem;
  transition: .3s;
}

/* 열림 */
.country_sel.open .option_list,
.family_sel.open .option_list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.country_sel .select_ex,
.family_sel .select_ex {
  transition: 0.3s;
  border: 1px solid transparent;
}

/* 열렸을 때 */
.country_sel.open .select_ex {
  border-color: var(--color-primary);
}

/* 패밀리 사이트 */
.family_sel.open .select_ex {
  border-color: var(--color-white);
}

.country_sel .option_list {
  border: 1px solid transparent;
}

.country_sel.open .option_list {
  border-color: var(--color-primary);
}

.family_sel.open .option_list {
  border-color: var(--color-white);
}

.country_sel.open .select_ex img,
.family_sel.open .select_ex img {
  transform: rotate(180deg);
}

.country_sel .select_ex img,
.family_sel .select_ex img {
  transition: 0.3s;
}
/* 메인 Contact 국가선택 */
.contact .country_sel .option_list {
  display: none;

  opacity: 1;
  visibility: visible;
  transform: none;

  position: absolute;
  top: 100%;
  left: 0;

  width: 100%;

  background-color: var(--color-gray);
  border: 1px solid var(--color-primary);
  border-radius: .5rem;

  overflow: hidden;
  z-index: 100;
}

.contact .country_sel .option_list li {
  padding: 1.6rem 2rem;
  font-size: 2rem;
  cursor: pointer;
}

.contact .country_sel.open .select_ex {
  border-color: var(--color-primary);
}

.contact .country_sel.open .select_ex img {
  transform: rotate(180deg);
}

.contact .country_sel.selected .select_ex {
  color: var(--color-text);
}

@media (hover:hover) and (pointer:fine) and (min-width:1025px) {
  .contact .submit_btn:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
    transition: 0.3s;
  }

  .contact .submit_btn:hover img {
    filter: invert(1) brightness(100%);
  }

  .option_list li:hover {
    background: #e9e9e9;
  }

  .family_sel .option_list li:hover {
    background: rgba(255, 255, 255, 0.08);
  }
}

html {
  width: 100%;
  height: auto;
  overflow-x: hidden;
  overflow-y: auto;
}

body {
  width: 100%;
  min-height: 100%;
  height: auto;
  overflow-x: hidden;
}


/* =========================
   Responsive
========================= */
@media (max-width: 1280px) {
  .title_wrap h3 {
    font-size: 5.8rem;
  }

  .main_visual .hero_title_wrap h2 {
    font-size: 8rem;
  }

  .intro h3 {
    font-size: 5.8rem;
  }

  .how .inner,
  .package .inner {
    margin-top: 20rem;
    margin-bottom: 20rem;
  }

  .solution .cont_wrap {
    gap: 6rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size: 11rem;
  }

  .global .global_desc li .count_wrap p {
    font-size: 3.6rem;
  }

  .contact .inner {
    padding: 8rem 6rem;
  }
}

@media (max-width: 1024px) {
  .title_wrap h3 {
    font-size: 5rem;
  }

  .main_visual .hero_title_wrap h2 {
    font-size: 6.8rem;
    line-height: 1.12;
  }

  .hero_cta {
    margin-top: 6rem;
  }

  .intro {
    padding: 18rem 0;
  }

  .intro h3 {
    font-size: 4.8rem;
  }

  .intro .btn_wrap {
    margin-top: 8rem;
  }

  .how .inner {
    margin: 16rem auto;
    row-gap: 5rem;
  }

  .how .cont_wrap {
    flex-direction: column;
    gap: 3rem;
  }

  .how .cont_left {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
  }

  .how .cont_left li {
    height: auto;
    min-height: 17rem;
  }

  .how .cont_left li.active strong {
    font-size: 3rem;
  }

  .how .cont_right {
    width: 100%;
  }

  .how .cont_right .img_list,
  .how .cont_right .list_item .img_wrap {
    height: 56rem;
  }

  .how .cont_right .desc_bottom .desc_bottom_right {
    width: 34%;
  }

  .solution .inner {
    gap: 5rem;
  }

  .solution .title_wrap .title {
    gap: 4rem;
  }

  .solution .title_wrap .title p {
    font-size: 2rem;
  }

  .solution .cont_wrap {
    flex-direction: column;
    gap: 4rem;
  }

  .solution .sol_img_list {
    width: 100%;
    height: 44rem;
  }

  .solution .sol_desc_list {
    width: 100%;
  }

  .package .inner {
    margin: 16rem auto;
    flex-direction: column;
    gap: 5rem;
  }

  .package .title_wrap {
    position: static;
  }

  .package .cont_wrap {
    width: 100%;
  }

  .package .cont_wrap .cont_list {
    width: 100%;
    padding: 0;
    row-gap: 2rem;
  }

  .package .cont_list .cont_item {
    width: 100%;
  }

  .package .package_bg {
    top: 20%;
    left: -35%;
    opacity: .5;
  }

  .global .inner {
    gap: 7rem;
  }

  .global .world_map .img_wrap img {
    width: 100%;
    height: auto;
  }

  .global .world_map .text_wrap a {
    padding: .6rem 1.2rem;
  }

  .global .world_map .text_wrap span {
    font-size: 1.6rem;
  }

  .global .global_desc {
    gap: 1.5rem;
  }

  .global .global_desc li {
    height: 20rem;
    padding: 3rem 2.4rem;
  }

  .global .global_desc li span {
    font-size: 2.2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size: 8rem;
  }

  .global .global_desc li .count_wrap strong.plus::after {
    right: -5rem;
  }

  .global .global_desc li .count_wrap p {
    font-size: 2.6rem;
  }

  .logo_sec {
    padding: 10rem 0;
  }

  .logo_sec .inner {
    row-gap: 7rem;
  }

  .logo_sec .logo_line01,
  .logo_sec .logo_line02 {
    gap: 10rem;
  }

  .logo_sec .inner li {
    width: 22rem;
  }

  .news .inner {
    padding: 12rem 0 20rem;
    gap: 7rem;
  }

  .news .swiper .swiper-slide {
    height: 45rem;
  }

  .news .swiper .swiper-button-prev {
    left: 1rem;
  }

  .news .swiper .swiper-button-next {
    right: 1rem;
  }

  .contact .inner {
    width: calc(100% - 4rem);
    padding: 7rem 5rem;
    border-radius: 3rem;
    gap: 8rem;
  }

  .contact .contact_cont {
    flex-direction: column;
    gap: 6rem;
  }

  .contact .title_wrap {
    gap: 3rem;
  }

  .contact .title_wrap p {
    font-size: 2.4rem;
  }

  .contact .form_wrap {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .inner {
    width: calc(100% - 4rem);
  }

  .title_wrap span {
    font-size: 1.6rem;
  }

  .title_wrap h3 {
    font-size: 3.6rem;
    line-height: 1.15;
  }

  .main_visual .hero_swiper {
    height: 100svh;
    min-height: 64rem;
  }

  .main_visual .hero_title_wrap {
    width: calc(100% - 4rem);
	top:auto;
	bottom:8rem;
	transform:translate(-50%, 0);
  }

  .main_visual .hero_title_wrap p {
    margin-bottom: 1.6rem;
    font-size: 1.6rem;
  }

  .main_visual .hero_title_wrap h2 {
    font-size: clamp(4rem, 11vw, 5.2rem);
    line-height: 1.08;
  }

  .hero_cta {
    margin-top: 5rem;
    gap: 1rem;
  }

  .hero_cta a,
  .hero_cta a.btn_white span {
    font-size: 1.6rem;
  }

  .hero_cta a {
    padding: 1.4rem 2.4rem;
  }

  .main_visual .swiper-pagination {
    width:calc(100% - 12rem) !important;
    left:2rem;
    right:auto;
    bottom:3rem;
    transform:none;
    gap:.8rem;
  }

  .main_visual .swiper-pagination-bullet {
    height: 4px;
  }

  .main_visual .swiper-button-prev,
  .main_visual .swiper-button-next {
    display:flex;
    top:auto;
    bottom:2.2rem;
    width:2.4rem;
    height:2.4rem;
    margin:0;
    color:#fff;
    opacity:.8;
    z-index:21;
    transform:none;
  }

  .main_visual .swiper-button-prev::after,
  .main_visual .swiper-button-next::after {
    font-size:1.8rem;
    font-weight:300;
  }

  .main_visual .swiper-button-prev {
    left:auto;
    right:5.5rem;
  }

  .main_visual .swiper-button-next {
    left:auto;
    right:1.5rem;
  }

  .intro {
    padding: 10rem 0;
  }

  .intro span {
    margin-bottom: 3rem;
    font-size: 1.6rem;
  }

  .intro h3 {
    font-size: 3.2rem;
    line-height: 1.35;
  }

  .intro h3 br {
    display: none;
  }

  .intro .btn_wrap {
    margin-top: 6rem;
  }

  .how .inner {
    margin: 10rem auto;
    row-gap: 4rem;
  }

  .how .title_wrap {
    gap: 2rem;
  }

  .how .title_wrap .btn_wrap {
    padding: 1.2rem 2rem;
  }

  .how .cont_left {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .how .cont_left li {
    min-height: 0;
    padding: 2rem;
    border-radius: 1.2rem;
  }

  .how .cont_left li strong,
  .how .cont_left li.active strong {
    font-size: 2.4rem;
  }

  .how .cont_left li p {
    line-height: 1.5;
  }

  .how .cont_right .img_list,
  .how .cont_right .list_item .img_wrap {
    height: 50rem;
    border-radius: 1.2rem;
  }

  .how .cont_right .list_item .desc_wrap {
    padding: 2.4rem;
  }

  .how .cont_right .desc_wrap .desc_top span {
    font-size: 1.6rem;
  }

  .how .cont_right .desc_wrap .desc_top h5 {
    margin-top: .6rem;
    font-size: 3.2rem;
  }

  .how .cont_right .desc_wrap .desc_bottom {
    flex-direction: column;
    align-items: stretch;
    gap: 2rem;
  }

  .how .cont_right .desc_bottom .desc_bottom_left {
    flex-wrap: wrap;
  }

  .how .cont_right .desc_bottom .desc_bottom_right {
    width: 100%;
  }

  .solution .inner {
    gap: 4rem;
  }

  .solution .title_wrap .title {
    flex-direction: column;
	align-items:flex-start;
    gap: 2rem;
  }

  .solution .title_wrap .title p {
    font-size: 1.6rem;
    line-height: 1.5;
    text-align: left;
  }

  .solution .title_wrap .title p br {
    display: none;
  }

  .solution .sol_img_list {
    height: 30rem;
  }

  .solution .sol_desc_list {
    grid-template-columns: 1fr;
  }

  .solution .desc_list_item {
    border-bottom: 1px solid var(--color-line);
  }

  .solution .desc_list_item.active {
    transform: none;
  }

  .solution .desc_list_item a {
    padding: 2rem 0;
  }

  .solution .desc_list_item .text_wrap strong {
    font-size: 2rem;
  }

  .package .inner {
    margin: 10rem auto;
    gap: 4rem;
  }

  .package .package_bg {
    display: none;
  }

  .package .cont_wrap .cont_list {
    row-gap: 1.2rem;
  }

  .package .cont_list .cont_item a {
    gap: 2rem;
    padding: 2rem;
  }

  .package .cont_item a .img_wrap {
    width: 11rem;
    height: 11rem;
  }

  .package .cont_item a .text_wrap {
    gap: 1rem;
  }

  .package .cont_item a .text_wrap span {
    font-size: 2.2rem;
  }

  .package .cont_item a .text_wrap p {
    font-size: 1.6rem;
  }

  .package .cont_item a .btn_wrap {
    width: 2rem;
    height: 2rem;
  }

  .package .cont_wrap > .btn_wrap a {
    margin-top: 2rem;
  }

  .global .inner {
    padding: 8rem 0;
    gap: 5rem;
  }

  .global .title_wrap {
    text-align: center;
  }

  .global .world_map {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .global .world_map .img_wrap {
    grid-column: 1 / -1;
    margin-bottom: 2rem;
  }

  .global .world_map .country,
  .global .world_map .dongguan,
  .global .world_map .vietnam02,
  .global .world_map .indonesia,
  .global .world_map .vietnam,
  .global .world_map .usa,
  .global .world_map .korea {
    position: static;
    display: block;
    pointer-events: auto;
  }

  .global .world_map .country .icon_wrap {
    display: none;
  }

  .global .world_map .text_wrap {
    width: 100%;
    pointer-events: auto;
  }

  .global .world_map .text_wrap a {
    width: 100%;
    min-height: 6rem;
    padding: 1.2rem;
    opacity: 1;
    visibility: visible;
    transform: none;
    white-space: normal;
    justify-content: space-between;
  }

  .global .world_map .text_wrap span {
    font-size: 1.6rem;
    line-height: 1.35;
  }

  .global .global_desc {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .global .global_desc li {
    height: auto;
    min-height: 16rem;
    padding: 2.4rem;
  }

  .global .global_desc li span {
    font-size: 1.8rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size: 6rem;
  }

  .global .global_desc li .count_wrap strong.plus::after {
    right: -3.5rem;
  }

  .global .global_desc li .count_wrap p {
    margin-bottom: .5rem;
    font-size: 2rem;
  }

  .logo_sec {
    padding: 7rem 0;
  }

  .logo_sec .inner {
    row-gap: 5rem;
  }

  .logo_sec .logo_line01,
  .logo_sec .logo_line02 {
    gap: 6rem;
  }

  .logo_sec .inner li {
    width: 16rem;
    height: 5rem;
  }

  .logo_sec .inner li img {
    height: 3rem;
  }

  .news .inner {
    padding: 10rem 0 14rem;
    gap: 5rem;
  }

  .news .title_wrap .title {
    flex-direction: column;
    align-items: flex-start;
    gap: 2.4rem;
  }
  .news .title_wrap .title .btn_wrap {
    margin-left:auto;
  }
  .news .title_wrap .btn_wrap a {
    padding: 1.2rem 2rem;
  }

  .news .swiper .swiper-slide {
    height: 38rem;
  }

  .news .swiper .swiper-button-prev,
  .news .swiper .swiper-button-next {
    display: none;
  }

  .news .swiper .swiper-pagination-horizontal {
    bottom: -3rem;
  }

  .news .swiper .swiper-slide .news_title {
    font-size: 2rem;
  }

  .news .news_empty {
    min-height: 25rem;
  }

  .contact .inner {
    width: calc(100% - 4rem);
    padding: 5rem 2rem;
    border-radius: 2rem;
    gap: 5rem;
  }

  .contact .contact_cont {
    gap: 5rem;
  }

  .contact .title_wrap {
    gap: 2rem;
  }

  .contact .title_wrap p {
    font-size: 1.8rem;
  }

  .contact .title_wrap p br {
    display: none;
  }

  .contact .form_wrap form {
    gap: 2rem;
  }

  .contact .form_wrap form .form_item {
    gap: 1rem;
  }

  .contact .form_item label,
  .contact .form_item span {
    font-size: 1.6rem;
  }

  .contact .form_item textarea {
    height: 16rem;
  }

  .contact .form_wrap form .form_item.checkbox {
    align-items: flex-start;
  }

  .contact .form_item.checkbox label {
    line-height: 1.5;
  }

  .contact .country_sel .option_list li {
    padding: 1.4rem 1.6rem;
    font-size: 1.6rem;
  }

  .contact .submit_btn {
    width: 100%;
    justify-content: center;
  }

  .contact .submit_btn span {
    font-size: 1.8rem;
  }
}

@media (max-width: 480px) {
  .how .title_wrap {
    flex-direction:column;
	gap:0;
  }
  .how .title_wrap .btn_wrap {
    padding:0.8rem 1.2rem;
  }
  .how .inner {
    gap:2rem;
  }
  .hero_cta a {
    padding: 1.2rem 2.4rem;
  }

  .hero_cta a {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .package .cont_list .cont_item a {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr) 2rem;
    gap: 1.4rem;
  }

  .package .cont_item a .img_wrap {
    width: 8rem;
    height: 8rem;
  }

  .package .cont_item a .text_wrap p {
    display: none;
  }

  .global .world_map {
    grid-template-columns: 1fr;
  }

  .global .world_map .img_wrap {
    grid-column: auto;
  }
}



/* =========================================================
   Mobile UX refinement
========================================================= */

/* Solution :
   태블릿부터 선택 메뉴 → 이미지 순서 */
@media (max-width: 1024px) {

  .solution .sol_desc_list {
    order: 1;
  }

  .solution .sol_img_list {
    order: 2;
  }

}


@media (max-width: 767px) {

  /* ========================================
     HOW
     선택 메뉴를 3개 짧은 탭으로
  ======================================== */

  .how .cont_left {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
  }

  .how .cont_left li {
    min-width: 0;
    min-height: auto;

    padding: 1.4rem 1.2rem;

    gap: .6rem;

    justify-content: center;
  }

  .how .cont_left li span {
    font-size: 1.6rem;
  }

  .how .cont_left li strong,
  .how .cont_left li.active strong {
    font-size: 1.7rem;
    line-height: 1.25;

    overflow-wrap: anywhere;
  }

  /*
    모바일에서는 카드 설명 제거.
    내용은 바로 아래 이미지 영역에서 확인
  */
  .how .cont_left li p {
    display: none;
  }

  .how .cont_right .img_list,
  .how .cont_right .list_item .img_wrap {
    height: 42rem;
  }


  /* ========================================
     SOLUTION
     선택 4개 → 이미지 순서
  ======================================== */

  .solution .cont_wrap {
    gap: 2rem;
  }

  .solution .sol_desc_list {
    display: grid;

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 1rem;
  }

  .solution .desc_list_item {
    min-width: 0;

    border: 1px solid var(--color-line);
    border-radius: 1rem;

    overflow: hidden;
  }

  .solution .desc_list_item.active {
    border-color: var(--color-text);
    background: var(--color-gray);
  }

  .solution .desc_list_item a {
    min-height: 12rem;

    padding: 1.5rem;

    justify-content: space-between;
  }

  .solution .desc_list_item .icon_wrap img {
    width: 3.4rem;
    height: 3.4rem;

    object-fit: contain;
  }

  .solution .desc_list_item .text_wrap strong {
    font-size: 1.6rem;
    line-height: 1.3;

    overflow-wrap: anywhere;
  }

  .solution .desc_list_item .text_wrap p {
    display: none;
  }

  .solution .sol_img_list {
    width: 100%;
    height: 32rem;
  }


}


@media (max-width: 480px) {

  /* HOW는 3개 선택지를 계속 한눈에 보여줌 */
  .how .title_wrap .title h3, .global .title_wrap h3 {
    white-space:wrap;
  }
  .how .cont_left {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

  .how .cont_left li {
    padding: 1.2rem .8rem;
	align-items:center;
  }

  .how .cont_left li strong,
  .how .cont_left li.active strong {
    font-size: 1.6rem;
  }

}

/* ========================================
   GLOBAL MAP - Tablet / Mobile
======================================== */
@media (max-width:1280px) {
  .global .world_map {
    position:relative;
    display:block;
    width:100%;
  }

  .global .world_map .img_wrap {
    width:100%;
    margin:0;
    position:relative;
    z-index:1;
  }

  .global .world_map .img_wrap img {
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
  }

  .global .world_map .country {
    position:absolute;
    width:2.8rem;
    height:2.8rem;
    display:block;
    transform:translate(-50%, -50%);
    z-index:5;
    pointer-events:auto;
  }

  .global .world_map .country .icon_wrap {
    width:100%;
    height:100%;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:2;
    cursor:pointer;
    pointer-events:auto;
  }

  .global .world_map .country .icon_wrap img {
    display:block;
    width:2.6rem;
    height:2.6rem;
    object-fit:contain;
    transition:transform .25s ease;
  }

  .global .world_map .country.is_open .icon_wrap img {
    transform:scale(1.15);
  }

  /* tooltip */
  .global .world_map .country .text_wrap {
  position:absolute;
  left:50%;
  bottom:100%;
  width:auto;
  padding-bottom:.7rem;
  transform:translateX(-50%);
  z-index:10;
  pointer-events:none;
  }

  .global .world_map .country .text_wrap a {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    max-width:24rem;
    min-height:3.8rem;
    padding:.7rem 3.6rem .7rem 1.6rem;
    background:#fff;
    border-radius:.8rem;
    box-shadow:0 .5rem 2rem rgba(0,0,0,.15);
    opacity:0;
    visibility:hidden;
    transform:translateY(.5rem);
    transition:opacity .25s ease, visibility .25s ease, transform .25s ease;
    pointer-events:none;
  }

  .global .world_map .country .text_wrap span {
    font-size:1.6rem;
    line-height:1.25;
    color:var(--color-text);
    text-align:center;
    white-space:nowrap;
  }

  /* PC와 동일하게 오른쪽 아이콘 유지 */
  .global .world_map .country .text_wrap img {
    display:block;
    position:absolute;
    right:1rem;
    top:50%;
    width:auto;
    height:auto;
    transform:translateY(-50%);
  }

  .global .world_map .country.is_open .text_wrap {
    pointer-events:auto;
  }

  .global .world_map .country.is_open .text_wrap a {
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    pointer-events:auto;
  }
  .global .global_desc {
    margin-top:6rem;
  }

  .global .global_desc li .count_wrap strong.plus::after {
    right:-6rem;
  }
}
@media (max-width:1024px) {
  .global .world_map .country {
    width:2.8rem;
    height:2.8rem;
  }
  .global .world_map .country .icon_wrap {
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .global .world_map .country .icon_wrap img {
    width:2.4rem;
    height:2.4rem;
    object-fit:contain;
  }
}
.global .world_map .map_canvas {
  --pin-scale:1;
}
@media (max-width:767px) {
  .mobile_location_nav {
    position:relative;
    display:flex;
    gap:.8rem;
    width:100%;
    overflow-x:auto;
    padding-bottom:1rem;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    touch-action:pan-x;
    pointer-events:auto;
    z-index:9999 !important;
  }

  .mobile_location_nav::-webkit-scrollbar {
    display:none;
  }

  .mobile_location_nav button {
    position:relative;
    z-index:51;
    flex:0 0 auto;
    padding:.9rem 1.6rem;
    border:1px solid rgba(255,255,255,.4);
    border-radius:5rem;
    background:transparent;
    color:rgba(255,255,255,.7);
    font-size:1.4rem;
    white-space:nowrap;
    cursor:pointer;
    pointer-events:auto;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }

  .mobile_location_nav button.active {
    background:#fff;
    border-color:#fff;
    color:var(--color-primary);
  }

  .global .world_map {
    position:relative;
    display:block;
    width:100%;
    overflow:hidden;
  }

  .global .world_map .map_canvas {
    position:relative;
    width:100%;
    transform-origin:0 0;
    transition:transform .45s ease;
    will-change:transform;
  }

  .global .world_map .country {
    width:2.8rem;
    height:2.8rem;
    transform:translate(-50%, -50%) scale(var(--pin-scale));
    transform-origin:center;
  }
  .global .world_map .country .icon_wrap img {
    width:1.6rem;
    height:1.6rem;
  }

  .global .world_map.is_zoomed .country {
    opacity:.4;
  }

  .global .world_map.is_zoomed .country.map_active {
    opacity:1;
    z-index:20;
  }

  .global .world_map .country.map_active .icon_wrap img {
    transform:scale(1.2);
  }
  .global .world_map .usa {right:70%;}
  .global .world_map .oregon {right:82.7%;}
  .global .world_map .korea {right:13.5%;}
  .global .world_map .seoul {right:14%;}
  .global .world_map .dongguan {right:17.3%;}
  .global .world_map .vietnam02 {right:20%;}
  .global .world_map .vietnam {right:19.5%}
  .global .world_map .semarang {right:17.5%;}
  .global .world_map .indonesia {right:19.5%;}
  .global .world_map .country .text_wrap {
    bottom:calc(100% + .5rem);
    pointer-events:none;
  }

  .global .world_map .country .text_wrap a,
  .global .world_map .country:hover .text_wrap a,
  .global .world_map .country:focus-within .text_wrap a,
  .global .world_map .country.is_open .text_wrap a {
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(.5rem);
  }

  .global .world_map .country.map_active .text_wrap {
    pointer-events:auto;
  }

  .global .world_map .country.map_active .text_wrap a {
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }

  .global .world_map .country .text_wrap a {
    width:max-content;
    max-width:min(26rem, calc(100vw - 4rem));
    min-height:3.6rem;
    padding:.7rem 3.2rem .7rem 1.4rem;
  }

  .global .world_map .country .text_wrap span {
    font-size:1.4rem;
    line-height:1.3;
    white-space:normal;
  }
}

/* =========================================================
   FINAL - Fluid Typography / Tablet refinement
   기존 레이아웃은 유지하고 폰트 크기만 자연스럽게 축소
========================================================= */

/* 공통 타이틀 */
.title_wrap span {
  font-size: 1.6rem;
  
}

.title_wrap h3 {
  font-size: clamp(3.6rem, 4.35vw, 7rem);
  white-space:nowrap;
}


/* MAIN VISUAL */
.main_visual .hero_title_wrap .hero_subtitle {
  font-size: clamp(1.6rem, 1.2vw, 2rem);
  color:var(--color-white);
  margin-bottom:2.4rem;
}

.main_visual .hero_title_wrap .hero_description {
  margin-top:3rem;
  margin-bottom:0;
  font-size:clamp(1.6rem, 1.2vw, 2.4rem);
  line-height:1.6;
  color:rgba(255,255,255,.8);
}
.main_visual .hero_title_wrap h2 {
  font-size: clamp(4.2rem, 6vw, 10rem);
  line-height: 1.3;
}

.hero_cta a,
.hero_cta a.btn_white span {
  font-size: clamp(1.6rem, 1.1vw, 2rem);
}


/* INTRO */
.intro span {
  font-size: clamp(1.6rem, 1.45vw, 2.4rem);
}

.intro h3 {
  font-size: clamp(3.2rem, 4.3vw, 7rem);
  line-height: 1.35;
}


/* HOW */
.how .cont_left li span {
  font-size: 1.6rem;
}

.how .cont_left li strong {
  font-size: clamp(1.8rem, 1.45vw, 2.4rem);
}

.how .cont_left li.active strong {
  font-size: clamp(2rem, 2.15vw, 3.6rem);
}

.how .cont_left li p {
  font-size: clamp(1.6rem, 1vw, 1.8rem);
}

.how .cont_right .desc_wrap .desc_top span {
  font-size: clamp(1.6rem, 1.2vw, 2rem);
}

.how .cont_right .desc_wrap .desc_top h5 {
  font-size: clamp(3rem, 2.8vw, 4.5rem);
}

.how .cont_right .desc_bottom .desc_bottom_left li {
  font-size: 1.4rem;
}


/* SOLUTION */
.solution .title_wrap .title p {
  font-size: clamp(1.6rem, 1.45vw, 2.4rem);
  line-height: 1.5;
}

.solution .desc_list_item .text_wrap strong {
  font-size: clamp(1.6rem, 1.5vw, 2.4rem);
  line-height: 1.3;
}

.solution .desc_list_item .text_wrap p {
  font-size: clamp(1.6rem, 1vw, 1.8rem);
  line-height: 1.4;
}


/* PACKAGE */
.package .cont_item a .text_wrap span {
  font-size: clamp(2rem, 1.85vw, 3rem);
}

.package .cont_item a .text_wrap p {
  font-size: clamp(1.6rem, 1vw, 1.8rem);
}

.package .cont_wrap .btn_wrap a span {
  font-size: clamp(1.6rem, 1vw, 1.8rem);
}


/* GLOBAL */
.global .world_map .text_wrap span {
  font-size: clamp(1.6rem, 1.1vw, 1.8rem);
}

.global .global_desc li span {
  font-size: clamp(1.8rem, 1.85vw, 3rem);
}

.global .global_desc li .count_wrap strong {
  font-size: clamp(6rem, 8vw, 15rem);
  line-height: .95;
}

.global .global_desc li .count_wrap p {
  font-size: clamp(2rem, 3vw, 5rem);
}


/* NEWS */
.news .swiper .swiper-slide .news_title {
  font-size: clamp(1.8rem, 1.5vw, 2.4rem);
}

.news .news_empty p {
  font-size: clamp(1.6rem, 1.2vw, 2rem);
}


/* CONTACT */
.contact .title_wrap p {
  font-size: clamp(1.8rem, 1.85vw, 3rem);
}

.contact .form_item label,
.contact .form_item span {
  font-size: clamp(1.6rem, 1.2vw, 2rem);
}

.contact .submit_btn span {
  font-size: clamp(1.7rem, 1.35vw, 2.2rem);
}

.contact .country_sel .option_list li {
  font-size: clamp(1.6rem, 1.2vw, 2rem);
}


/* =========================================================
   SOLUTION - 1024 이하
   4개 선택영역이 너무 커져 이미지가 멀어지는 문제 보정
========================================================= */

@media (max-width: 1024px) {

  .solution .cont_wrap {
    flex-direction: column;
    gap: clamp(2rem, 3vw, 3rem);
  }

  .solution .sol_desc_list {
    order: 1;
    width: 100%;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1rem;
  }

  .solution .sol_img_list {
    order: 2;
    width: 100%;

    height: clamp(32rem, 43vw, 44rem);

    scroll-margin-top: 10rem;
  }

  .solution .desc_list_item {
    min-width: 0;

    border: 1px solid var(--color-line);
    border-radius: 1rem;

    overflow: hidden;
  }

  .solution .desc_list_item.active {
    transform: none;

    border-color: var(--color-text);
    background: var(--color-gray);
  }

  .solution .desc_list_item a {
    min-height: clamp(8.5rem, 10vw, 10rem);

    padding: clamp(1.2rem, 1.8vw, 1.6rem);

    display: flex;
    flex-direction: row;
    align-items: center;

    gap: 1.4rem;
  }

  .solution .desc_list_item .icon_wrap {
    flex-shrink: 0;
  }

  .solution .desc_list_item .icon_wrap img {
    width: clamp(3rem, 3.5vw, 3.6rem);
    height: clamp(3rem, 3.5vw, 3.6rem);

    object-fit: contain;
  }

  .solution .desc_list_item .text_wrap {
    min-width: 0;
  }

  .solution .desc_list_item .text_wrap strong {
    font-size: clamp(1.6rem, 1.8vw, 1.9rem);

    overflow-wrap: anywhere;
  }

}


/* =========================================================
   Mobile typography
========================================================= */

@media (max-width: 767px) {

  .title_wrap h3 {
    font-size: clamp(3.2rem, 9vw, 3.8rem);
  }

  .main_visual .hero_title_wrap h2 {
    font-size: clamp(2.4rem, 8vw, 4rem);
	line-height:1.5;
  }

  .intro h3 {
    font-size: clamp(2.4rem, 8vw, 3.2rem);
  }
  .intro h3 br {display:none;}

  .how .cont_left li strong,
  .how .cont_left li.active strong {
    font-size: clamp(1.6rem, 4vw, 1.7rem);
  }

  .solution .sol_desc_list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .solution .desc_list_item {
    display:flex;
    align-items: center;
	justify-content: center;
  }
  .solution .desc_list_item a {
    min-height:auto;
    padding: 1.2rem;
    align-items: center;
	justify-content: center;
    gap: .8rem;
  }

  .solution .desc_list_item .icon_wrap img {
    width: 3rem;
    height: 3rem;
  }

  .solution .desc_list_item .text_wrap strong {
    font-size: 1.6rem;
  }

  .solution .sol_img_list {
    height: clamp(28rem, 78vw, 32rem);
  }

  .package .cont_item a .text_wrap span {
    font-size: clamp(1.8rem, 5vw, 2.2rem);
  }

  .global .global_desc li .count_wrap strong {
    font-size: clamp(5.5rem, 17vw, 6.5rem);
  }

}

/* =========================================================
   FINAL - Fluid Spacing
   기존 레이아웃/폭/배치 변경 없이 큰 여백만 유동화
========================================================= */

/* HERO */
.hero_cta {
  margin-top: clamp(5rem, 5.2vw, 10rem);
  gap: clamp(1rem, 1.25vw, 2.4rem);
}


/* INTRO */
.intro span {
  margin-bottom: clamp(3rem, calc(1.67rem + 1.74vw), 5rem);
}

@media (min-width: 1025px) {
  .intro {
    padding-top: clamp(18rem, calc(10rem + 7.8125vw), 25rem);
    padding-bottom: clamp(18rem, calc(10rem + 7.8125vw), 25rem);
  }

  .intro .btn_wrap {
    margin-top: clamp(8rem, 7.8125vw, 15rem);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .intro {
    padding-top: clamp(10rem, calc(-13.88rem + 31.13vw), 18rem);
    padding-bottom: clamp(10rem, calc(-13.88rem + 31.13vw), 18rem);
  }

  .intro .btn_wrap {
    margin-top: clamp(6rem, 7.8vw, 8rem);
  }
}

@media (max-width: 767px) {
  .intro {
    padding-top: 10rem;
    padding-bottom: 10rem;
  }

  .intro .btn_wrap {
    margin-top: 6rem;
  }
}


/* HOW / PACKAGE section vertical rhythm */
@media (min-width: 1025px) {
  .how .inner,
  .package .inner {
    margin-top: clamp(16rem, 15.625vw, 30rem);
    margin-bottom: clamp(16rem, 15.625vw, 30rem);
  }

  .how .inner {
    row-gap: clamp(5rem, calc(1.57rem + 3.35vw), 8rem);
  }

  .solution .inner {
    gap: clamp(5rem, calc(1.57rem + 3.35vw), 8rem);
  }

  .package .cont_wrap .cont_list {
    row-gap: clamp(2rem, calc(-1.43rem + 3.35vw), 5rem);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .how .inner,
  .package .inner {
    margin-top: clamp(10rem, calc(-7.91rem + 23.35vw), 16rem);
    margin-bottom: clamp(10rem, calc(-7.91rem + 23.35vw), 16rem);
  }

  .how .inner,
  .solution .inner {
    gap: clamp(4rem, calc(1.02rem + 3.89vw), 5rem);
  }

  .package .inner {
    gap: clamp(4rem, calc(1.02rem + 3.89vw), 5rem);
  }

  .package .cont_wrap .cont_list {
    row-gap: clamp(1.2rem, calc(-1.19rem + 3.11vw), 2rem);
  }
}

@media (max-width: 767px) {
  .how .inner,
  .package .inner {
    margin-top: 10rem;
    margin-bottom: 10rem;
  }

  .how .inner,
  .solution .inner,
  .package .inner {
    gap: 3rem;
  }

  .package .cont_wrap .cont_list {
    row-gap: 1.2rem;
  }
}


/* PACKAGE card 내부는 구조를 유지한 채 완만하게만 축소 */
.package .cont_list .cont_item a {
  padding: clamp(2rem, calc(0.67rem + 1.74vw), 4rem);
  gap: clamp(2rem, calc(0.67rem + 1.74vw), 4rem);
}


/* GLOBAL */
.global .inner {
  padding-top: clamp(8rem, calc(6.67rem + 1.74vw), 10rem);
  padding-bottom: clamp(8rem, calc(6.67rem + 1.74vw), 10rem);
}

@media (min-width: 1025px) {
  .global .inner {
    gap: clamp(7rem, calc(3.57rem + 3.35vw), 10rem);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .global .inner {
    gap: clamp(5rem, 7.8vw, 7rem);
  }
}

@media (max-width: 767px) {
  .global .inner {
    gap: 5rem;
  }
}


/* LOGO MARQUEE */
.logo_sec {
  padding-top: clamp(7rem, 9.8vw, 12rem);
  padding-bottom: clamp(7rem, 9.8vw, 12rem);
}

.logo_sec .inner {
  row-gap: clamp(5rem, 6.8vw, 10rem);
}

.logo_sec .logo_line01,
.logo_sec .logo_line02 {
  gap: clamp(6rem, 10.4vw, 20rem);
}


/* NEWS */
.news .inner {
  padding-top: clamp(10rem, 11.7vw, 15rem);
  padding-bottom: clamp(14rem, 19.5vw, 30rem);
  gap: clamp(5rem, 6.8vw, 10rem);
}


/* CONTACT */
.contact .inner {
  gap: clamp(5rem, 7.8vw, 15rem);
}

.contact .form_wrap form {
  gap: clamp(2rem, 2.1vw, 3rem);
}

@media (max-width: 1024px) {
  .contact .contact_cont {
    gap: clamp(5rem, 5.86vw, 6rem);
  }
}

/* GLOBAL NUMBER CARDS - FINAL */
.global .global_desc {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.38fr) minmax(0,1fr);
  gap:4rem;
  align-items:stretch;
}

.global .global_desc li {
  min-width:0;
  height:30rem;
  padding:4rem;
  border-radius:1rem;
  background:var(--color-white);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.global .global_desc li > span {
  font-size:clamp(1.8rem,1.85vw,2.6rem);
  line-height:1.3;
}


.global .global_desc li .count_wrap strong {
  flex-shrink:0;
  font-size:clamp(9rem,8vw,15rem);
  font-weight:300;
  line-height:.82;
  letter-spacing:-.05em;
}

.global .global_desc li .count_wrap p {
  margin:0;
  padding:0 0 .3rem;
  font-size:clamp(2.4rem,2.7vw,3rem);
  line-height:1.28;
  font-weight:400;
}

.global .global_desc li:nth-child(3) .count_wrap {
  gap:2rem;
}
.global .global_desc li:nth-child(3) .count_wrap p {text-align:center;}



/* 1280 이하 */
@media (max-width:1280px) {
  .global .global_desc {
    grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);
    gap:2rem;
  }

  .global .global_desc li {
    height:26rem;
    padding:3rem;
  }

  .global .global_desc li .count_wrap {
    gap:1.6rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:clamp(7rem,8vw,10rem);
  }

  .global .global_desc li .count_wrap p,
  .global .global_desc li:nth-child(3) .count_wrap p {
    font-size:clamp(2rem,2.7vw,3.4rem);
  }
}


/* 1024 이하 */
@media (max-width:1024px) {
  .global .global_desc {
    grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);
    gap:1.5rem;
    margin-top:6rem;
  }

  .global .global_desc li {
    height:22rem;
    padding:2.4rem;
  }

  .global .global_desc li > span {
    font-size:1.8rem;
  }

  .global .global_desc li .count_wrap {
    gap:1.2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:clamp(6rem,8vw,8rem);
  }

  .global .global_desc li .count_wrap p,
  .global .global_desc li:nth-child(3) .count_wrap p {
    font-size:clamp(2rem,2.6vw,2.6rem);
  }
}


/* 모바일 */
@media (max-width:767px) {
  .global .global_desc {
    grid-template-columns:1fr;
    gap:1rem;
  }

  .global .global_desc li {
    height:auto;
    min-height:16rem;
    padding:2.4rem;
  }

  .global .global_desc li .count_wrap {
    justify-content:space-between;
    gap:2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:6rem;
  }

  .global .global_desc li .count_wrap p,
  .global .global_desc li:nth-child(3) .count_wrap p {
    font-size:2rem;
    line-height:1.25;
  }
}


/* 작은 모바일 */
@media (max-width:480px) {
  .global .global_desc li {
    min-height:15rem;
    padding:2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:5.5rem;
  }

  .global .global_desc li .count_wrap p,
  .global .global_desc li:nth-child(3) .count_wrap p {
    font-size:1.8rem;
  }
}
/* ========================================
   GLOBAL COUNT - Tablet
======================================== */

/* 1400 이하 - 3개 한 줄 유지 */
@media (max-width:1400px) {
  .global .global_desc {
    grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);
    gap:2rem;
  }

  .global .global_desc li {
    height:26rem;
    padding:3rem;
  }

  .global .global_desc li .count_wrap {
    display:flex;
    align-items:flex-end;
    gap:1.5rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:clamp(7rem,7vw,10rem);
  }

  .global .global_desc li .count_wrap p {
    margin:0 0 .3rem auto;
    font-size:clamp(1.8rem,1.7vw,2.4rem);
    line-height:1.25;
  }

  .global .global_desc li .count_wrap strong.plus {
    display:inline-flex;
    align-items:flex-end;
  }

  .global .global_desc li .count_wrap strong.plus::after {
    position:static;
    display:inline-block;
    transform:none;
    margin-left:.3rem;
    font-size:.55em;
    line-height:1;
  }
}

@media (min-width:768px) and (max-width:1024px) {
  .global .global_desc {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:1.5rem;
  }
  .global .global_desc li:nth-child(3) {
    grid-column:1 / -1;
  }
  .global .global_desc li {
    height:20rem;
    padding:2.6rem;
  }

  .global .global_desc li .count_wrap {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:5.8rem;
  }

  .global .global_desc li .count_wrap p {
    margin:0 0 .3rem;
    font-size:1.8rem;
    line-height:1.2;
    text-align:right;
  }

  .global .global_desc li:nth-child(3) .count_wrap p br {
    display:none;
  }

  .global .global_desc li:nth-child(3) .count_wrap p {
    white-space:nowrap;
    font-size:1.6rem;
  }
}


/* ========================================
   GLOBAL COUNT - Mobile
======================================== */
@media (max-width:767px) {
  .global .global_desc {
    grid-template-columns:1fr;
    gap:1rem;
  }

  .global .global_desc li,
  .global .global_desc li:nth-child(3) {
    grid-column:auto;
    width:100%;
    min-height:15rem;
    height:auto;
    padding:2.2rem;
  }
  .global .global_desc li {
    min-height:15rem;
    padding:2.2rem;
  }

  .global .global_desc li .count_wrap {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:2rem;
  }

  .global .global_desc li .count_wrap strong {
    font-size:5.8rem;
  }

  .global .global_desc li .count_wrap p {
    margin:0 0 .3rem;
    font-size:1.8rem;
    line-height:1.25;
    text-align:right;
  }
  .global .global_desc li:nth-child(3) .count_wrap p {
    white-space:nowrap;
  }
  .global .global_desc li .count_wrap strong.plus {
    display:inline-flex;
    align-items:flex-end;
  }

  .global .global_desc li .count_wrap strong.plus::after {
    position:static;
    display:inline-block;
    transform:none;
    margin-left:.3rem;
    font-size:.55em;
    line-height:1;
  }
  .global .world_map {
    width:100%;
    margin-left:0;
  }
  .global .world_map .country {
    width:1.6rem;
    height:1.6rem;
  }

  .global .world_map .country .icon_wrap {
    position:relative;
    width:100%;
    height:100%;
  }

  /* 실제 아이콘보다 터치 영역은 크게 */
  .global .world_map .country .icon_wrap::before {
    content:'';
    position:absolute;
    inset:-1rem;
  }
  .global .title_wrap h3 {
    white-space:normal;
    text-align:center;
    line-height:1.15;
  }
}