:root {
  --ztc-shadow1: #3f0e0e30 .5rem .375rem .1875rem;
  --ztc-shadow2: #2e38dc33 0 .625rem 3.125rem;
  --ztc-shadow3: #2d2d2d .3125rem .3125rem .25rem;
  --ztc-shadow4: #20212447 0 .0625rem .375rem;
  --ztc-shadow5: #071c1f1a 0 1rem 2rem;
  --ztc-shadow6: #00000000 0 0;
  --ztc-shadow7: #00000014 0 .25rem 1.875rem;
  --ztc-shadow8: #00000070 .25rem .25rem .3125rem;
  --ztc-shadow9: #000000 .25rem .25rem .3125rem;
  --ztc-bg-color01: #ffffff4d;
  --ztc-bg-color02: #ffffffbf;
  --ztc-bg-color03: #ffffff;
  --ztc-bg-color04: #ffe770;
  --ztc-bg-color05: #ff5a3c;
  --ztc-bg-color06: #af0206;
  --ztc-bg-color07: #f9f9f9;
  --ztc-bg-color08: #f3f7f8;
  --ztc-bg-color09: #eeeeee;
  --ztc-bg-color10: #ccd7d9;
  --ztc-bg-color11: #999999;
  --ztc-bg-color12: #122c5b75;
  --ztc-bg-color13: #0229a0;
  --ztc-bg-color14: #00000000;
  --ztc-bg-color15: #00000040;
  --ztc-bg-color16: #00000070;
  --ztc-bg-color17: #00000080;
  --ztc-bg-color18: #000000;
  --ztc-border-color1: #ff5a3c;
  --ztc-border-color2: #eeeeee;
  --ztc-border-color3: #eaebeb;
  --ztc-border-color4: #3f4041;
  --ztc-border-color5: #acacac;
  --ztc-border-radius-s1: .0625rem;
  --ztc-border-radius-s2: .125rem;
  --ztc-border-radius-s4: .25rem;
  --ztc-border-radius-s5: .3125rem;
  --ztc-border-radius-s6: .375rem;
  --ztc-border-radius-s8: .5rem;
  --ztc-border-radius-s18: 1.125rem;
  --ztc-font-color01: #ffffff;
  --ztc-font-color02: #ffca00;
  --ztc-font-color03: #ff5a3c;
  --ztc-font-color04: #af0206;
  --ztc-font-color05: #a0a2a8;
  --ztc-font-color06: #676767;
  --ztc-font-color07: #606268;
  --ztc-font-color08: #5c727d;
  --ztc-font-color09: #00238d;
  --ztc-font-color10: #071c1f;
  --ztc-font-color11: #00000000;
  --ztc-font-color12: #000000;
  --ztc-font-size-s12: .75rem;
  --ztc-font-size-s14: .875rem;
  --ztc-font-size-s15: .9375rem;
  --ztc-font-size-s16: 1rem;
  --ztc-font-size-s18: 1.125rem;
  --ztc-font-size-s20: 1.25rem;
  --ztc-font-size-s24: 1.5rem;
  --ztc-font-size-s26: 1.625rem;
  --ztc-font-size-s28: 1.75rem;
  --ztc-font-size-s30: 1.875rem;
  --ztc-font-size-s34: 2.125rem;
  --ztc-font-size-s35: 2.1875rem;
  --ztc-font-size-s36: 2.25rem;
  --ztc-font-size-s44: 2.75rem;
  --ztc-font-size-s48: 3rem;
  --ztc-font-size-s50: 3.125rem;
  --ztc-font-size-s52: 3.25rem;
  --ztc-font-size-s56: 3.5rem;
  --ztc-font-size-s60: 3.75rem;
  --ztc-font-size-s70: 4.375rem;
  --ztc-font-size-s85: 5.3125rem;
  --ztc-font-size-s90: 5.625rem;
  --ztc-font-size-s100: 6.25rem;
  --ztc-font-size-s120: 7.5rem;
  --ztc-font-weight-400: 400;
  --ztc-font-weight-600: 600;
  --ztc-font-weight-700: 700;
  --ztc-font-weight-900: 900;
  --ztc-line-height-h14: .875rem;
  --ztc-line-height-h16: 1rem;
  --ztc-line-height-h18: 1.125rem;
  --ztc-line-height-h20: 1.25rem;
  --ztc-line-height-h21: 1.3125rem;
  --ztc-line-height-h22: 1.375rem;
  --ztc-line-height-h24: 1.5rem;
  --ztc-line-height-h25: 1.5625rem;
  --ztc-line-height-h26: 1.625rem;
  --ztc-line-height-h28: 1.75rem;
  --ztc-line-height-h30: 1.875rem;
  --ztc-line-height-h32: 2rem;
  --ztc-line-height-h34: 2.125rem;
  --ztc-line-height-h36: 2.25rem;
  --ztc-line-height-h38: 2.375rem;
  --ztc-line-height-h40: 2.5rem;
  --ztc-line-height-h45: 2.8125rem;
  --ztc-line-height-h48: 3rem;
  --ztc-line-height-h50: 3.125rem;
  --ztc-line-height-h52: 3.25rem;
  --ztc-line-height-h62: 3.875rem;
  --ztc-line-height-h64: 4rem;
  --ztc-line-height-h66: 4.125rem;
  --ztc-line-height-h70: 4.375rem;
  --ztc-line-height-h72: 4.5rem;
  --ztc-line-height-h85: 5.3125rem;
  --ztc-line-height-h100: 6.25rem;
  --ztc-line-height-h150: 9.375rem;
  --ztc-line-height-h200: 12.5rem;
  --ztc-spacing--260: -16.25rem;
  --ztc-spacing--130: -8.125rem;
  --ztc-spacing--20: -1.25rem;
  --ztc-spacing--2: -0.125rem;
  --ztc-spacing-3: .1875rem;
  --ztc-spacing-4: .25rem;
  --ztc-spacing-5: .3125rem;
  --ztc-spacing-6: .375rem;
  --ztc-spacing-8: .5rem;
  --ztc-spacing-10: .625rem;
  --ztc-spacing-11: .6875rem;
  --ztc-spacing-12: .75rem;
  --ztc-spacing-13: .8125rem;
  --ztc-spacing-14: .875rem;
  --ztc-spacing-15: .9375rem;
  --ztc-spacing-16: 1rem;
  --ztc-spacing-17: 1.0625rem;
  --ztc-spacing-18: 1.125rem;
  --ztc-spacing-20: 1.25rem;
  --ztc-spacing-21: 1.3125rem;
  --ztc-spacing-22: 1.375rem;
  --ztc-spacing-24: 1.5rem;
  --ztc-spacing-25: 1.5625rem;
  --ztc-spacing-28: 1.75rem;
  --ztc-spacing-30: 1.875rem;
  --ztc-spacing-32: 2rem;
  --ztc-spacing-34: 2.125rem;
  --ztc-spacing-35: 2.1875rem;
  --ztc-spacing-40: 2.5rem;
  --ztc-spacing-50: 3.125rem;
  --ztc-spacing-60: 3.75rem;
  --ztc-spacing-70: 4.375rem;
  --ztc-spacing-80: 5rem;
  --ztc-spacing-100: 6.25rem;
  --ztc-spacing-150: 9.375rem;
  --ztc-spacing-170: 10.625rem;
  --ztc-spacing-200: 12.5rem;
  --ztc-spacing-230: 14.375rem;
  --ztc-spacing-250: 15.625rem;
  --ztc-spacing-300: 18.75rem;
  --ztc-z--1: -1;
  --ztc-z-0: 0;
  --ztc-z-1: 1;
  --ztc-z-2: 2;
  --ztc-z-3: 3;
  --ztc-z-20: 20;
  --ztc-z-019: 9;
  --ztc-z-029: 99;
  --ztc-z-039: 999;
  --ztc-z-049: 9999;
  --ztc-z-059: 99999;
  --ztc-z-069: 999999;
  --ztc-z-079: 9999999;
  --ztc-z-089: 99999999;
}

* {
  user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
}

body {
  color: var(--ztc-font-color12);
  font-size: var(--ztc-font-size-s14);
  font-style: normal;
  font-weight: var(--ztc-font-weight-400);
  line-height: var(--ztc-line-height-h25);
}

a {
  display: inline-block;
  transition: all 300ms ease 0s;
}

::-webkit-scrollbar {
  width: 0;
}

::-webkit-scrollbar-track {
  background-color: var(--ztc-bg-color14);
}

::-webkit-scrollbar-thumb {
  background-color: var(--ztc-bg-color11);
}

::-webkit-scrollbar-thumb::before {
  background-color: var(--ztc-bg-color03);
  border-radius: var(--ztc-border-radius-s5);
  bottom: .125rem;
  content: "";
  left: .125rem;
  display: block;
  position: absolute;
  right: .125rem;
  top: .125rem;
}

