.gateway-wrap {
  position: relative;
  padding-top: 73px;
}
.gateway-inner {
  max-width: 1120px;
  width: 100%;
  margin: 0 auto;
}

.gateway-section01 {
  display: flex;
  padding: 176px 0 80px;
  justify-content: space-between;
}
.gateway-section01 .gw-sg-area {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.gateway-section01 .gw-sg-title {
  font-size: 20px;
  font-weight: 500;
  line-height: 32px;
}

.gateway-section02 {
  position: relative;
  overflow: hidden;
}
.gateway-section02 .gw-keyvisual {
}
.gateway-section02 .gw-keyvisual img {
  width: 100%;
  height: 100%;
  transform: scale(1.2);
  transition: 1s;
  will-change: transform;
  object-fit: cover;
  object-position: center;
}
.gateway-section02 .gw-kv-swiper {
  height: calc(100vh - 73px);
}
.gateway-section02 .gw-kv-swiper .video-box {
  width: 100%;
  height: 100%;
}
.gateway-section02 .gw-kv-swiper video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gateway-section02 .gw-kv-swiper .swiper-slide {
  overflow: hidden;
}
.gateway-section02 .gw-kv-swiper .swiper-button-next,
.gateway-section02 .gw-kv-swiper .swiper-button-prev {
  width: 64px;
  height: 64px;
  background: url("../image/icon_kv_arrow.svg") no-repeat center;
}
.gateway-section02 .gw-kv-swiper .swiper-button-next:after,
.gateway-section02 .gw-kv-swiper .swiper-button-prev:after {
  display: none;
}
.gateway-section02 .gw-kv-swiper .swiper-button-next.swiper-button-disabled,
.gateway-section02 .gw-kv-swiper .swiper-button-prev.swiper-button-disabled {
  display: none;
}
.gateway-section02 .gw-kv-swiper .swiper-button-next {
}
.gateway-section02 .gw-kv-swiper .swiper-button-prev {
  transform: rotate(180deg);
}
.gateway-section02 .gw-kv-swiper .swiper-pagination {
  bottom: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.gateway-section02 .gw-kv-swiper .swiper-pagination .swiper-pagination-bullet {
  margin: 0;
  background: #fff;
  opacity: 1;
}
.gateway-section02 .gw-keyvisual .gw-kv-text {
  position: absolute;
  bottom: 112px;
  left: 0;
  right: 0;
  display: flex;
  font-size: 56px;
  font-weight: 500;
  color: #fff;
  line-height: 90px;
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  transition: 1s;
  transform: scale(1.2);
}
.gateway-section02 .gw-keyvisual .gw-kv-text .desc {
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  opacity: 0.8;
}
.gateway-section02
  .gw-kv-swiper
  .swiper-pagination
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 14px;
  height: 14px;
  border: 3px solid #fff;
  background: transparent;
}

.gateway-section03 {
  min-height: 100vh;
  padding-top: 80px;
}
.gateway-section03 .gw-tab {
  position: sticky;
  top: 186px;
  display: flex;
  font-size: 16px;
  line-height: 26px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  z-index: 1;
}
.gateway-section03 .gw-tab li {
  position: relative;
  display: flex;
  align-items: center;
  color: #666;
  gap: 8px;
}
.gateway-section03 .gw-tab li:first-child:before {
  display: none;
}
.gateway-section03 .gw-tab li:before {
  width: 40px;
  height: 1px;
  background: #e9e9e9;
  content: "";
}
.gateway-section03 .gw-tab li a {
  display: flex;
  align-items: center;
  gap: 6px;
}
.gateway-section03 .gw-tab li .active {
  color: #191919;
}
.gateway-section03 .gw-tab li .active > span {
  color: #0793ea;
}
.gateway-section03 .gw-service-box {
  position: sticky;
  top: 212px;
  /* height: 64vh; */
  height: 560px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gateway-section03 .gw-service-box:nth-child(odd) .gw-service {
  border: 1px solid #e9e9e9;
  background: #fff;
}
.gateway-section03 .gw-service-box.gw-spacer {
  min-height: 480px;
}
.gateway-section03 .gw-service-box.gw-spacer .gw-service {
  border: none;
  background: transparent;
}
.gateway-section03 .gw-service {
  position: relative;
  display: flex;
  width: 100%;
  height: 480px;
  padding: 48px 0 96px 64px;
  background: #f5f5f5;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
}
.gateway-section03 .gw-title {
  display: flex;
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
  align-items: center;
  gap: 12px;
}
.gateway-section03 .gw-title .gw-num {
  min-width: 24px;
  font-size: 14px;
  line-height: 22px;
}
.gateway-section03 .gw-service-area {
  position: relative;
  display: flex;
  margin-left: 36px;
  flex-direction: column;
  gap: 40px;
  z-index: 2;
}
.gateway-section03 .gw-description {
  display: flex;
  width: 100%;
  max-width: 560px;
  height: 152px;
  font-size: 24px;
  /* font-weight: 500; */
  line-height: 38px;
  align-items: center;
}
.gateway-section03 .gw-button-box {
  display: flex;
  gap: 8px;
}
.gateway-section03 .gw-button-box .btn-type2 {
  min-width: inherit;
  padding: 0 32px;
}
.gateway-section03 .gw-image {
  position: absolute;
  bottom: 0;
  right: 80px;
  z-index: 1;
}

.gateway-section04 {
  position: relative;
}
.gateway-section04 .gw-showroom-container {
  /* 4 steps * 1.5 sensitivity = 6 viewports. Update if steps or sensitivity changes */
  height: calc(100vh * 6);
}
.gateway-section04 .gw-sticky {
  position: sticky;
  top: 54px;
  height: 100vh;
  border-top: 1px solid #e9e9e9;
}
.gateway-section04 .gw-showroom-description {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  padding: 56px 80px;
  align-items: center;
  justify-content: space-between;
  z-index: 1;
}
.gateway-section04 .gw-showroom-description > span {
  text-align: right;
}
.gateway-section04 .gw-showroom-box {
  position: absolute;
  top: 50%;
  left: 80px;
  display: inline-flex;
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
  gap: 16px;
  flex-direction: column;
  transform: translate(0, -50%);
  /* mix-blend-mode: difference; */
  z-index: 1;
}
.gateway-section04 .gw-showroom-box .gw-showroom-title {
  font-size: 44px;
  line-height: 56px;
}
.gateway-section04 .gw-showroom-box .gw-showroom-link > a {
  display: inline-flex;
  font-size: 14px;
  line-height: 22px;
  align-items: center;
  gap: 2px;
}
.gateway-section04 .gw-showroom-box .gw-showroom-link > a:after {
  width: 16px;
  height: 16px;
  background: url("../image/icon_arrow.svg") no-repeat center;
  content: "";
}
.gateway-section04 .gw-showroom-box + .gw-showroom-group {
  border-top: none;
}
.gateway-section04 .gw-showroom-box .gw-showroom-description {
  display: none;
}
.gateway-section04 .gw-showroom-group {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  border-top: 1px solid #e9e9e9;
  background: #fff;
  align-items: center;
  justify-content: center;
}
.gateway-section04 .container {
  width: 350px;
  height: 521px;
  position: relative;
  perspective: 1200px;
}
.gateway-section04 .top-block {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
.gateway-section04 .bottom-block {
  position: absolute;
  top: 260px;
  left: 0;
  z-index: 1;
}
.gateway-section04 .block,
.gateway-section04 .face {
  margin: 0;
  border: none;
  box-shadow: none;
  outline: none;
}
.gateway-section04 .block {
  width: 350px;
  height: 260.5px;
  position: absolute;
  left: 0;
  transform-style: preserve-3d;
  transition: transform 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.6s;
  z-index: 1;
}
.gateway-section04 .face {
  position: absolute;
  width: 350px;
  height: 260.5px;
  top: 0;
  left: 0;
  backface-visibility: hidden;
  z-index: 1;
  transition: opacity 0.6s;
}
.gateway-section04 .top-block .front,
.gateway-section04 .bottom-block .front {
  background-image: url("../image/img_showroom01.jpg");
  background-size: auto 200%;
  background-repeat: no-repeat;
  width: 350px;
  height: 261px;
  left: 0;
  overflow: hidden;
  background-color: transparent;
  color: transparent;
  text-shadow: none;
  background-blend-mode: normal;
  clip-path: none;
  transform: translateZ(130.25px);
}
.gateway-section04 .top-block .front {
  background-position: 55% top;
}
.gateway-section04 .bottom-block .front {
  background-position: 55% bottom;
}
.gateway-section04 .face.left,
.gateway-section04 .face.right {
  width: 350px !important;
  height: 260.5px !important;
  box-sizing: border-box;
  padding: 0 16px 16px 16px;
  background-color: #fff;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  font-size: 20px;
  font-weight: bold;
  color: #222;
  z-index: 3;
}
.gateway-section04 .top-block .left {
  transform: rotateY(-90deg) translateZ(175px);
}
.gateway-section04 .bottom-block .right {
  transform: rotateY(90deg) translateZ(175px);
}
.gateway-section04 .background-fade {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  background: url("../image/img_showroom01.jpg") center/cover no-repeat;
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  transition: opacity 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.gateway-section04 .gw-mo-text {
  display: none;
}
.gateway-section04 .gw-showroom-group:not(.first) {
  transform: translate3d(0, calc(100% - 100% * var(--progress, 0)), 0);
}
.gateway-section04 .gw-showroom-group.gw-showroom-type01 {
}
.gateway-section04 .gw-showroom-group.gw-showroom-type01 .top-block .front,
.gateway-section04 .gw-showroom-group.gw-showroom-type01 .bottom-block .front {
  background-image: url("../image/img_showroom02.jpg");
}
.gateway-section04 .gw-showroom-group.gw-showroom-type01 .top-block .front {
  background-position: 82% top;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type01 .bottom-block .front {
  background-position: 82% bottom;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type01 .background-fade {
  background: url("../image/img_showroom02.jpg") center/cover no-repeat;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type02 {
}
.gateway-section04 .gw-showroom-group.gw-showroom-type02 .top-block .front,
.gateway-section04 .gw-showroom-group.gw-showroom-type02 .bottom-block .front {
  background-image: url("../image/img_showroom03.jpg");
}
.gateway-section04 .gw-showroom-group.gw-showroom-type02 .top-block .front {
  background-position: 59% top;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type02 .bottom-block .front {
  background-position: 59% bottom;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type02 .background-fade {
  background: url("../image/img_showroom03.jpg") center/cover no-repeat;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type03 {
}
.gateway-section04 .gw-showroom-group.gw-showroom-type03 .top-block .front,
.gateway-section04 .gw-showroom-group.gw-showroom-type03 .bottom-block .front {
  background-image: url("../image/img_showroom04.jpg");
}
.gateway-section04 .gw-showroom-group.gw-showroom-type03 .top-block .front {
  background-position: 90% top;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type03 .bottom-block .front {
  background-position: 90% bottom;
}
.gateway-section04 .gw-showroom-group.gw-showroom-type03 .background-fade {
  background: url("../image/img_showroom04.jpg") center/cover no-repeat;
}

.gateway-section05 {
  position: relative;
  background: #f5f5f5;
}
.gateway-section05 .gw-offline-container {
  height: 300vh;
}
.gateway-section05 .gw-offline-sticky {
  position: sticky;
  top: 54px;
  height: 100vh;
}
.gateway-section05 .gw-offline-content {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: 1120px;
  display: flex;
  flex-wrap: wrap;
  gap: 80px;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.gateway-section05 .gw-offline-map {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  opacity: 0;
}
.gateway-section05 [data-current-index="1"] [data-map-item="1"],
.gateway-section05 [data-current-index="2"] [data-map-item="2"],
.gateway-section05 [data-current-index="3"] [data-map-item="3"] {
  opacity: 1;
}
.gateway-section05 .gw-map-area {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  width: 100%;
  max-width: 1120px;
  height: 617px;
  transform: translate(-50%, -50%);
  justify-content: flex-end;
}
.gateway-section05 .gw-map {
  width: 538px;
  height: 617px;
}
.gateway-section05 .gw-header {
  display: flex;
  width: 100%;
  max-width: 620px;
  font-size: 16px;
  line-height: 26px;
  flex-direction: column;
  gap: 8px;
}
.gateway-section05 .gw-header-mo {
  display: none;
}
.gateway-section05 .gw-title {
  font-size: 40px;
  font-weight: 500;
  line-height: 64px;
}
.gateway-section05 .gw-text {
}
.gateway-section05 .gw-map-link {
  display: flex;
  flex-direction: column;
  /* gap: 32px; */
}
.gateway-section05 .gw-item {
  position: relative;
  display: flex;
  padding-bottom: 32px;
  align-items: center;
  gap: 12px;
}
.gateway-section05 .gw-item:last-child {
  padding-bottom: 0;
}
.gateway-section05 .gw-item:before {
  position: absolute;
  top: 6px;
  left: 20px;
  width: 1px;
  height: 0;
  background: #ccc;
  transition: height 0.5s;
  content: "";
}
.gateway-section05 .gw-item:last-child:before {
  display: none;
}
.gateway-section05 .gw-item .gw-icon {
  position: relative;
  width: 40px;
  height: 40px;
  background: #ccc;
  border-radius: 100%;
  flex-shrink: 0;
  z-index: 1;
}
.gateway-section05 .gw-item .gw-icon:before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  background: url("../image/icon_map02.svg") no-repeat center;
  transform: translate(-50%, -50%);
  content: "";
}
.gateway-section05 .gw-item:first-child .gw-icon:before {
  background: url("../image/icon_map01.svg") no-repeat center;
}
.gateway-section05 .gw-item:last-child .gw-icon:before {
  background: url("../image/icon_map03.svg") no-repeat center;
}
/* .gateway-section05 .gw-item:before {width:40px;height:40px;background:#ccc;border-radius:100%;content:'';} */
/* .gateway-section05 .gw-item .gw-icon:after {
  position: absolute;
  top: -44px;
  left: 20px;
  width: 1px;
  height: 0;
  background: #ccc;
  transition: height 0.5s;
  content: "";
} */
.gateway-section05 .gw-item:first-child .gw-icon:after {
  display: none;
}
.gateway-section05 [data-current-index="1"] [data-item="1"] .gw-area,
.gateway-section05 [data-current-index="2"] [data-item="2"] .gw-area,
.gateway-section05 [data-current-index="3"] [data-item="3"] .gw-area {
  color: #191919;
}
.gateway-section05 [data-current-index="1"] [data-item="1"] .gw-link:after,
.gateway-section05 [data-current-index="2"] [data-item="2"] .gw-link:after,
.gateway-section05 [data-current-index="3"] [data-item="3"] .gw-link:after {
  opacity: 1;
}
.gateway-section05 [data-current-index="1"] [data-item="1"] .gw-icon,
.gateway-section05 [data-current-index="2"] [data-item="2"] .gw-icon,
.gateway-section05 [data-current-index="3"] [data-item="3"] .gw-icon {
  background: #002c5f;
  z-index: 2;
}
/* .gateway-section05 [data-current-index="2"] [data-item="2"] .gw-icon:after,
.gateway-section05 [data-current-index="3"] [data-item="2"] .gw-icon:after,
.gateway-section05 [data-current-index="3"] [data-item="3"] .gw-icon:after {
  height: 44px;
} */
.gateway-section05 [data-current-index="2"] [data-item="1"]:before,
.gateway-section05 [data-current-index="3"] [data-item="1"]:before,
.gateway-section05 [data-current-index="3"] [data-item="2"]:before {
  height: 100%;
}
.gateway-section05 .gw-area {
  color: #666;
}
.gateway-section05 .gw-link {
  display: inline-flex;
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
  align-items: center;
  gap: 2px;
}
.gateway-section05 .gw-link:after {
  width: 16px;
  height: 16px;
  background: url("../image/icon_arrow.svg") no-repeat center;
  opacity: 0.5;
  content: "";
}
.gateway-section05 .gw-description {
  display: block;
  margin-top: 4px;
}

.gateway-section06 {
  position: relative;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 120px 0 0 80px;
}
.gateway-section06 .gw-header {
  display: flex;
  width: 100%;
  max-width: 1120px;
  justify-content: space-between;
}
.gateway-section06 .gw-header .gw-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
}
.gateway-section06 .gw-header .gw-text-area {
  display: flex;
  width: 100%;
  max-width: 560px;
  flex-direction: column;
  gap: 120px;
}
.gateway-section06 .gw-header .gw-description {
  display: flex;
  font-size: 16px;
  line-height: 26px;
  flex-direction: column;
  gap: 16px;
}
.gateway-section06 .gw-header .gw-text {
  font-size: 40px;
  font-weight: 500;
  line-height: 64px;
}

.gateway-section06 .cs-swiper {
  overflow: visible;
  display: flex;
}
.gateway-section06 .cs-swiper .swiper-slide {
  width: 100%;
  max-width: 280px;
}
.gateway-section06 .cs-swiper .swiper-slide a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-shrink: 0;
}
.gateway-section06 .gw-slide-text {
  display: flex;
  padding-right: 40px;
  flex-direction: column;
  gap: 8px;
}
.gateway-section06 .gw-slide-text .gw-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
}
.gateway-section06 .gw-slide-text .gw-text {
  height: 66px;
  color: #666;
}
.gateway-section06 .gw-image {
  overflow: hidden;
}
.gateway-section06 .gw-image img {
  transition: 0.5s;
}
.gateway-section06 .gw-image img:hover {
  transform: scale(1.1);
}

.gateway-section07 {
  border-top: 1px solid #e9e9e9;
  padding: 120px 0 96px;
  /* For 3 steps + 1 buffer, update if number of categories changes */
  height: calc(100vh * 4);
}
.gateway-section07 .gw-sticky {
  position: sticky;
  top: 130px;
  height: 100vh;
  background: #fff;
  z-index: 1;
}
.gateway-section07 .gw-title {
  display: block;
  font-size: 40px;
  font-weight: 500;
  line-height: 64px;
  text-align: center;
}
.gateway-section07 .gw-content {
  display: flex;
  min-height: 574px;
  margin-top: 80px;
  align-items: center;
  justify-content: space-between;
}
.gateway-section07 .gw-content:before {
  width: 23px;
  height: 22px;
  background: url("../image/icon_arrow02.svg") no-repeat center;
  order: 1;
  flex-shrink: 0;
  content: "";
}
.gateway-section07 .gw-left {
  max-width: 500px;
  width: 100%;
  flex-grow: 1;
  order: 0;
}
.gateway-section07 .gw-right {
  position: relative;
  display: flex;
  max-width: 468px;
  width: 100%;
  height: 468px;
  flex-shrink: 0;
  order: 2;
}
.gateway-section07 .gw-right .gw-area {
  display: none;
}
.gateway-section07 .gw-right .gw-area:first-child {
  display: block;
}
/* .gateway-section07 .gw-right .gw-area {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  width: 210px;
  height: 210px;
  border: 1px solid #002c5f;
  background: #002c5f;
  border-radius: 100%;
  color: #fff;
  align-items: center;
  justify-content: center;
}
.gateway-section07 .gw-right .gw-area > span {
  display: flex;
  font-size: 16px;
  line-height: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.gateway-section07 .gw-right .gw-area > span:before {
  width: 32px;
  height: 32px;
  background: url("../image/icon_counsel01.png") no-repeat center / 100%;
  content: "";
}
.gateway-section07 .gw-right .gw-area:nth-child(2) {
  right: 0;
  left: auto;
  background: transparent;
  color: #002c5f;
}
.gateway-section07 .gw-right .gw-area:nth-child(2) > span:before {
  background: url("../image/icon_counsel02.png") no-repeat center / 100%;
}
.gateway-section07 .gw-right .gw-area:nth-child(3) {
  top: auto;
  bottom: 0;
  background: transparent;
  color: #002c5f;
}
.gateway-section07 .gw-right .gw-area:nth-child(3) > span:before {
  background: url("../image/icon_counsel04.png") no-repeat center / 100%;
}
.gateway-section07 .gw-right .gw-area:last-child {
  top: auto;
  bottom: 0;
  right: 0;
  left: auto;
  color: #fff;
}
.gateway-section07 .gw-right .gw-area:last-child > span:before {
  background: url("../image/icon_counsel03.png") no-repeat center / 100%;
} */
.gateway-section07 .gw-counsel-category {
  border-bottom: 1px solid #e9e9e9;
}
.gateway-section07 .gw-counsel-category:first-child {
  border-top: 1px solid #e9e9e9;
}
.gateway-section07 .gw-counsel-category .gw-sub-title {
  display: flex;
  width: 100%;
  padding: 16px;
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
  align-items: center;
  justify-content: space-between;
}
.gateway-section07 .gw-counsel-category .gw-sub-title:after {
  width: 20px;
  height: 20px;
  background: url("../image/icon_plus.svg") no-repeat center;
  content: "";
}
.gateway-section07 .gw-counsel-category .gw-cont-box {
  overflow: hidden;
  display: none;
}
.gateway-section07 .gw-counsel-category .gw-thumbnail-mo {
  display: none;
}
.gateway-section07 .gw-counsel-category .gw-cont {
}
.gateway-section07 .gw-counsel-category ul {
  display: flex;
  padding: 0 16px 40px;
  flex-direction: column;
  gap: 8px;
  counter-reset: number 0;
}
.gateway-section07 .gw-counsel-category ul li {
  position: relative;
  display: flex;
  padding-left: 24px;
  flex-direction: column;
  gap: 8px;
}
.gateway-section07 .gw-counsel-category ul li:before {
  position: absolute;
  top: 1px;
  left: 0;
  min-width: 6px;
  font-size: 12px;
  color: #999;
  line-height: 20px;
  counter-increment: number 1;
  content: counter(number);
}
.gateway-section07 .gw-counsel-category .gw-box:has(.btn) {
  margin-top: 16px;
}
.gateway-section07 .gw-counsel-category .btn-type2 {
  padding: 0 32px;
}
.gateway-section07 .gw-counsel-category .gw-call {
  display: inline-flex;
  padding: 8px 12px;
  background: #f5f5f5;
  border-radius: 4px;
  font-size: 12px;
  color: #0793ea;
  line-height: 20px;
  align-items: center;
  gap: 6px;
}
.gateway-section07 .gw-counsel-category .gw-call:before {
  width: 16px;
  height: 16px;
  background: url("../image/icon_call.svg") no-repeat center;
  content: "";
}
.gateway-section07 .gw-counsel-category .text-info {
  font-size: 12px;
  color: #666;
  line-height: 20px;
}
.gateway-section07 .gw-counsel-category.on .gw-sub-title {
  padding-block: 32px 20px;
}
.gateway-section07 .gw-counsel-category.on .gw-sub-title:after {
  background: url("../image/icon_minus.svg") no-repeat center;
}

.gateway-fix-button {
  position: fixed;
  bottom: 24px;
  left: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  gap: 12px;
  transform: translate(-50%, 0);
  z-index: 1;
}
.gateway-fix-button.move {
  transform: translateY(-20px);
}
.gateway-fix-button.on {
  display: flex;
}
.gateway-fix-button button {
  height: 56px;
}
.gateway-fix-button .lottie-btn {
}
.gateway-fix-button .mo-fixed-btn {
  display: none;
  width: 56px;
  height: 56px;
  background: url("../image/btn-fixed-menu.svg") no-repeat center / cover;
}

.lottie-container {
  width: 100%;
  height: 100%;
  pointer-events: none; /* 클릭 이벤트는 button에만 */
}

.lottie-btn {
  position: relative;
  will-change: transform;
}

.japan-dot {
  position: absolute;
  width: 12px;
  height: 12px;
  background: #e0e0e0;
  border-radius: 50%;
}

.gw-map-area-mobile {
  display: none;
}

@media (max-width: 1119px) {
  .gw-map-area {
    display: none !important;
  }
  .gw-map-area-mobile {
    display: block !important;
  }
  /* .gw-map-link .gw-item {
    display: none;
  } */
  .gw-map-link .gw-item.active {
    display: flex; /* or block, depending on your layout */
  }

  .gw-map-link {
    margin-top: 150px;
  }
  .gateway-section07 {
    height: auto !important;
    padding-top: 80px;
  }
  .gateway-section07 .gw-sticky {
    position: static;
    height: auto;
  }
}

@media screen and (max-width: 1119px) {
  /* Gateway 페이지에서만 top 버튼 위치 변경 */
  .hmj-container:has(.gateway-wrap) ~ .btn-top-box {
    bottom: 34px;
  }

  .gateway-wrap {
    padding-top: 109px;
  }
  .gateway-inner {
    padding-inline: 20px;
  }

  .gateway-section01 {
    padding-block: 80px 40px;
    flex-direction: column;
    gap: 120px;
  }
  .gateway-section01 .gw-sg-area {
  }
  .gateway-section01 .gw-sg-area + .gw-sg-area {
    gap: 12px;
  }
  .gateway-section01 .gw-sg-title {
    font-size: 16px;
    line-height: 26px;
  }

  .gateway-section02 {
  }
  .gateway-section02 .gw-keyvisual {
  }
  .gateway-section02 .gw-keyvisual img {
    transform: scale(1) !important;
  }
  .gateway-section02 .gw-kv-swiper {
    height: calc(100vh - 109px);
  }
  .gateway-section02 .gw-kv-swiper .video-box {
  }
  .gateway-section02 .gw-kv-swiper video {
    
  }
  .gateway-section02 .gw-kv-swiper .swiper-slide {
    
  }
  .gateway-section02 .gw-kv-swiper .swiper-button-next,
  .gateway-section02 .gw-kv-swiper .swiper-button-prev {
    display: none;
  }
  .gateway-section02 .gw-kv-swiper .swiper-button-next:after,
  .gateway-section02 .gw-kv-swiper .swiper-button-prev:after {
  }
  .gateway-section02 .gw-kv-swiper .swiper-button-next.swiper-button-disabled,
  .gateway-section02 .gw-kv-swiper .swiper-button-prev.swiper-button-disabled {
  }
  .gateway-section02 .gw-kv-swiper .swiper-button-next {
  }
  .gateway-section02 .gw-kv-swiper .swiper-button-prev {
  }
  .gateway-section02 .gw-kv-swiper .swiper-pagination {
    bottom: 40px;
    gap: 12px;
  }
  .gateway-section02
    .gw-kv-swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
  }
  .gateway-section02 .gw-keyvisual .gw-kv-text {
    bottom: 80px;
    padding: 0 20px;
    font-size: 24px;
    line-height: 38px;
    text-align: left;
    align-items: flex-start;
    gap: 8px;
    transform: scale(1) !important;
  }
  .gateway-section02 .gw-keyvisual .gw-kv-text .desc {
    font-size: 13px;
    line-height: 20px;
    opacity: 1;
  }
  .gateway-section02
    .gw-kv-swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 12px;
    height: 12px;
  }

  .gateway-section03 {
    min-height: inherit;
    padding-bottom: 80px;
  }
  .gateway-section03 .gw-tab {
    overflow: hidden;
    top: 149px;
    font-size: 14px;
    line-height: 22px;
    white-space: nowrap;
    justify-content: flex-start;
  }
  .gateway-section03 .gw-tab li {
  }
  .gateway-section03 .gw-tab li:first-child:before {
  }
  .gateway-section03 .gw-tab li:before {
    width: 24px;
  }
  .gateway-section03 .gw-tab li a {
  }
  .gateway-section03 .gw-tab li .active {
  }
  .gateway-section03 .gw-tab li .active > span {
  }
  .gateway-section03 .gw-service-box {
    top: 211px;
    height: auto;
    margin-top: 40px;
  }
  .gateway-section03 .gw-service-box:nth-child(odd) .gw-service {
  }
  .gateway-section03 .gw-service-box.gw-spacer {
  }
  .gateway-section03 .gw-service-box.gw-spacer .gw-service {
  }
  .gateway-section03 .gw-service {
    height: 464px;
    padding: 24px;
    justify-content: flex-start;
    gap: 16px;
  }
  .gateway-section03 .gw-title {
    font-size: 13px;
    line-height: 20px;
    align-items: flex-start;
    gap: 6px;
  }
  .gateway-section03 .gw-title .gw-num {
    min-width: 20px;
    font-size: 13px;
    line-height: 20px;
  }
  .gateway-section03 .gw-service-area {
    margin: 0;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-grow: 1;
  }
  .gateway-section03 .gw-description {
    height: auto;
    font-size: 18px;
    line-height: 30px;
  }
  .gateway-section03 .gw-button-box {
    flex-direction: column;
  }
  .gateway-section03 .gw-button-box .btn-type2 {
  }
  .gateway-section03 .gw-image {
    display: none;
  }

  .gateway-section04 {
  }
  .gateway-section04 .gw-showroom-container {
  }
  .gateway-section04 .gw-sticky {
    top: 0;
  }
  .gateway-section04 .gw-showroom-description {
    display: none;
  }
  .gateway-section04 .gw-showroom-description > span {
    text-align: left;
  }
  .gateway-section04 .gw-showroom-box {
    top: 146px;
    left: 20px;
    font-size: 14px;
    line-height: 22px;
    color: #fff;
    transform: translate(0, 0);
  }
  .gateway-section04 .gw-showroom-box .gw-showroom-title {
    font-size: 26px;
    line-height: 34px;
  }
  .gateway-section04 .gw-showroom-box .gw-showroom-link > a {
  }
  .gateway-section04 .gw-showroom-box .gw-showroom-link > a:after {
    background: url("../image/icon_arrow_w.svg") no-repeat center;
  }
  .gateway-section04 .gw-showroom-box + .gw-showroom-group {
  }
  .gateway-section04 .gw-showroom-box .gw-showroom-description {
    position: static;
    display: flex;
    margin-top: 24px;
    padding: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .gateway-section04 .gw-showroom-group {
    border-top: none;
  }
  .gateway-section04 .container {
    display: none;
  }
  .gateway-section04 .top-block {
  }
  .gateway-section04 .bottom-block {
  }
  .gateway-section04 .block,
  .gateway-section04 .face {
  }
  .gateway-section04 .block {
  }
  .gateway-section04 .face {
  }
  .gateway-section04 .top-block .front,
  .gateway-section04 .bottom-block .front {
  }
  .gateway-section04 .top-block .front {
  }
  .gateway-section04 .bottom-block .front {
  }
  .gateway-section04 .face.left,
  .gateway-section04 .face.right {
  }
  .gateway-section04 .top-block .left {
  }
  .gateway-section04 .bottom-block .right {
  }
  .gateway-section04 .background-fade {
    position: static;
    background: url("../image/img_showroom01_mo.jpg") center/cover no-repeat;
    opacity: 1;
  }
  .gateway-section04 .gw-mo-text {
    position: absolute;
    bottom: 80px;
    left: 20px;
    display: block;
    font-size: 15px;
    color: #fff;
    line-height: 24px;
  }
  .gateway-section04 .gw-showroom-group:not(.first) {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type01 {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type01 .top-block .front,
  .gateway-section04
    .gw-showroom-group.gw-showroom-type01
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type01 .top-block .front {
  }
  .gateway-section04
    .gw-showroom-group.gw-showroom-type01
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type01 .background-fade {
    background: url("../image/img_showroom02_mo.jpg") center/cover no-repeat;
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type02 {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type02 .top-block .front,
  .gateway-section04
    .gw-showroom-group.gw-showroom-type02
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type02 .top-block .front {
  }
  .gateway-section04
    .gw-showroom-group.gw-showroom-type02
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type02 .background-fade {
    background: url("../image/img_showroom03_mo.jpg") center/cover no-repeat;
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type03 {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type03 .top-block .front,
  .gateway-section04
    .gw-showroom-group.gw-showroom-type03
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type03 .top-block .front {
  }
  .gateway-section04
    .gw-showroom-group.gw-showroom-type03
    .bottom-block
    .front {
  }
  .gateway-section04 .gw-showroom-group.gw-showroom-type03 .background-fade {
    background: url("../image/img_showroom04_mo.jpg") center/cover no-repeat;
  }

  .gateway-section05 .gw-offline-container {
    height: 300vh;
  }
  .gateway-section05 .gw-offline-sticky {
    position: sticky;
    top: 54px;
    height: 100vh;
  }

  .gateway-section05 .gw-offline-content {
    top: 450px;
    left: 0;
    padding: 0 20px 20px;
    transform: translate(0, 0);
    display: flex;
  }

  .gateway-section05 .gw-map-link {
    display: flex;
    margin-top: 20px;
    flex-direction: column;
    /* gap: 24px; */
  }

  /* .gateway-section05 .gw-item .gw-icon:after {
    
  } */
  .gateway-section05 .gw-offline-map {
    overflow: hidden;
    height: auto;
  }
  .gateway-section05 [data-current-index="1"] [data-map-item="1"],
  .gateway-section05 [data-current-index="2"] [data-map-item="2"],
  .gateway-section05 [data-current-index="3"] [data-map-item="3"] {
  }
  .gateway-section05 .gw-map-area {
    position: static;
    width: 320px;
    height: auto;
    margin: 0 auto;
    background: #eee;
    transform: translate(0, 0);
  }
  .gateway-section05 .gw-map {
    width: 100%;
    height: 367px;
  }
  .gateway-section05 .gw-header {
    display: none;
    font-size: 14px;
    line-height: 22px;
  }
  .gateway-section05 .gw-header-mo {
    display: flex;
    padding: 80px 20px 40px;
    flex-direction: column;
    gap: 24px;
  }
  .gateway-section05 .gw-offline-mobile {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    /* height: 727px; */
    height: calc(100vh - 55px);
    padding: 399px 20px;
  }
  .gateway-section05 .gw-title {
    font-size: 24px;
    line-height: 38px;
  }
  .gateway-section05 .gw-text {
  }
  .gateway-section05 .gw-item {
    align-items: flex-start;
    padding-bottom: 24px;
  }
  .gateway-section05 .gw-item:last-child {
  }
  .gateway-section05 .gw-item:before {
    top: 0;
  }
  .gateway-section05 .gw-item:last-child:before {
  }
  .gateway-section05 .gw-item .gw-icon {
  }
  .gateway-section05 .gw-item .gw-icon:before {
  }
  .gateway-section05 .gw-item:first-child .gw-icon:before {
  }
  .gateway-section05 .gw-item:last-child .gw-icon:before {
  }
  /* .gateway-section05 .gw-item:before {width:40px;height:40px;background:#ccc;border-radius:100%;content:'';} */
  .gateway-section05 .gw-item .gw-icon:after {
    top: -60px;
  }
  .gateway-section05 .gw-item:first-child .gw-icon:after {
  }
  .gateway-section05 [data-current-index="1"] [data-item="1"] .gw-area,
  .gateway-section05 [data-current-index="2"] [data-item="2"] .gw-area,
  .gateway-section05 [data-current-index="3"] [data-item="3"] .gw-area {
  }
  .gateway-section05 [data-current-index="1"] [data-item="1"] .gw-link:after,
  .gateway-section05 [data-current-index="2"] [data-item="2"] .gw-link:after,
  .gateway-section05 [data-current-index="3"] [data-item="3"] .gw-link:after {
  }
  .gateway-section05 [data-current-index="1"] [data-item="1"] .gw-icon,
  .gateway-section05 [data-current-index="2"] [data-item="2"] .gw-icon,
  .gateway-section05 [data-current-index="3"] [data-item="3"] .gw-icon {
  }
  /* .gateway-section05 [data-current-index="2"] [data-item="2"] .gw-icon:after,
  .gateway-section05 [data-current-index="3"] [data-item="2"] .gw-icon:after,
  .gateway-section05 [data-current-index="3"] [data-item="3"] .gw-icon:after {
    
  } */
  .gateway-section05 [data-current-index="2"] [data-item="1"]:before,
  .gateway-section05 [data-current-index="3"] [data-item="1"]:before,
  .gateway-section05 [data-current-index="3"] [data-item="2"]:before {
  }
  .gateway-section05 .gw-area {
  }
  .gateway-section05 .gw-link {
    font-size: 15px;
    line-height: 24px;
  }
  .gateway-section05 .gw-link:after {
  }
  .gateway-section05 .gw-description {
  }

  .gateway-section06 {
    overflow: hidden;
    padding: 80px 20px 0;
  }
  .gateway-section06 .gw-header {
    flex-direction: column;
  }
  .gateway-section06 .gw-header .gw-title {
    font-size: 14px;
    line-height: 22px;
  }
  .gateway-section06 .gw-header .gw-text-area {
    margin-top: 24px;
    gap: 80px;
  }
  .gateway-section06 .gw-header .gw-description {
    font-size: 14px;
    line-height: 22px;
  }
  .gateway-section06 .gw-header .gw-text {
    font-size: 24px;
    line-height: 38px;
  }

  .gateway-section06 .cs-swiper {
    margin-top: 40px;
  }
  .gateway-section06 .cs-swiper .swiper-slide {
    max-width: 150px;
  }
  .gateway-section06 .cs-swiper .swiper-slide a {
  }
  .gateway-section06 .gw-slide-text {
    height: 124px;
    padding-right: 10px;
    gap: 4px;
  }
  .gateway-section06 .gw-slide-text .gw-title {
    font-size: 13px;
    line-height: 20px;
  }
  .gateway-section06 .gw-slide-text .gw-text {
    height: inherit;
    font-size: 13px;
    line-height: 20px;
  }
  .gateway-section06 .gw-image {
  }
  .gateway-section06 .gw-image img {
  }
  .gateway-section06 .gw-image img:hover {
  }

  .gateway-section07 {
    padding-top: 80px;
  }
  .gateway-section07 .gw-title {
    font-size: 24px;
    line-height: 38px;
    text-align: left;
  }
  .gateway-section07 .gw-content {
    min-height: inherit;
    margin-top: 60px;
    flex-direction: column;
    gap: 48px;
  }
  .gateway-section07 .gw-content:before {
    display: none;
  }
  .gateway-section07 .gw-left {
  }
  .gateway-section07 .gw-right {
    display: none;
  }
  .gateway-section07 .gw-right .gw-area {
  }
  .gateway-section07 .gw-right .gw-area:first-child {
  }
  /* .gateway-section07 .gw-right .gw-area {
  }
  .gateway-section07 .gw-right .gw-area > span {
  }
  .gateway-section07 .gw-right .gw-area > span:before {
  }
  .gateway-section07 .gw-right .gw-area:nth-child(2) {
  }
  .gateway-section07 .gw-right .gw-area:nth-child(2) > span:before {
  }
  .gateway-section07 .gw-right .gw-area:nth-child(3) {
  }
  .gateway-section07 .gw-right .gw-area:nth-child(3) > span:before {
  }
  .gateway-section07 .gw-right .gw-area:last-child {
  }
  .gateway-section07 .gw-right .gw-area:last-child > span:before {
  } */
  .gateway-section07 .gw-counsel-category {
  }
  .gateway-section07 .gw-counsel-category:first-child {
  }
  .gateway-section07 .gw-counsel-category .gw-sub-title {
    padding: 12px;
    font-size: 16px;
    line-height: 26px;
  }
  .gateway-section07 .gw-counsel-category .gw-sub-title:after {
  }
  .gateway-section07 .gw-counsel-category .gw-cont-box {
  }
  .gateway-section07 .gw-counsel-category .gw-thumbnail-mo {
    display: block;
    padding: 0 12px;
  }
  .gateway-section07 .gw-counsel-category .gw-cont {
  }
  .gateway-section07 .gw-counsel-category ul {
    padding: 16px 12px 32px;
    font-size: 13px;
    line-height: 20px;
  }
  .gateway-section07 .gw-counsel-category ul li {
  }
  .gateway-section07 .gw-counsel-category ul li:before {
    top: 0;
    font-size: 12px;
    line-height: 20px;
  }
  .gateway-section07 .gw-counsel-category .gw-box:has(.btn) {
    margin-top: 0;
  }
  .gateway-section07 .gw-counsel-category .btn-type2 {
    width: 100%;
    font-size: 13px;
    text-align: center;
  }
  .gateway-section07 .gw-counsel-category .gw-call {
    display: flex;
    padding: 0;
    border: 1px solid #ccc;
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    line-height: 46px;
    justify-content: center;
  }
  .gateway-section07 .gw-counsel-category .gw-call:before {
    display: none;
  }
  .gateway-section07 .gw-counsel-category .text-info {
  }
  .gateway-section07 .gw-counsel-category.on .gw-sub-title {
    padding-top: 24px;
  }
  .gateway-section07 .gw-counsel-category.on .gw-sub-title:after {
  }

  .gateway-fix-button {
    display: none;
    top: auto;
    left: auto;
    right: 20px;
    transform: translate(0, 0);
    transition: none;
  }
  .gateway-fix-button.on {
    display: block;
  }
  .gateway-fix-button button {
  }
  .gateway-fix-button .lottie-btn {
    display: none;
  }
  .gateway-fix-button .mo-fixed-btn {
    display: block;
  }

  .gw-map-area-mobile {
    display: block;
    margin: 60px auto 10vh auto !important;
    z-index: 0;
    position: relative;
    max-width: 320px;
  }
  .gateway-section05 .gw-offline-mobile {
    padding-top: 0;
  }
}
@media screen and (max-width: 375px), screen and (max-height: 700px) {
  .gw-map-area-mobile {
    margin-bottom: 22vh;
  }
}