.btn-area a {
  background-color: var(--ztc-bg-color04);
  border-radius: var(--ztc-border-radius-s6);
  color: var(--ztc-font-color12);
  display: inline-block;
  font-size: var(--ztc-font-size-s14);
  line-height: var(--ztc-line-height-h14);
  margin-bottom: 0;
  padding: var(--ztc-spacing-10);
  position: relative;
  transition: all 400ms;
  z-index: var(--ztc-z-1);
}

.btn-area a i {
  font-size: var(--ztc-font-size-s14);
  transition: all 400ms;
}

.btn-area a:hover {
  background-color: var(--ztc-bg-color13);
  color: var(--ztc-font-color01);
  transform: translateY(-0.3125rem);
  transition: all 400ms;
}

.hidden {
  display: none;
}

.image-anime {
  overflow: hidden;
  position: relative;
}

.image-anime::after {
  background-color: var(--ztc-bg-color01);
  content: "";
  height: 0;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  width: 200%;
  z-index: 1;
}

.image-anime:hover::after {
  background-color: var(--ztc-bg-color14);
  height: 250%;
  transition: all 600ms linear;
}

.section-area .section-header {
  text-align: center;
}

.section-area .section-header h3,
.section-area .section-header h2 {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
  letter-spacing: .125rem;
}

.space8 {
  height: .5rem;
}

.space10 {
  height: .625rem;
}

.space12 {
  height: .75rem;
}

.space16 {
  height: 1rem;
}

.space20 {
  height: 1.25rem;
}

.space24 {
  height: 1.5rem;
}

.space30 {
  height: 1.875rem;
}

.space32 {
  height: 2rem;
}

.space40 {
  height: 2.5rem;
}

.space42 {
  height: 2.625rem;
}

.space50 {
  height: 3.125rem;
}

.space60 {
  height: 3.75rem;
}

/* ========== PRELOADER CSS ========== */
.preloader-area {
  background-color: var(--ztc-bg-color03);
  display: flex;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: var(--ztc-z-089);
}

.preloader-area .image-anime {
  animation: flip;
  animation-duration: 1000ms;
  height: 12.5rem;
  margin: auto;
  position: relative;
  width: 12.5rem;
}

/* ========== HEADER CSS ========== */
.header-area {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: var(--ztc-z-079);
}

.header-area .sticky-header {
  background-color: var(--ztc-bg-color14);
  transition-duration: 700ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  z-index: var(--ztc-z-069);
}

.header-area .sticky-header .container {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto;
  position: relative;
}

.header-area .sticky-header .menu {
  display: block;
  flex-grow: 1;
}

.header-area .sticky-header .menu ul {
  align-items: center;
  display: flex;
  gap: .3125rem;
  justify-content: flex-end;
}

.header-area .sticky-header .menu ul li {
  position: relative;
}

.header-area .sticky-header .menu ul li a {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-600);
  white-space: nowrap;
}

.header-area .sticky-header .menu-btn {
  align-items: center;
  display: flex;
}

.header-area .sticky-header .menu-btn .show-drawer {
  align-items: center;
  background-color: var(--ztc-bg-color03);
  box-shadow: var(--ztc-shadow6), var(--ztc-shadow6), var(--ztc-shadow5);
  display: flex;
  height: 3.125rem;
  justify-content: center;
  position: relative;
  transition-duration: 300ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  width: 3.125rem;
}

.header-area .sticky-header .menu-btn .show-drawer a svg {
  cursor: pointer;
  display: block;
  height: 3.125rem;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  vertical-align: middle;
  width: 3.125rem;
}

.header-area .sticky-header .menu-btn .show-drawer a svg path {
  fill: none;
  stroke: #333333;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  stroke-width: 1.875rem;
  transition: stroke-dashoffset 500ms cubic-bezier(0.25, -0.25, 0.75, 1.25) stroke-dasharray 500ms cubic-bezier(0.25, -0.25, 0.75, 1.25);
}

.header-area .sticky-header .menu-btn .show-drawer a svg path#top {
  stroke-dasharray: 15rem 59.375rem;
}

.header-area .sticky-header .menu-btn .show-drawer a svg path#middle {
  stroke-dasharray: 15rem 15rem;
}

.header-area .sticky-header .menu-btn .show-drawer a svg path#bottom {
  stroke-dasharray: 15rem 59.375rem;
}

.header-area .sticky-secondary.active {
  background-color: var(--ztc-bg-color13);
  box-shadow: var(--ztc-shadow2);
}

.header-area .mobile-menu-container .drawer-overlay {
  background-color: var(--ztc-bg-color18);
  cursor: zoom-out;
  display: block;
  height: 100%;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  transition-duration: 300ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  visibility: hidden;
  width: 100%;
  z-index: var(--ztc-z--1);
}

.header-area .mobile-menu-container.active .drawer-overlay {
  opacity: 0.4;
  visibility: visible;
  z-index: var(--ztc-z-049);
}

.header-area .mobile-menu-container .container-box {
  background-color: var(--ztc-bg-color03);
  display: block;
  height: 100%;
  left: -18.75rem;
  padding: var(--ztc-spacing-50) var(--ztc-spacing-20);
  position: fixed;
  top: 0;
  transition-duration: 500ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  width: 18.75rem;
  z-index: var(--ztc-z-059);
}

.header-area .mobile-menu-container .container-box .container {
  height: 100%;
  overflow: auto;
  padding-right: var(--ztc-spacing-15);
}

.header-area .mobile-menu-container .container-box .container-inner .container-header {
  align-items: center;
  border-bottom-width: .0625rem;
  border-color: var(--ztc-border-color2);
  display: flex;
  justify-content: space-between;
  margin-bottom: var(--ztc-spacing-25);
  padding-bottom: var(--ztc-spacing-10);
  padding-top: var(--ztc-spacing-3);
}

.header-area .mobile-menu-container .container-box .container-inner .container-header .logo a {
  width: 10.625rem;
}

.header-area .mobile-menu-container .container-box .container-inner .container-header .close-box .close-drawer {
  color: var(--ztc-font-color12);
  font-size: var(--ztc-font-size-s30);
  line-height: var(--ztc-line-height-h36);
  padding: var(--ztc-spacing-8) var(--ztc-spacing-15);
}

.header-area .mobile-menu-container .container-box .container-inner .menu {
  border-bottom-width: .0625rem;
  border-color: var(--ztc-border-color2);
  padding-bottom: var(--ztc-spacing-32);
}

.header-area .mobile-menu-container .container-box .container-inner .menu .accordion-container li {
  margin-top: var(--ztc-spacing-16);
}

.header-area .mobile-menu-container .container-box .container-inner .menu .accordion-container li .accordion-controller {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-size: var(--ztc-font-size-s14);
  justify-content: space-between;
  line-height: var(--ztc-line-height-h21);
  padding-bottom: var(--ztc-spacing-8);
  padding-top: var(--ztc-spacing-8);
}

.header-area .mobile-menu-container.active .container-box {
  left: 0;
}

/* ========== HERO CSS ========== */
.hero-area1 .hero {
  overflow: hidden;
  position: relative;
  z-index: var(--ztc-z-0);
}

.hero-area1 .hero .hero-slider-container {
  position: relative;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  position: relative;
  z-index: var(--ztc-z-0);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-1 {
  background-image: url(../img/all-images/slide-img1.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-2 {
  background-image: url(../img/all-images/slide-img2.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-3 {
  background-image: url(../img/all-images/slide-img3.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-4 {
  background-image: url(../img/all-images/slide-img4.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-5 {
  background-image: url(../img/all-images/slide-img5.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-6 {
  background-image: url(../img/all-images/slide-img6.jpg);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .fill-box {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: var(--ztc-z-20);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .container {
  letter-spacing: .125rem;
  position: relative;
  z-index: var(--ztc-z-069);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  text-align: center;
  z-index: var(--ztc-z-019);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-2 .text-box .slide-animation,
.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-4 .text-box .slide-animation {
  align-items: flex-end;
  text-align: end;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-3 .text-box .slide-animation,
.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide.slide-5 .text-box .slide-animation {
  align-items: flex-start;
  text-align: start;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation>*:nth-child(1) {
  animation-delay: 500ms;
  animation-duration: 500ms;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation>*:nth-child(2) {
  animation-delay: 1000ms;
  animation-duration: 1000ms;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation>*:nth-child(3) {
  animation-delay: 1500ms;
  animation-duration: 1500ms;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide-active .slide-animation>*,
.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .slide-animation-active .slide-animation>* {
  animation-name: fadeInUp;
  opacity: 1;
  visibility: visible;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .subtitle {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-700);
  text-shadow: var(--ztc-shadow3);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-700);
  text-shadow: var(--ztc-shadow3);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span.special-box {
  align-items: center;
  display: flex;
  flex-direction: row;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span .inline-box {
  display: inline-block;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span .inline-box .column-box {
  display: flex;
  flex-direction: column;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .translate {
  color: var(--ztc-font-color01);
  max-width: max-content;
  text-shadow: var(--ztc-shadow3);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-next,
.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-prev {
  align-items: center;
  border: .0625rem solid var(--ztc-border-color4);
  border-radius: var(--ztc-border-radius-s1);
  color: var(--ztc-font-color01);
  display: flex;
  justify-content: center;
  opacity: 0;
  position: absolute;
  text-align: center;
  top: 50%;
  transition: 300ms;
  visibility: hidden;
  z-index: var(--ztc-z-039);
}

.hero-area1 .hero .hero-slider-container:hover .swiper .swiper-button-container .swiper-button-next,
.hero-area1 .hero .hero-slider-container:hover .swiper .swiper-button-container .swiper-button-prev {
  opacity: 1;
  visibility: visible;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-next::after,
.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-prev::after {
  display: none;
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-next:hover,
.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-prev:hover {
  background-color: var(--ztc-bg-color05);
  border-color: var(--ztc-border-color1);
  color: var(--ztc-font-color01);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-next {
  transform: translateX(-3.125rem);
}

.hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-prev {
  transform: translateX(3.125rem);
}

.hero-area2 {
  background-image: url(../img/all-images/hero-img1.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: relative;
}

.hero-area2 .inner-header a {
  color: var(--ztc-font-color01);
  display: inline-block;
  font-weight: var(--ztc-font-weight-400);
  transition: all 400ms;
}

.hero-area2 .inner-header a span {
  font-weight: var(--ztc-font-weight-600);
}

.hero-area2 .inner-header h2 {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-600);
}

.hero-area2 .inner-header h4 a {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-400);
}

.hero-area2 .inner-header .title {
  align-items: flex-end;
  color: var(--ztc-font-color01);
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.hero-area2 .inner-header .title span:hover {
  animation: pulse;
  animation-duration: 800ms;
}

/* ========== CENTER SWIPER CSS ========== */
.center-swiper-area .carousel-item {
  background-image: url(../img/all-images/center-swiper-img5.jpg);
}

/* ========== TIME MEDIA CSS ========== */
.time-media-area .time-media-header {
  position: relative;
}

.time-media-area .time-media-header h2 {
  position: relative;
  text-align: start;
}

.time-media-area .diaphragm-image,
.time-media-area .vertical-image {
  display: flex;
  flex-direction: column;
  opacity: 1;
  text-align: center;
  visibility: inherit;
  z-index: 0;
}

.time-media-area .diaphragm-image .image-anime {
  aspect-ratio: 94/59;
}

.time-media-area .vertical-image .image-anime {
  aspect-ratio: 103/164;
}

.time-media-area .diaphragm-image a,
.time-media-area .vertical-image a {
  color: var(--ztc-font-color12);
  display: inline-block;
  font-weight: var(--ztc-font-weight-600);
  margin-top: var(--ztc-spacing-10);
  position: relative;
  transition: all 400ms;
  z-index: var(--ztc-z-2);
}

.time-media-area .text-area {
  aspect-ratio: 306 / 396;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
}

.time-media-area .text-area .text-content {
  background-color: var(--ztc-bg-color08);
  border-radius: var(--ztc-border-radius-s8);
  box-shadow: var(--ztc-shadow8);
}

.time-media-area .text-area .text-content p {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
}

.time-media-area .text-area .text-content .btn-area {
  display: flex;
  justify-content: flex-end;
}

.time-media-area .text-area .text-content .btn-area a {
  background-color: var(--ztc-bg-color04);
  border-radius: var(--ztc-border-radius-s6);
  color: var(--ztc-font-color4);
  display: inline-block;
  font-weight: var(--ztc-font-weight-400);
  position: relative;
  transition: all 400ms;
  z-index: var(--ztc-z-1);
}

.time-media-area .text-area .text-content .btn-area a:hover {
  background: var(--ztc-bg-color13);
  color: var(--ztc-font-color01);
}

/* ========== MEDIA ADVANTAGE CSS ========== */
.media-advantage-area1 {
  background-color: var(--ztc-bg-color03);
  background-image: url(../img/all-images/media-advantage-img1.jpg);
  background-position: top center;
  background-repeat: repeat;
  background-size: 100%;
  color: var(--ztc-font-color11);
  overflow: hidden;
}

.media-advantage-area1 .media-advantage {
  display: block;
  text-align: left;
}

.media-advantage-area1 .media-advantage::before,
.media-advantage-area1 .media-advantage::after {
  content: "";
  display: table;
}

.media-advantage-area1 .media-advantage ul {
  list-style: none outside none;
  text-align: center;
  width: 100%;
}

.media-advantage-area1 .media-advantage ul li {
  background-attachment: scroll;
  background-color: var(--ztc-bg-color14);
  background-image: url(../img/all-images/media-advantage-img3.png);
  background-repeat: no-repeat;
  display: inline-block;
  position: relative;
}

.media-advantage-area1 .media-advantage ul li.last {
  background-image: none;
  padding-right: 0;
}

.media-advantage-area1 .media-advantage ul li .content-box {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.media-advantage-area1 .media-advantage ul li .content-box:hover {
  animation: pulse;
  animation-duration: 500ms;
}

.media-advantage-area1 .media-advantage ul li .content-box .number {
  background-image: url(../img/all-images/media-advantage-img2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  box-shadow: var(--ztc-shadow1);
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-600);
  position: relative;
}

.media-advantage-area1 .media-advantage ul li .content-box .text {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
  letter-spacing: .0625rem;
}

.media-advantage-area2 .accordion {
  overflow: hidden;
  position: relative;
}

.media-advantage-area2 .accordion ul {
  width: 100%;
  zoom: 1;
}

.media-advantage-area2 .accordion ul li {
  cursor: pointer;
  overflow: hidden;
  position: relative;
}

.media-advantage-area2 .accordion ul li .item {
  height: 100%;
  position: relative;
}

.media-advantage-area2 .accordion ul li .item .blur-bg {
  display: none;
}

.media-advantage-area2 .accordion ul li .item .image-description-area {
  position: absolute;
  top: 0;
}

.media-advantage-area2 .accordion ul li .item .image-description-area .image-description-box {
  height: auto;
}

.media-advantage-area2 .accordion ul li .item .content-area {
  color: var(--ztc-font-color01);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.media-advantage-area2 .accordion ul li .item .content-area::before {
  background-color: var(--ztc-bg-color16);
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: all 500ms;
  -webkit-transition: all 500ms;
}

.media-advantage-area2 .accordion ul li .item .content-area h3 {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-600);
  left: 50%;
  letter-spacing: .125rem;
  margin: 0 0 0 -0.5em;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  -webkit-transform: translateY(-50%);
}

.media-advantage-area2 .accordion ul li.active .item .blur-bg {
  background-size: cover;
  display: block;
  filter: blur(1.25rem);
  height: 100%;
  position: relative;
  transform: scale(1.2);
  z-index: 0;
}

.media-advantage-area2 .accordion ul li.active:nth-of-type(1) .blur-bg {
  background-image: url(../img/all-images/media-advantage-img4.jpg);
}

.media-advantage-area2 .accordion ul li.active:nth-of-type(2) .blur-bg {
  background-image: url(../img/all-images/media-advantage-img5.jpg);
}

.media-advantage-area2 .accordion ul li.active:nth-of-type(3) .blur-bg {
  background-image: url(../img/all-images/media-advantage-img6.jpg);
}

.media-advantage-area2 .accordion ul li.active:nth-of-type(4) .blur-bg {
  background-image: url(../img/all-images/media-advantage-img7.jpg);
}

.media-advantage-area2 .accordion ul li.active:nth-of-type(5) .blur-bg {
  background-image: url(../img/all-images/media-advantage-img8.jpg);
}

.media-advantage-area2 .accordion ul li.active .item .blur-bg::after {
  background-color: var(--ztc-bg-color15);
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box {
  position: relative;
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .image-area {
  height: 80%;
  overflow: hidden;
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .image-area img {
  transform: scale(1.25) translate(10%);
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area {
  color: var(--ztc-font-color01);
  height: 20%;
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box {
  align-items: center;
  display: flex;
  height: 100%;
  margin: 0 auto;
  opacity: 1;
  overflow: hidden;
  transform: translateY(0);
  transition: all 500ms;
  width: max-content;
  -webkit-transform: translateY(0);
  -webkit-transition: all 500ms;
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box .text-left h3 {
  border-right: .1875rem solid var(--ztc-border-color3);
  color: var(--ztc-font-color01);
  letter-spacing: 0;
  margin: 0;
  padding-right: 1rem;
  opacity: 1;
  position: static;
  transform: translateY(0);
  width: max-content;
  -webkit-transform: translateY(0);
}

.media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box .text-right p {
  color: var(--ztc-font-color01);
  letter-spacing: .0625rem;
  margin-left: 1rem;
  text-align: left;
  width: max-content;
}

.media-advantage-area2 .accordion ul li.active .item .content-area::before,
.media-advantage-area2 .accordion ul li.active .item .content-area h3 {
  opacity: 0;
}

/* ========== MEDIA DISTRIBUTION CSS ========== */
.resource-distribution-area .content-box {
  overflow: unset;
}

.resource-distribution-area .content-box .resource-distribution-header h2 {
  width: max-content;
}

.resource-distribution-area .content-box .counter-area {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.resource-distribution-area .content-box .counter-area h4 {
  color: var(--ztc-font-color04);
  font-weight: var(--ztc-font-weight-600);
  letter-spacing: .0625rem;
  margin-bottom: 0;
  width: max-content;
}

.resource-distribution-area .content-box .counter-area h2 {
  font-weight: var(--ztc-font-weight-700);
  margin-bottom: var(--ztc-spacing-40);
  width: max-content;
}

.resource-distribution-area .content-box .counter-area h2 span {
  font-weight: var(--ztc-font-weight-700);
}

.resource-distribution-area .m_map {
  aspect-ratio: 989/724;
  background-image: url(../img/all-images/map-img1.png);
  background-repeat: no-repeat;
  background-size: contain;
  margin-bottom: var(--ztc-font-size-s30);
  position: relative;
  width: 100%;
}

.resource-distribution-area .m_map .mp {
  background-image: url(../img/all-images/map-img2.png);
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  position: absolute;
  transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  -webkit-transition: all 200ms ease-out;
}

.resource-distribution-area .m_map .mp:hover {
  background-image: url(../img/all-images/map-img3.png);
  background-repeat: no-repeat;
  transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  -webkit-transition: all 200ms ease-out;
}

.resource-distribution-area .m_map .mp.mp1 {
  left: calc(665/989*100%);
  top: calc(285/724*100%);
}

.resource-distribution-area .m_map .mp.mp2 {
  left: calc(735/989*100%);
  top: calc(460/724*100%);
}

.resource-distribution-area .m_map .mp.mp3 {
  left: calc(615/989*100%);
  top: calc(590/724*100%);
}

.resource-distribution-area .m_map .mp.mp4 {
  left: calc(645/989*100%);
  top: calc(590/724*100%);
}

.resource-distribution-area .m_map .mp.mp5 {
  left: calc(470/989*100%);
  top: calc(470/724*100%);
}

.resource-distribution-area .m_map .mp.mp6 {
  left: calc(720/989*100%);
  top: calc(475/724*100%);
}

.resource-distribution-area .m_map .mp.mp7 {
  left: calc(696/989*100%);
  top: calc(408/724*100%);
}

.resource-distribution-area .m_map .mp.mp8 {
  left: calc(623/989*100%);
  top: calc(467/724*100%);
}

.resource-distribution-area .m_map .mp.mp9 {
  left: calc(515/989*100%);
  top: calc(475/724*100%);
}

.resource-distribution-area .m_map .mp.mp10 {
  left: calc(680/989*100%);
  top: calc(303/724*100%);
}

.resource-distribution-area .m_map .mp.mp11 {
  left: calc(635/989*100%);
  top: calc(333/724*100%);
}

.resource-distribution-area .m_map .mp.mp12 {
  left: calc(595/989*100%);
  top: calc(345/724*100%);
}

.resource-distribution-area .m_map .mp.mp13 {
  left: calc(760/989*100%);
  top: calc(265/724*100%);
}

.resource-distribution-area .m_map .mp.mp14 {
  left: calc(745/989*100%);
  top: calc(305/724*100%);
}

.resource-distribution-area .m_map .mp.mp15 {
  left: calc(822/989*100%);
  top: calc(205/724*100%);
}

.resource-distribution-area .m_map .mp.mp16 {
  left: calc(845/989*100%);
  top: calc(150/724*100%);
}

.resource-distribution-area .m_map .mp.mp17 {
  left: calc(723/989*100%);
  top: calc(440/724*100%);
}

.resource-distribution-area .m_map .mp.mp18 {
  left: calc(702/989*100%);
  top: calc(448/724*100%);
}

.resource-distribution-area .m_map .mp.mp19 {
  left: calc(720/989*100%);
  top: calc(505/724*100%);
}

.resource-distribution-area .m_map .mp.mp20 {
  left: calc(667/989*100%);
  top: calc(453/724*100%);
}

.resource-distribution-area .m_map .mp.mp21 {
  left: calc(700/989*100%);
  top: calc(535/724*100%);
}

.resource-distribution-area .m_map .mp.mp22 {
  left: calc(675/989*100%);
  top: calc(565/724*100%);
}

.resource-distribution-area .m_map .mp.mp23 {
  left: calc(645/989*100%);
  top: calc(525/724*100%);
}

.resource-distribution-area .m_map .mp.mp24 {
  left: calc(683/989*100%);
  top: calc(350/724*100%);
}

.resource-distribution-area .m_map .mp.mp25 {
  left: calc(730/989*100%);
  top: calc(353/724*100%);
}

.resource-distribution-area .m_map .mp.mp26 {
  left: calc(620/989*100%);
  top: calc(415/724*100%);
}

.resource-distribution-area .m_map .mp.mp27 {
  left: calc(598/989*100%);
  top: calc(505/724*100%);
}

.resource-distribution-area .m_map .mp.mp28 {
  left: calc(595/989*100%);
  top: calc(610/724*100%);
}

.resource-distribution-area .m_map .mp.mp29 {
  left: calc(565/989*100%);
  top: calc(645/724*100%);
}

.resource-distribution-area .m_map .mp.mp30 {
  left: calc(545/989*100%);
  top: calc(665/724*100%);
}

.resource-distribution-area .m_map .mp.mp31 {
  left: calc(513/989*100%);
  top: calc(531/724*100%);
}

.resource-distribution-area .m_map .mp.mp32 {
  left: calc(445/989*100%);
  top: calc(565/724*100%);
}

.resource-distribution-area .m_map .mp.mp33 {
  left: calc(542/989*100%);
  top: calc(404/724*100%);
}

.resource-distribution-area .m_map .mp.mp34 {
  left: calc(465/989*100%);
  top: calc(360/724*100%);
}

.resource-distribution-area .m_map .mp.mp35 {
  left: calc(593/989*100%);
  top: calc(267/724*100%);
}

.resource-distribution-area .m_map .mp.mp36 {
  left: calc(545/989*100%);
  top: calc(592/724*100%);
}

.resource-distribution-area .m_map .mp.mp37 {
  left: calc(500/989*100%);
  top: calc(340/724*100%);
}

.resource-distribution-area .m_map .mp.mp38 {
  left: calc(412/989*100%);
  top: calc(355/724*100%);
}

.resource-distribution-area .m_map .mp .mito {
  color: var(--ztc-font-color09);
  position: absolute;
}

/* ========== CASE VIDEO CSS ========== */
.case-video-area {
  background-color: var(--ztc-bg-color07);
}

.case-video-area .video-box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.case-video-area .video-box #video {
  aspect-ratio: 16 / 9;
  height: auto;
  padding-top: 0;
  width: 100%;
}

.case-video-area .video-tab {
  position: relative;
}

.case-video-area .video-tab .arrow-box {
  display: flex;
  height: 1.5625rem;
  justify-content: center;
  position: absolute;
  width: 100%;
  z-index: var(--ztc-z-019);
}

.case-video-area .video-tab .arrow-box.arrow-down {
  bottom: .9375rem;
}

.case-video-area .video-tab .arrow-box .img-box {
  background-color: var(--ztc-bg-color16);
  border-radius: 100%;
  height: 1.5625rem;
  width: 1.5625rem;
}

.case-video-area .video-tab .arrow-box .img-box:hover {
  background-color: var(--ztc-bg-color17);
}

.case-video-area .video-tab:hover .arrow-box.arrow-up {
  animation: slideInDown;
  animation-duration: 500ms;
  display: flex;
}

.case-video-area .video-tab:hover .arrow-box.arrow-down {
  animation: slideInUp;
  animation-duration: 500ms;
  display: flex;
}

.case-video-area .video-tab .brand-logo-list-box {
  height: 38.75rem;
  overflow: scroll;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .media-classify {
  background-color: var(--ztc-bg-color13);
  border-radius: var(--ztc-border-radius-s4);
  color: var(--ztc-font-color01);
  margin: var(--ztc-spacing-10) 0;
  text-align: center;
  width: 100%;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .media-classify:first-of-type {
  margin-top: 0;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .brand-logo {
  margin: var(--ztc-spacing-5) 0;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .brand-logo:first-of-type {
  margin-top: 0;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .brand-logo:last-of-type {
  margin-bottom: 0;
}

.case-video-area .video-tab .brand-logo-list-box .brand-logo-list .brand-logo.active {
  border: .0625rem solid var(--ztc-border-color5);
  border-radius: var(--ztc-border-radius-s4);
}

/* ========== CASE CENTER CSS ========== */
.case-center-area {
  background-color: var(--ztc-bg-color09);
}

.case-center-area .case-center-box {
  background-color: var(--ztc-bg-color03);
  border: .0625rem solid var(--ztc-border-color3);
  position: relative;
}

.case-center-area .case-center-box .content-area {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.case-center-area .case-center-box .content-area p {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-700);
  letter-spacing: .0625rem;
}

.case-center-area .case-center-box .content-area .btn-area {
  display: flex;
  justify-content: flex-end;
}

/* ========== JOIN US CSS ========== */
.join-us-area1 .join-us-header h2 {
  background-clip: text;
  background-image: url(../img/all-images/media-advantage-img2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  color: var(--ztc-font-color11);
  font-style: oblique;
  font-weight: var(--ztc-font-weight-900);
  letter-spacing: .1875rem;
  position: relative;
  text-shadow: var(--ztc-shadow1);
  -webkit-background-clip: text;
}

.join-us-area1 .join-us-sliders {
  background-color: var(--ztc-bg-color07);
  border-radius: var(--ztc-border-radius-s8);
  box-shadow: var(--ztc-shadow7);
  display: block;
  position: relative;
}

.join-us-area1 .join-us-sliders .terminal-slider-nav-area .join-us-slider-img {
  overflow: hidden;
}

.join-us-area1 .join-us-sliders .terminal-slider-nav-area .join-us-slider-img img {
  border-radius: var(--ztc-border-radius-s8);
  height: 100%;
  width: 100%;
}

.join-us-area1 .join-us-sliders .join-us-content-slider .join-us-box h4 {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
}

.join-us-area1 .join-us-sliders .join-us-content-slider .join-us-box .bubble-container {
  color: var(--ztc-font-color06);
  font-weight: var(--ztc-font-weight-400);
  list-style: disc;
  list-style-position: inside;
  position: relative;
}

.join-us-area1 .join-us-sliders .join-us-arrows {
  position: absolute;
}

.join-us-area1 .join-us-sliders .join-us-arrows button {
  background-color: var(--ztc-bg-color10);
  border: none;
  border-radius: var(--ztc-border-radius-s8);
  display: inline-block;
  transition: all 400ms;
}

.join-us-area1 .join-us-sliders .join-us-arrows button:hover {
  background: var(--ztc-bg-color13);
  color: var(--ztc-font-color01);
  transform: translateY(-0.3125rem);
  transition: all 400ms;
}

.join-us-area2 {
  background-color: var(--ztc-bg-color07);
}

.join-us-area2 .content-box {
  overflow: hidden;
}

.join-us-area2 .content-box .content {
  position: relative;
  top: 0;
}

.join-us-area2 .content-box .content .job {
  align-items: center;
  background-color: var(--ztc-bg-color03);
  display: flex;
  flex-direction: row;
}

.join-us-area2 .content-box .content .job .job-container .job-post {
  font-weight: var(--ztc-font-weight-600);
  text-align: center;
}

.join-us-area2 .content-box .content .job .job-container .job-type,
.join-us-area2 .content-box .content .job .job-container .job-position {
  align-items: center;
  display: flex;
  flex-direction: row;
}

.join-us-area2 .content-box .content .job .job-container .job-type .icon-box,
.join-us-area2 .content-box .content .job .job-container .job-position .icon-box {
  background-color: var(--ztc-bg-color04);
  border-radius: var(--ztc-border-radius-s8);
}

.join-us-area2 .content-box .content .job .job-container .job-type .substance-box .substance,
.join-us-area2 .content-box .content .job .job-container .job-position .substance-box .substance {
  color: var(--ztc-font-color03);
  font-weight: var(--ztc-font-weight-600);
}

.join-us-area2 .content-box .content .job .job-container .job-desc .job-desc-header,
.join-us-area2 .content-box .content .job .job-container .job-require .job-require-header,
.join-us-area2 .content-box .content .job .job-container .job-concat .job-concat-header {
  color: var(--ztc-font-color03);
  font-weight: var(--ztc-font-weight-600);
}

.join-us-area2 .content-box .content .job .job-container .job-desc ul li,
.join-us-area2 .content-box .content .job .job-container .job-require ul li,
.join-us-area2 .content-box .content .job .job-container .job-concat ul li {
  list-style: auto;
}

.join-us-area2 .content-box .content .job .job-container .job-concat .job-concat-header span {
  color: var(--ztc-font-color06);
}

.join-us-area2 .content-box #ul {
  height: auto;
  position: fixed;
  z-index: var(--ztc-z-029);
}

.join-us-area2 .content-box #ul li {
  border: .125rem solid var(--ztc-border-color4);
  border-radius: 50%;
  list-style-type: none;
  opacity: 0.6;
}

.join-us-area2 .content-box #ul li.check-li {
  background-color: var(--ztc-bg-color04);
  opacity: 1;
}

/* ========== COMPANY PROFILE CSS ========== */
.company-profile-area .image-anime img {
  border-radius: var(--ztc-border-radius-s8);
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.company-profile-area .profile-content h2 {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
  letter-spacing: .125rem;
}

.company-profile-area .profile-content p {
  color: var(--ztc-font-color07);
  font-weight: var(--ztc-font-weight-400);
  text-indent: 2em;
}

.company-profile-area .profile-content .btn-area .header-btn img {
  transition: all 400ms;
}

.company-profile-area .profile-content .btn-area .header-btn:hover img {
  transform: rotate(45deg);
  transition: all 400ms;
}

/* ========== SERVICE PROCESS CSS ========== */
.service-process-area {
  background-image: url(../img/all-images/media-advantage-img1.jpg);
}

.service-process-area .process-wrapper {
  position: relative;
}

.service-process-area .process-wrapper .swiper-container {
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  position: relative;
  z-index: var(--ztc-z-1);
}

.service-process-area .process-wrapper .process-body:after {
  content: "";
  background-image: linear-gradient(to right, var(--ztc-bg-color14), var(--ztc-bg-color15), var(--ztc-bg-color14));
  height: .1875rem;
  left: 0;
  position: absolute;
  top: 3.1875rem;
  width: 100%;
  z-index: 0;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item {
  position: relative;
  float: left;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item>* {
  text-align: center;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item h3 {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
  letter-spacing: .125rem;
  opacity: 0.7;
  transition: all 100ms;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item:hover h3 {
  opacity: 0.9;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item i {
  background: url(../img/all-images/service-process-img2.png);
  background-position: right center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 2.0625rem;
  left: -25%;
  position: absolute;
  top: 2.1875rem;
  width: 75%;
  z-index: var(--ztc-z-3);
}

.service-process-area .process-wrapper .process-body .process-slide .process-item:hover i {
  background: url(../img/all-images/service-process-img3.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right center;
  margin-left: var(--ztc-spacing-13);
  width: 75%;
}

.service-process-area .process-wrapper .process-body .process-slide .process-info {
  border-radius: var(--ztc-border-radius-s2);
  display: block;
  margin: 0 auto;
  transition: all 300ms;
}

.service-process-area .process-wrapper .process-body .process-slide .process-item:hover .process-info {
  background: url(../img/all-images/service-process-img4.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.service-process-area .process-wrapper .process-body .process-slide .process-info .process-info-i {
  color: var(--ztc-font-color05);
}

.service-process-area .process-wrapper .process-body .process-slide .process-info .process-info-s {
  color: var(--ztc-font-color07);
  font-weight: var(--ztc-font-weight-400);
  overflow: hidden;
}

/* ========== MEDIA SHOW CSS ========== */
.media-show-area {
  padding-top: 0;
}

.media-show-area .search-form-area {
  align-items: flex-start;
  border-bottom: .0313rem solid var(--ztc-border-color2);
  border-top: .0313rem solid var(--ztc-border-color2);
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding: var(--ztc-spacing-20);
  width: 100%;
}

.media-show-area .search-form-area h4 {
  font-weight: var(--ztc-font-weight-600);
  margin-bottom: 0;
}

.media-show-area .search-form-area .city-list {
  color: var(--ztc-font-color06);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  font-weight: var(--ztc-font-weight-400);
  justify-items: start;
  width: 100%;
}

.media-show-area .search-form-area .city-list li .city-item.active {
  background-color: var(--ztc-bg-color04);
  border-radius: var(--ztc-border-radius-s18);
}

.media-show-area .single-media-show .image-anime {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.media-show-area .single-media-show .image-anime img {
  border-radius: var(--ztc-border-radius-s8);
  object-fit: cover;
}

.media-show-area .single-media-show .image-anime p {
  color: var(--ztc-font-color12);
  display: inline-block;
  font-weight: var(--ztc-font-weight-600);
}

/* ========== CASE CLASSIFY CSS ========== */
.case-classify-area .classify-item {
  outline: none;
  overflow: hidden;
}

.case-classify-area .classify-item .classify-project {
  display: block;
  position: relative;
  transition: all 300ms ease;
}

.case-classify-area .classify-item .classify-project::after {
  clear: both;
  content: "";
}

.case-classify-area .classify-item .classify-project .classify-img {
  overflow: hidden;
  position: relative;
  transition: all 300ms ease;
}

.case-classify-area .classify-item .classify-project .classify-img img {
  transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
}

.case-classify-area .classify-item .classify-project .bg-overlay {
  background-color: var(--ztc-bg-color12);
  bottom: 0;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: all 300ms ease;
  z-index: 0;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
}

.case-classify-area .classify-item .classify-project .line {
  height: -webkit-calc(50% - 1.25rem);
  height: -moz-calc(50% - 1.25rem);
  height: calc(50% - 1.25rem);
  left: .9375rem;
  position: absolute;
  top: .9375rem;
  transition: all 300ms ease;
  width: -webkit-calc(50% - 1.25rem);
  width: -moz-calc(50% - 1.25rem);
  width: calc(50% - 1.25rem);
  z-index: var(--ztc-z-019);
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  -webkit-transition: all 300ms ease;
}

.case-classify-area .classify-item .classify-project .line::before,
.case-classify-area .classify-item .classify-project .line::after {
  background-color: var(--ztc-bg-color03);
  content: "";
  display: block;
  transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  -webkit-transition: all 500ms ease;
}

.case-classify-area .classify-item .classify-project .line::before {
  height: .0625rem;
  width: 0;
}

.case-classify-area .classify-item .classify-project .line::after {
  height: 0;
  width: .0625rem;
}

.case-classify-area .classify-item .classify-project .line-bottom {
  bottom: .9375rem;
  left: auto;
  right: .9375rem;
  top: auto;
  transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}

.case-classify-area .classify-item .classify-project .classify-body {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 50%;
  position: absolute;
  text-align: center;
  top: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  z-index: var(--ztc-z-029);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

.case-classify-area .classify-item .classify-project .classify-body h3 {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-600);
  opacity: 0;
  text-transform: none;
  transform: translateY(3.125rem);
  transition: all 500ms ease;
  -moz-transform: translateY(3.125rem);
  -moz-transition: all 500ms ease;
  -ms-transform: translateY(3.125rem);
  -o-transform: translateY(3.125rem);
  -o-transition: all 500ms ease;
  -webkit-transform: translateY(3.125rem);
  -webkit-transition: all 500ms ease;
}

.case-classify-area .classify-item .classify-project:hover .classify-img img {
  transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}

.case-classify-area .classify-item .classify-project:hover .bg-overlay {
  opacity: 1;
}

.case-classify-area .classify-item .classify-project:hover .line::before {
  width: 100%;
}

.case-classify-area .classify-item .classify-project:hover .line::after {
  height: 100%;
}

.case-classify-area .classify-item .classify-project:hover .classify-body h3 {
  opacity: 1;
  transform: translateY(0);
  -moz-transform: translateY(0rem);
  -ms-transform: translateY(0rem);
  -o-transform: translateY(0rem);
  -webkit-transform: translateY(0rem);
}

/* ========== CASE DETAIL CSS ========== */
.case-detail-area .image-anime {
  display: flex;
  justify-content: center;
}

/* ========== COMPANY AREA CSS ========== */
.company-area .company-center-box {
  background-color: var(--ztc-bg-color03);
  border: .0625rem solid var(--ztc-border-color3);
  position: relative;
}

.company-area .company-center-box .content-area {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
}

.company-area .company-center-box .content-area p {
  color: var(--ztc-font-color07);
  font-weight: var(--ztc-font-weight-400);
  letter-spacing: .0625rem;
}

/* ========== FOOTER CSS ========== */
.footer-area1 .cta-container {
  position: relative;
  z-index: var(--ztc-z-1);
}

.footer-area1 .cta-container .cta-content-area {
  background-color: var(--ztc-bg-color04);
  border-radius: var(--ztc-border-radius-s8);
  position: relative;
}

.footer-area1 .cta-container .cta-content-area h2 {
  color: var(--ztc-font-color12);
  font-weight: var(--ztc-font-weight-600);
}

.footer-area1 .cta-container .cta-content-area p {
  color: var(--ztc-font-color07);
  font-weight: var(--ztc-font-weight-400);
  text-indent: 2em;
}

.footer-area1 .cta-container .cta-content-area .btn-area a {
  background-color: var(--ztc-bg-color13);
  color: var(--ztc-font-color01);
}

.footer-area2 .cta-container {
  background-image: url(../img/all-images/footer-img2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: var(--ztc-z-1);
}

.footer-area2 .cta-container .masking {
  background-color: var(--ztc-bg-color12);
}

.footer-area2 .cta-container .masking .cta-header {
  height: 6.25rem;
  overflow: hidden;
}

.footer-area2 .cta-container .masking .cta-header img {
  height: 100%;
}

.footer-area1 .footer-container {
  background-color: var(--ztc-bg-color13);
}

.footer-area1 .footer-container .footer-logo-area,
.footer-area2 .footer-container .footer-logo-area {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: flex-start;
}

.footer-area1 .footer-container .footer-header.padding-left1,
.footer-area2 .footer-container .footer-header.padding-left1 {
  display: flex;
  flex-direction: column;
}

.footer-area1 .footer-container .footer-header h3,
.footer-area2 .footer-container .footer-header h3 {
  color: var(--ztc-font-color01);
  display: inline-block;
  font-weight: var(--ztc-font-weight-400);
}

.footer-area1 .footer-container .footer-header ul li,
.footer-area2 .footer-container .footer-header ul li {
  align-items: flex-end;
  display: flex;
}

.footer-area1 .footer-container .footer-header ul li a,
.footer-area2 .footer-container .footer-header ul li a {
  color: var(--ztc-font-color01);
  display: inline-block;
  font-weight: var(--ztc-font-weight-400);
  letter-spacing: .0625rem;
  opacity: 0.8;
  transition: all 400ms;
}

.footer-area1 .footer-container .footer-header ul li a:hover,
.footer-area2 .footer-container .footer-header ul li a:hover {
  color: var(--ztc-font-color02);
  padding-left: var(--ztc-spacing-5);
  transition: all 400ms;
}

.footer-area1 .footer-container .footer-header ul li span,
.footer-area2 .footer-container .footer-header ul li span {
  display: inline-block;
}

.footer-area1 .footer-container .footer-header ul li span img,
.footer-area2 .footer-container .footer-header ul li span img {
  filter: brightness(0) invert(1);
}

.footer-area1 .footer-container .copyright,
.footer-area2 .footer-container .copyright {
  align-items: center;
  border-top: .0625rem solid var(--ztc-border-color3);
  display: flex;
  justify-content: flex-start;
  transition: all 400ms;
}

.footer-area1 .footer-container .copyright .pera p,
.footer-area1 .footer-container .copyright .ipc a,
.footer-area2 .footer-container .copyright .pera p,
.footer-area2 .footer-container .copyright .ipc a {
  color: var(--ztc-font-color01);
  font-weight: var(--ztc-font-weight-400);
  opacity: 0.8;
}

.footer-area2 .footer-container {
  position: relative;
  z-index: 1;
}

.footer-area2 .footer-container .footer-header h3,
.footer-area2 .footer-container .footer-header ul li a,
.footer-area2 .footer-container .copyright .pera p,
.footer-area2 .footer-container .copyright .ipc a {
  color: var(--ztc-font-color12);
}

.footer-area2 .footer-container .footer-header ul li span img {
  filter: brightness(1);
}

.footer-area2 .footer-container .footer-header ul li a:hover {
  color: var(--ztc-font-color10);
}

/* ========== SCROLL CSS ========== */
.scroll-up {
  align-items: center;
  background-color: var(--ztc-bg-color08);
  bottom: 4.375rem;
  box-shadow: var(--ztc-shadow6), var(--ztc-shadow6), var(--ztc-shadow4);
  color: var(--ztc-font-color10);
  display: flex;
  font-size: var(--ztc-font-size-s20);
  height: 2.5rem;
  justify-content: center;
  line-height: var(--ztc-line-height-h28);
  opacity: 0;
  position: fixed;
  right: 3%;
  transform: translate(0, 0) rotate(45deg) skewX(0) skewY(0) scale(1);
  transition: all 300ms;
  visibility: hidden;
  width: 2.5rem;
  z-index: var(--ztc-z--1);
}

.scroll-up.active {
  opacity: 1;
  visibility: visible;
  z-index: var(--ztc-z-069);
}

.scroll-up i {
  display: inline-block;
  line-height: 1;
  transform: translate(0, 0) rotate(-45deg) skewX(0) skewY(0) scale(1);
}

/* ========== ADAPTIVE CSS ========== */
@media (min-width: 576px) {
  .section-area {
    padding: var(--ztc-spacing-100) 0;
  }

  .section-area .section-header h3 {
    font-size: var(--ztc-font-size-s30);
    line-height: var(--ztc-line-height-h48);
  }

  .section-area .section-header h2 {
    font-size: var(--ztc-font-size-s60);
    line-height: var(--ztc-line-height-h72);
    margin-bottom: var(--ztc-spacing-60);
  }

  /* ========== HEADER CSS ========== */
  .header-area .sticky-header .container {
    padding: var(--ztc-spacing-15);
  }

  .header-area .sticky-header .logo a {
    width: 9.375rem;
  }

  .header-area .sticky-header .menu {
    display: block;
  }

  .header-area .sticky-header .menu ul li a {
    font-size: var(--ztc-font-size-s18);
    line-height: var(--ztc-line-height-h28);
    padding-bottom: var(--ztc-spacing-15);
    padding-left: var(--ztc-spacing-10);
    padding-top: var(--ztc-spacing-15);
  }

  .header-area .sticky-header .menu-btn {
    display: none;
  }

  .header-area .sticky-header.active .container {
    padding-top: var(--ztc-spacing-8);
    padding-bottom: var(--ztc-spacing-8);
  }

  .header-area .sticky-secondary.active {
    display: block;
  }

  /* ========== HERO CSS ========== */
  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide {
    height: 100vh;
    padding-bottom: var(--ztc-spacing-100);
    padding-top: var(--ztc-spacing-200);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .container {
    padding-left: var(--ztc-spacing-15);
    padding-right: var(--ztc-spacing-15);
    padding-top: var(--ztc-spacing-300);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .subtitle,
  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title {
    margin-bottom: var(--ztc-spacing-20);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span .inline-box {
    margin: 0 var(--ztc-spacing-8);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .subtitle,
  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span .inline-box .column-box span {
    font-size: var(--ztc-font-size-s36);
    line-height: var(--ztc-line-height-h45);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title,
  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .title span {
    font-size: var(--ztc-font-size-s85);
    line-height: var(--ztc-line-height-h85);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .translate,
  .hero-area1 .hero .hero-slider-container .swiper .swiper-wrapper .swiper-slide .text-box .slide-animation .translate span {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h20);
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-button-container {
    display: block;
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-next,
  .hero-area1 .hero .hero-slider-container .swiper .swiper-button-container .swiper-button-prev {
    font-size: var(--ztc-font-size-s20);
    height: 3.75rem;
    width: 3.75rem;
  }

  .hero-area1 .hero .hero-slider-container .swiper .swiper-pagination {
    display: none;
  }

  .hero-area2 {
    padding: var(--ztc-spacing-150) 0 var(--ztc-spacing-70);
  }

  .hero-area2 .inner-header a {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h16);
  }

  .hero-area2 .inner-header a i {
    margin: 0 var(--ztc-spacing-6);
  }

  .hero-area2 .inner-header h2 {
    font-size: var(--ztc-font-size-s60);
    line-height: var(--ztc-line-height-h72);
  }

  .hero-area2 .inner-header h4 a {
    font-size: var(--ztc-font-size-s20);
    line-height: var(--ztc-line-height-h20);
  }

  .hero-area2 .inner-header .title span {
    display: block;
    font-size: var(--ztc-font-size-s30);
    line-height: var(--ztc-line-height-h45);
    margin: 0 var(--ztc-spacing-15);
  }

  .hero-area2 .inner-header .title span.active {
    font-size: var(--ztc-font-size-s60);
    font-weight: var(--ztc-font-weight-600);
    line-height: var(--ztc-line-height-h72);
    margin: 0 var(--ztc-spacing-15);
  }

  /* ========== TIME MEDIA CSS ========== */
  .time-media-area .time-media-header h2 {
    margin-bottom: 0;
  }

  .time-media-area .diaphragm-image a,
  .time-media-area .vertical-image a {
    font-size: var(--ztc-font-size-s20);
    line-height: var(--ztc-line-height-h20);
  }

  .time-media-area .text-area {
    margin-bottom: var(--ztc-spacing-34);
  }

  .time-media-area .text-area .text-content {
    height: 100%;
    padding: var(--ztc-spacing-30);
    width: 100%;
  }

  .time-media-area .text-area .text-content p {
    font-size: var(--ztc-font-size-s18);
    line-height: var(--ztc-line-height-h32);
  }

  .time-media-area .text-area .text-content .btn-area a {
    font-size: var(--ztc-font-size-s14);
    line-height: var(--ztc-line-height-h16);
    padding: var(--ztc-spacing-8) var(--ztc-spacing-10);
  }

  /* ========== MEDIA ADVANTAGE CSS ========== */
  .media-advantage-area1 {
    font-size: var(--ztc-font-size-s14);
    line-height: var(--ztc-line-height-h21);
    padding: var(--ztc-spacing-150) 0 var(--ztc-spacing-170) 0;
  }

  .media-advantage-area1 .media-advantage ul li {
    background-position: 10rem 3.75rem;
    background-size: 3.75rem;
    padding-right: var(--ztc-spacing-80);
    margin-bottom: 0;
  }

  .media-advantage-area1 .media-advantage ul li .content-box .number {
    font-size: var(--ztc-font-size-s120);
    height: 9.375rem;
    line-height: var(--ztc-line-height-h150);
    width: 9.375rem;
  }

  .media-advantage-area1 .media-advantage ul li .content-box .text {
    font-size: var(--ztc-font-size-s36);
    line-height: var(--ztc-line-height-h45);
  }

  .media-advantage-area2 .accordion {
    height: auto;
  }

  .media-advantage-area2 .accordion ul li {
    float: left;
  }

  .media-advantage-area2 .accordion ul li .item .content-area h3 {
    font-size: var(--ztc-font-size-s26);
    line-height: var(--ztc-line-height-h36);
    width: 2.25rem;
  }

  .media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box {
    line-height: var(--ztc-line-height-h21);
  }

  .media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box .text-left h3 {
    font-size: var(--ztc-font-size-s26);
    font-weight: var(--ztc-font-weight-600);
    line-height: var(--ztc-line-height-h36);
  }

  .media-advantage-area2 .accordion ul li.active .item .image-description-area .image-description-box .description-area .text-box .text-right p {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h26);
  }

  .media-advantage-area2 .accordion ul li.active .item .content-area .description-area .text-box {
    height: 5rem;
  }

  /* ========== MEDIA DISTRIBUTION CSS ========== */
  .resource-distribution-area .content-box .resource-distribution-header {
    text-align: left;
  }

  .resource-distribution-area .content-box .counter-area {
    height: 32.5rem;
  }

  .resource-distribution-area .content-box .counter-area h4 {
    font-size: var(--ztc-font-size-s36);
  }

  .resource-distribution-area .content-box .counter-area h2 {
    align-items: flex-end;
    display: flex;
    flex-direction: row;
    font-size: var(--ztc-font-size-s30);
    line-height: var(--ztc-line-height-h36);
  }

  .resource-distribution-area .content-box .counter-area h2 span {
    font-size: var(--ztc-font-size-s60);
    line-height: var(--ztc-line-height-h72);
    margin-right: var(--ztc-spacing-10);
  }

  .resource-distribution-area .m_map {
    margin: 0 auto;
    width: 53.0625rem;
  }

  .resource-distribution-area .m_map .mp,
  .resource-distribution-area .m_map .mp:hover {
    background-position: -0.25rem;
    background-size: 1.875rem 1.875rem;
    height: 3.9375rem;
    width: 1.5rem;
  }

  .resource-distribution-area .m_map .mp .mito {
    bottom: 0;
    font-size: var(--ztc-font-size-s12);
    left: 0;
  }

  .resource-distribution-area .m_map .mp .find_mi1 {
    left: -0.75rem;
    width: 3.4375rem;
  }

  .resource-distribution-area .m_map .mp .find_mi2 {
    left: -0.5rem;
    width: 3.4375rem;
  }

  /* ========== CASE CENTER CSS ========== */
  .case-center-area .case-center-box .content-area {
    padding: var(--ztc-spacing-24);
  }

  .case-center-area .case-center-box .content-area p {
    font-size: var(--ztc-font-size-s28);
    line-height: var(--ztc-line-height-h36);
  }

  /* ========== JOIN US CSS ========== */
  .join-us-area1 .join-us-header h2 {
    font-size: var(--ztc-font-size-s90);
    line-height: var(--ztc-line-height-h100);
  }

  .join-us-area1 .join-us-sliders {
    padding: var(--ztc-spacing-24);
  }

  .join-us-area1 .join-us-sliders .join-us-content-slider .join-us-box h4 {
    font-size: var(--ztc-font-size-s24);
    line-height: var(--ztc-line-height-h24);
  }

  .join-us-area1 .join-us-sliders .join-us-content-slider .join-us-box .bubble-container {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h28);
    margin: var(--ztc-spacing-10);
    max-width: 25rem;
    padding: var(--ztc-spacing-5);
    width: max-content;
  }

  .join-us-area1 .join-us-sliders .join-us-arrows {
    display: block;
    right: -6.25rem;
    top: 37%;
  }

  .join-us-area1 .join-us-sliders .join-us-arrows button {
    height: 3.25rem;
    width: 3.25rem;
  }

  .join-us-area2 {
    padding: var(--ztc-spacing-80) 0;
  }

  .join-us-area2 .content-box {
    height: calc(100vh - 5rem);
  }

  .join-us-area2 .content-box .content .job {
    height: calc(100vh - 5rem);
    padding: 0 var(--ztc-spacing-50);
  }

  .join-us-area2 .content-box .content .job .job-container {
    width: 75rem;
  }

  .join-us-area2 .content-box .content .job .job-container .job-post {
    font-size: var(--ztc-font-size-s44);
    line-height: var(--ztc-line-height-h52);
  }

  .join-us-area2 .content-box .content .job .job-container .job-type .icon-box,
  .join-us-area2 .content-box .content .job .job-container .job-position .icon-box {
    height: 3.125rem;
    margin-right: var(--ztc-spacing-20);
    padding: var(--ztc-spacing-10);
    width: 3.125rem;
  }

  .join-us-area2 .content-box .content .job .job-container .job-type .substance-box .substance,
  .join-us-area2 .content-box .content .job .job-container .job-position .substance-box .substance {
    font-size: var(--ztc-font-size-s18);
  }

  .join-us-area2 .content-box .content .job .job-container .job-desc .job-desc-header,
  .join-us-area2 .content-box .content .job .job-container .job-require .job-require-header,
  .join-us-area2 .content-box .content .job .job-container .job-concat .job-concat-header {
    font-size: var(--ztc-font-size-s18);
    line-height: var(--ztc-line-height-h28);
  }

  .join-us-area2 .content-box .content .job .job-container .job-desc ul li,
  .join-us-area2 .content-box .content .job .job-container .job-require ul li,
  .join-us-area2 .content-box .content .job .job-container .job-concat ul li {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h24);
    margin-left: var(--ztc-spacing-20);
  }

  .join-us-area2 .content-box #ul {
    bottom: 9.375rem;
    right: .625rem;
    visibility: visible;
  }

  .join-us-area2 .content-box #ul li {
    height: 1.25rem;
    margin: var(--ztc-spacing-10);
    width: 1.25rem;
  }

  /* ========== COMPANY PROFILE CSS ========== */
  .company-profile-area .profile-content h2 {
    font-size: var(--ztc-font-size-s44);
    line-height: var(--ztc-line-height-h52);
  }

  .company-profile-area .profile-content p {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h26);
  }

  /* ========== SERVICE PROCESS CSS ========== */
  .service-process-area .process-wrapper {
    margin: 0 auto;
    padding-left: var(--ztc-spacing-10);
    padding-right: var(--ztc-spacing-10);
  }

  .service-process-area .process-wrapper .process-body {
    margin: 0 var(--ztc-spacing-25);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-item h3 {
    font-size: var(--ztc-font-size-s24);
    line-height: var(--ztc-line-height-h28);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-item:hover h3 {
    font-size: var(--ztc-font-size-s28);
    line-height: var(--ztc-line-height-h28);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-item i {
    margin-left: var(--ztc-spacing-10);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-info {
    padding: var(--ztc-spacing-20) var(--ztc-spacing-50);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-info .process-info-i {
    font-size: var(--ztc-font-size-s14);
    line-height: var(--ztc-line-height-h22);
  }

  .service-process-area .process-wrapper .process-body .process-slide .process-info .process-info-s {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h26);
  }

  /* ========== MEDIA SHOW CSS ========== */
  .media-show-area .search-form-area h4 {
    font-size: var(--ztc-font-size-s18);
    line-height: var(--ztc-line-height-h28);
    width: 5rem;
  }

  .media-show-area .search-form-area .city-list li .city-item {
    font-size: var(--ztc-font-size-s18);
    line-height: var(--ztc-line-height-h18);
    padding: var(--ztc-spacing-5) var(--ztc-spacing-10);
  }

  .media-show-area .single-media-show .single-header h2 {
    margin-bottom: var(--ztc-spacing-40);
  }

  .media-show-area .single-media-show .image-anime {
    height: auto;
    min-height: 29.25rem;
  }

  .media-show-area .single-media-show .image-anime img {
    height: 29.25rem;
  }

  .media-show-area .single-media-show .image-anime p {
    font-size: var(--ztc-font-size-s20);
    line-height: var(--ztc-line-height-h20);
  }

  /* ========== CASE CLASSIFY CSS ========== */
  .case-classify-area .classify-item .classify-project .classify-body h3 {
    font-size: var(--ztc-font-size-s56);
    line-height: var(--ztc-line-height-h64);
  }

  .case-classify-area .classify-item .classify-project .classify-body h3 a {
    font-size: var(--ztc-font-size-s56);
    line-height: var(--ztc-line-height-h64);
  }

  /* ========== CASE DETAIL CSS ========== */
  .case-detail-area .row {
    margin: var(--ztc-spacing-20) 0;
  }

  /* ========== COMPANY AREA CSS ========== */
  .company-area .company-center-box .content-area {
    padding: var(--ztc-spacing-24);
  }

  .company-area .company-center-box .content-area p {
    font-size: var(--ztc-font-size-s14);
    line-height: var(--ztc-line-height-h22);
  }

  .company-area .company-center-box .content-area p:last-of-type {
    height: 2.75rem;
  }

  /* ========== FOOTER CSS ========== */
  .footer-area1 .cta-container {
    margin-bottom: 5rem;
  }

  .footer-area1 .cta-container .cta-content-area {
    padding: var(--ztc-spacing-32) var(--ztc-spacing-50);
  }

  .footer-area1 .cta-container .cta-content-area h2 {
    font-size: var(--ztc-font-size-s56);
    line-height: var(--ztc-line-height-h64);
  }

  .footer-area1 .cta-container .cta-content-area p {
    font-size: var(--ztc-font-size-s14);
    line-height: var(--ztc-line-height-h26);
  }

  .footer-area2 .cta-container .masking {
    padding: var(--ztc-spacing-100) 0;
  }

  .footer-area2 .cta-container .masking .cta-header h2 {
    font-size: var(--ztc-font-size-s44);
    line-height: var(--ztc-line-height-h52);
  }

  .footer-area1 .footer-container {
    margin-top: var(--ztc-spacing--260);
    padding: var(--ztc-spacing-230) 0 var(--ztc-spacing-32) 0;
  }

  .footer-area1 .footer-container .footer-logo-area img,
  .footer-area2 .footer-container .footer-logo-area img {
    height: 12.5rem;
    width: 12.5rem;
  }

  .footer-area1 .footer-container .footer-header.padding-left1,
  .footer-area2 .footer-container .footer-header.padding-left1 {
    margin-left: var(--ztc-spacing-30);
  }

  .footer-area1 .footer-container .footer-header h3,
  .footer-area2 .footer-container .footer-header h3 {
    font-size: var(--ztc-font-size-s24);
    line-height: var(--ztc-line-height-h64);
    margin-bottom: 0;
  }

  .footer-area1 .footer-container .footer-header ul li a,
  .footer-area2 .footer-container .footer-header ul li a {
    font-size: var(--ztc-font-size-s16);
    line-height: var(--ztc-line-height-h22);
    margin-top: var(--ztc-spacing-24);
  }

  .footer-area1 .footer-container .footer-header ul li span,
  .footer-area2 .footer-container .footer-header ul li span {
    margin-right: var(--ztc-spacing-12);
  }

  .footer-area1 .footer-container .footer-header ul li span img,
  .footer-area2 .footer-container .footer-header ul li span img {
    height: 1.375rem;
    width: 1.375rem;
  }

  .footer-area1 .footer-container .copyright,
  .footer-area2 .footer-container .copyright {
    padding-top: var(--ztc-spacing-24);
  }

  .footer-area1 .footer-container .copyright .pera,
  .footer-area2 .footer-container .copyright .pera {
    margin-right: var(--ztc-spacing-20);
  }

  .footer-area1 .footer-container .copyright .pera p,
  .footer-area2 .footer-container .copyright .pera p,
  .footer-area1 .footer-container .copyright .ipc a,
  .footer-area2 .footer-container .copyright .ipc a {
    font-size: var(--ztc-font-size-s16);
  }

  .footer-area2 .footer-container {
    padding: var(--ztc-spacing-100) 0 var(--ztc-spacing-32) 0;
  }
}