@charset "UTF-8";
@keyframes dotpulse {
  0% {
    transform: scale(0.7);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(0.7);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes arrow-slide-right {
  0% {
    transform: translateX(0);
  }
  49.9% {
    transform: translateX(120%);
    opacity: 0;
  }
  50% {
    transform: translateX(-120%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes arrow-slide-left {
  0% {
    transform: rotate(180deg) translateX(0);
  }
  49.9% {
    transform: rotate(180deg) translateX(120%);
    opacity: 0;
  }
  50% {
    transform: rotate(180deg) translateX(-120%);
    opacity: 0;
  }
  100% {
    transform: rotate(180deg) translateX(0);
    opacity: 1;
  }
}
:root {
  --base-ratio: 0.5;
  --base-size: 1920;
  --base-percent: 100vw;
  --fs-d1-pc: 100;
  --fs-d1-tab: 48px;
  --fs-d1-mob: 48px;
  --fs-d2-pc: 80;
  --fs-d2-tab: 44px;
  --fs-d2-mob: 44px;
  --fs-d3-pc: 70;
  --fs-d3-tab: 40px;
  --fs-d3-mob: 40px;
  --fs-h1-pc: 56;
  --fs-h1-tab: 34px;
  --fs-h1-mob: 34px;
  --fs-h2-pc: 48;
  --fs-h2-tab: 32px;
  --fs-h2-mob: 28px;
  --fs-h3-pc: 36;
  --fs-h3-tab: 28px;
  --fs-h3-mob: 28px;
  --fs-h4-pc: 32;
  --fs-h4-tab: 24px;
  --fs-h4-mob: 24px;
  --fs-h5-pc: 24;
  --fs-h5-tab: 20px;
  --fs-h5-mob: 20px;
  --fs-p1-pc: 20;
  --fs-p1-tab: 18px;
}

:root:lang(en) {
  --fs-d1-pc: 80;
  --fs-d1-tab: 44px;
  --fs-d1-mob: 44px;
  --fs-d2-pc: 64;
  --fs-d2-tab: 40px;
  --fs-d2-mob: 40px;
  --fs-d3-pc: 56;
  --fs-d3-tab: 38px;
  --fs-d3-mob: 38px;
  --fs-h1-pc: 44;
  --fs-h1-tab: 28px;
  --fs-h1-mob: 28px;
  --fs-h2-pc: 44;
  --fs-h2-mob: 26px;
  --fs-h3-pc: 32;
  --fs-h3-tab: 24px;
  --fs-h3-mob: 24px;
  --fs-h4-pc: 28;
  --fs-h4-tab: 22px;
  --fs-h4-mob: 22px;
  --fs-h5-pc: 22;
  --fs-h5-tab: 18px;
  --fs-h5-mob: 18px;
  --fs-p1-pc: 18;
  --fs-p1-tab: 16px;
}

body {
  container-type: inline-size;
  --base-percent: 100cqw;
}

@media screen and (max-width: 1024px) {
  :root {
    --base-ratio: 1;
    --base-size: 1;
    --base-percent: 1px;
  }
  body {
    --base-percent: 1px;
  }
}
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  overflow-x: clip;
}

body {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  background-color: #FFFFFF;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  word-break: keep-all;
  overflow-wrap: break-word;
  opacity: 1;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
  font-size: inherit;
}

ul, ol {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border: 0;
}

button {
  background: none;
  border: none;
  cursor: pointer;
  font: inherit;
  color: inherit;
  outline: none;
}

input,
textarea,
select {
  font: inherit;
  color: inherit;
  outline: none;
  border: none;
  background: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset {
  border: 0;
}

address,
em {
  font-style: normal;
}

strong {
  font-weight: inherit;
}

.pc, .tb, .mo {
  display: none;
}

@media screen and (min-width: 1025px) {
  .pc {
    display: inline;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .tb {
    display: inline;
  }
}
@media screen and (max-width: 767px) {
  .mo {
    display: inline;
  }
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/pretendard/Pretendard-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/pretendard/Pretendard-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/pretendard/Pretendard-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/pretendard/Pretendard-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Bai Jamjuree";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/bai-jamjuree/BaiJamjuree-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Bai Jamjuree";
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/bai-jamjuree/BaiJamjuree-Medium.ttf") format("truetype");
}
@font-face {
  font-family: "Bai Jamjuree";
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/bai-jamjuree/BaiJamjuree-SemiBold.ttf") format("truetype");
}
@font-face {
  font-family: "Bai Jamjuree";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../vendor/fonts/bai-jamjuree/BaiJamjuree-Bold.ttf") format("truetype");
}
.grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  max-width: max(1536px * var(--base-ratio), 1536 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .grid {
    grid-template-columns: repeat(8, 1fr);
    padding: 0 40px;
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .grid {
    grid-template-columns: repeat(4, 1fr);
    padding: 0 20px;
    gap: 12px;
  }
}

.col_1 {
  grid-column: span 1;
}

.col_2 {
  grid-column: span 2;
}

.col_3 {
  grid-column: span 3;
}

.col_4 {
  grid-column: span 4;
}

.col_5 {
  grid-column: span 5;
}

.col_6 {
  grid-column: span 6;
}

.col_7 {
  grid-column: span 7;
}

.col_8 {
  grid-column: span 8;
}

.col_9 {
  grid-column: span 9;
}

.col_10 {
  grid-column: span 10;
}

.col_11 {
  grid-column: span 11;
}

.col_12 {
  grid-column: span 12;
}

@media screen and (max-width: 1024px) {
  .col_tablet_1 {
    grid-column: span 1;
  }
  .col_tablet_2 {
    grid-column: span 2;
  }
  .col_tablet_3 {
    grid-column: span 3;
  }
  .col_tablet_4 {
    grid-column: span 4;
  }
  .col_tablet_5 {
    grid-column: span 5;
  }
  .col_tablet_6 {
    grid-column: span 6;
  }
  .col_tablet_7 {
    grid-column: span 7;
  }
  .col_tablet_8 {
    grid-column: span 8;
  }
}
@media screen and (max-width: 767px) {
  .col_mobile_1 {
    grid-column: span 1;
  }
  .col_mobile_2 {
    grid-column: span 2;
  }
  .col_mobile_3 {
    grid-column: span 3;
  }
  .col_mobile_4 {
    grid-column: span 4;
  }
}
.is_medium {
  font-weight: 500;
}

.is_semibold {
  font-weight: 600;
}

.is_bold {
  font-weight: 700;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.3;
  transition: all 0.3s ease;
  transition-property: background, background-color, border-color, filter, opacity;
  cursor: pointer;
  white-space: nowrap;
  border: 0 solid transparent;
  background: none;
  text-decoration: none;
}
.btn svg,
.btn img {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #949599;
}
@media screen and (max-width: 1024px) {
  .btn svg,
  .btn img {
    width: 20px;
    height: 20px;
  }
}
.btn_medium {
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .btn_medium {
    font-size: 16px;
  }
}
.btn_medium {
  letter-spacing: -0.02em;
  min-width: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  border-width: 1px;
}
@media screen and (max-width: 1024px) {
  .btn_medium {
    height: 52px;
    padding: 0 20px;
    min-width: 120px;
    gap: 4px;
  }
}
.btn_small {
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  padding: 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .btn_small {
    font-size: 14px;
  }
}
.btn_small {
  letter-spacing: -0.02em;
  min-width: max(92px * var(--base-ratio), 92 / var(--base-size) * var(--base-percent));
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border-width: 1px;
}
@media screen and (max-width: 1024px) {
  .btn_small {
    height: 42px;
    padding: 0 10px;
    min-width: 84px;
  }
}
.btn_small svg,
.btn_small img {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .btn_small svg,
  .btn_small img {
    width: 16px;
    height: 16px;
  }
}
.btn_tag {
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .btn_tag {
    font-size: 14px;
  }
}
.btn_tag {
  letter-spacing: -0.02em;
  border-width: 1px;
}
@media screen and (max-width: 1024px) {
  .btn_tag {
    height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
}
.btn_primary {
  border-color: #D1D2D4;
  color: #161D27;
  background-color: transparent;
}
@media (hover: hover) {
  .btn_primary:hover {
    background-color: #025997;
    border-color: #025997;
    color: #FFFFFF;
  }
  .btn_primary:hover svg {
    color: #FFFFFF;
  }
  .btn_primary:hover img {
    filter: brightness(0) invert(1);
  }
}
.btn_primary:focus-visible {
  border-color: #025997;
  outline: none;
}
.btn_primary.is_active {
  background-color: #025997;
  border-color: #025997;
  color: #FFFFFF;
}
.btn_primary.is_active svg {
  color: #FFFFFF;
}
.btn_primary.is_disabled, .btn_primary:disabled {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
  color: #BCBDC1;
  pointer-events: none;
}
.btn_primary.is_dark {
  color: #FFFFFF;
}
.btn_primary.is_dark svg {
  color: #FFFFFF;
}
@media (hover: hover) {
  .btn_primary.is_dark:hover {
    background-color: #025997;
    border-color: #025997;
    color: #FFFFFF;
  }
  .btn_primary.is_dark:hover svg {
    color: #FFFFFF;
  }
}
.btn.has_white_border {
  border-color: #FFFFFF;
}
.btn_secondary {
  background-color: #818286;
  color: #FFFFFF;
}
@media (hover: hover) {
  .btn_secondary:hover {
    background-color: #025997;
  }
  .btn_secondary:hover img {
    filter: brightness(0) invert(1);
  }
}
.btn_secondary.is_disabled, .btn_secondary:disabled {
  background-color: #F3F3F3;
  color: #BCBDC1;
  pointer-events: none;
}
.btn_secondary.is_dark {
  color: #FFFFFF;
}
.btn_secondary.is_dark svg {
  color: #FFFFFF;
}
.btn_cta {
  --cta-glow-color: #024781;
  position: relative;
  color: #161D27;
  border: 3px solid rgba(209, 210, 212, 0.4);
  background: none;
  transition: border-color 0.3s ease, background 0.3s ease;
}
.btn_cta::before {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: inherit;
  padding: 3px;
  animation: cta-border-rotate 3s linear infinite;
  pointer-events: none;
  background: var(--cta-glow-color);
  -webkit-mask-image: linear-gradient(#fff 0 0), conic-gradient(from var(--cta-angle, 0deg), transparent 0%, transparent 26%, rgba(0, 0, 0, 0.1) 29%, rgba(0, 0, 0, 0.8) 35%, #000 38%, rgba(0, 0, 0, 0.8) 41%, rgba(0, 0, 0, 0.1) 45%, transparent 47%, transparent 76%, rgba(0, 0, 0, 0.1) 79%, rgba(0, 0, 0, 0.8) 85%, #000 88%, rgba(0, 0, 0, 0.8) 91%, rgba(0, 0, 0, 0.1) 95%, transparent 97%, transparent 100%);
  -webkit-mask-clip: content-box, border-box;
  -webkit-mask-composite: destination-out;
}
@supports (-moz-appearance: none) {
  .btn_cta::before {
    background: conic-gradient(from var(--cta-angle, 0deg), transparent 0%, transparent 26%, color-mix(in srgb, var(--cta-glow-color) 10%, transparent) 29%, color-mix(in srgb, var(--cta-glow-color) 80%, transparent) 35%, var(--cta-glow-color) 38%, color-mix(in srgb, var(--cta-glow-color) 80%, transparent) 41%, color-mix(in srgb, var(--cta-glow-color) 10%, transparent) 45%, transparent 47%, transparent 76%, color-mix(in srgb, var(--cta-glow-color) 10%, transparent) 79%, color-mix(in srgb, var(--cta-glow-color) 80%, transparent) 85%, var(--cta-glow-color) 88%, color-mix(in srgb, var(--cta-glow-color) 80%, transparent) 91%, color-mix(in srgb, var(--cta-glow-color) 10%, transparent) 95%, transparent 97%, transparent 100%);
    mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);
    mask-clip: content-box, border-box;
    mask-composite: subtract;
  }
}
@media screen and (max-width: 1024px) {
  .btn_cta {
    border-width: 2px;
  }
  .btn_cta::before {
    inset: -2px;
    padding: 2px;
  }
}
.btn_cta.is_disabled, .btn_cta:disabled {
  background: #F3F3F3;
  border-color: #D1D2D4;
  color: #BCBDC1;
  pointer-events: none;
}
.btn_cta.is_disabled::before, .btn_cta:disabled::before {
  display: none;
}
.btn_cta.is_dark {
  --cta-glow-color: #00A3F1;
  border-color: rgba(255, 255, 255, 0.4);
  color: #FFFFFF;
}
.btn_cta.is_dark svg {
  color: #FFFFFF;
}
@media (hover: hover) {
  .btn_cta:hover {
    border-color: transparent;
    background: linear-gradient(90deg, #00A3F1 0%, #025997 100%);
    background-origin: border-box;
    color: #FFFFFF;
  }
  .btn_cta:hover svg {
    color: #FFFFFF;
  }
  .btn_cta:hover img {
    filter: brightness(0) invert(1);
  }
  .btn_cta:hover::before {
    display: none;
  }
}
.btn_text {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .btn_text {
    font-size: 16px;
  }
}
.btn_text {
  letter-spacing: -0.02em;
  color: #FFFFFF;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .btn_text {
    gap: 8px;
  }
}
.btn_text svg {
  transition: transform 0.3s ease;
}
@media (hover: hover) {
  .btn_text:hover svg {
    transform: translateX(4px);
  }
}
.btn_text.is_dark {
  color: #161D27;
}
.btn_icon {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  padding: 0;
  min-width: auto;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 1024px) {
  .btn_icon {
    width: 48px;
    height: 48px;
  }
}
@media (hover: hover) {
  .btn_icon:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
}
.btn_icon.is_dark {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
}
@media (hover: hover) {
  .btn_icon.is_dark:hover {
    background-color: #E7E7E9;
  }
}
.btn_scroll {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  padding: 0;
  min-width: auto;
  border: 1px solid rgba(255, 255, 255, 0.4);
  animation: bounce 2s infinite;
}
@media screen and (max-width: 1024px) {
  .btn_scroll {
    width: 48px;
    height: 48px;
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-8px);
  }
  60% {
    transform: translateY(-4px);
  }
}
@property --cta-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}
@keyframes cta-border-rotate {
  to {
    --cta-angle: 360deg;
  }
}
.tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tag {
    font-size: 14px;
  }
}
.tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .tag {
    height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
}
.tag_primary {
  border: 1px solid #025997;
  color: #025997;
  background-color: transparent;
}
.tag_secondary {
  border: 1px solid #00A3F1;
  color: #00A3F1;
  background-color: transparent;
}
.tag_light {
  background-color: #E8F3FE;
  color: #025997;
}
.tag_outline {
  background-color: transparent;
  border: 1px solid #D1D2D4;
  color: #818286;
}
.tag_white {
  background-color: rgba(255, 255, 255, 0.15);
  color: #FFFFFF;
}

.label {
  display: inline-flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .label {
    font-size: 16px;
  }
}
.label {
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #025997;
}
@media screen and (max-width: 1024px) {
  .label {
    gap: 8px;
  }
}
.label::before {
  content: "";
  display: block;
  width: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  height: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #025997;
}
@media screen and (max-width: 1024px) {
  .label::before {
    width: 8px;
    height: 8px;
  }
}
.label.is_white {
  color: #FFFFFF;
}
.label.is_white::before {
  background-color: #FFFFFF;
}

.input {
  width: 100%;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .input {
    font-size: 16px;
  }
}
.input {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  line-height: 1.3;
  transition: border-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .input {
    height: 52px;
    padding: 0 20px;
  }
}
.input::placeholder {
  color: #818286;
}
.input:focus {
  border: 2px solid #025997;
  outline: none;
}
.input.is_error {
  border: 2px solid #D60F0F;
}
.input.is_disabled, .input:disabled {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
  color: #BCBDC1;
  pointer-events: none;
}
.input.is_disabled::placeholder, .input:disabled::placeholder {
  color: #BCBDC1;
}

.textarea {
  width: 100%;
  min-height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .textarea {
    font-size: 16px;
  }
}
.textarea {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  line-height: 1.5;
  resize: vertical;
  transition: border-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .textarea {
    min-height: 160px;
    padding: 20px;
  }
}
.textarea::placeholder {
  color: #818286;
}
.textarea:focus {
  border: 2px solid #025997;
  outline: none;
}
.textarea.is_error {
  border: 2px solid #D60F0F;
}
.textarea.is_disabled, .textarea:disabled {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
  color: #BCBDC1;
  pointer-events: none;
}

.select {
  position: relative;
}
.select_trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .select_trigger {
    font-size: 16px;
  }
}
.select_trigger {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  cursor: pointer;
  transition: border-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .select_trigger {
    height: 52px;
    padding: 0 20px;
  }
}
.select_trigger svg {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.select_trigger.is_placeholder {
  color: #818286;
}
.select.is_open .select_trigger {
  border-color: #025997;
  color: #025997;
  font-weight: 700;
}
.select.is_open .select_trigger svg {
  transform: rotate(180deg);
}
.select.is_open .select_dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.select_dropdown {
  position: absolute;
  top: calc(100% + max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)));
  left: 0;
  width: 100%;
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border: 1px solid #025997;
  border-radius: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: all 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .select_dropdown {
    top: calc(100% + 8px);
    padding: 24px;
    border-radius: 30px;
  }
}
.select_option {
  display: block;
  width: 100%;
  padding: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) 0;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .select_option {
    font-size: 16px;
  }
}
.select_option {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #818286;
  cursor: pointer;
  transition: color 0.3s ease;
  border: none;
  background: none;
  text-align: left;
}
@media screen and (max-width: 1024px) {
  .select_option {
    padding: 12px 0;
  }
}
@media (hover: hover) {
  .select_option:hover {
    color: #025997;
  }
}
.select_option.is_selected {
  color: #025997;
  font-weight: 700;
}

.checkbox {
  display: inline-flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .checkbox {
    gap: 8px;
  }
}
.checkbox_input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.checkbox_input + .checkbox_box {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D1D2D4;
  border-radius: 2px;
  background-color: #FFFFFF;
  background-position: center;
  background-repeat: no-repeat;
  background-size: max(17px * var(--base-ratio), 17 / var(--base-size) * var(--base-percent)) max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  transition: all 0.3s ease;
}
.checkbox_input:checked + .checkbox_box {
  background-color: #025997;
  background-image: url("/images/reporting-center/ico_check.svg");
  border-color: #025997;
}
.checkbox_input:focus-visible + .checkbox_box {
  border: 2px solid #025997;
}
.checkbox_input:disabled + .checkbox_box {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
  cursor: not-allowed;
}
.checkbox_input:disabled:checked + .checkbox_box {
  background-color: #F3F3F3;
  background-image: url("/images/reporting-center/ico_check.svg");
  border-color: #BCBDC1;
  opacity: 0.5;
}
.checkbox_label {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .checkbox_label {
    font-size: 16px;
  }
}
.checkbox_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #818286;
}
@media (hover: hover) {
  .checkbox:hover .checkbox_input:not(:checked):not(:disabled) + .checkbox_box {
    border: 2px solid #025997;
  }
}

.radio {
  display: inline-flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .radio {
    gap: 8px;
  }
}
.radio_input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.radio_input + .radio_circle {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D1D2D4;
  border-radius: 50%;
  background-color: #FFFFFF;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .radio_input + .radio_circle {
    width: 28px;
    height: 28px;
  }
}
.radio_input + .radio_circle::after {
  content: "";
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: transparent;
  transition: background-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .radio_input + .radio_circle::after {
    width: 14px;
    height: 14px;
  }
}
.radio_input:checked + .radio_circle {
  border: 2px solid #025997;
}
.radio_input:checked + .radio_circle::after {
  background-color: #025997;
}
.radio_input:focus-visible + .radio_circle {
  border: 2px solid #025997;
}
.radio_input:disabled + .radio_circle {
  background-color: #F3F3F3;
  border-color: #D1D2D4;
  cursor: not-allowed;
}
.radio_input:disabled:checked + .radio_circle {
  background-color: #F3F3F3;
  border-color: #BCBDC1;
}
.radio_input:disabled:checked + .radio_circle::after {
  background-color: #6D6E72;
}
.radio_label {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .radio_label {
    font-size: 16px;
  }
}
.radio_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #818286;
}
@media (hover: hover) {
  .radio:hover .radio_input:not(:checked):not(:disabled) + .radio_circle {
    border: 2px solid #025997;
  }
}

.form_label {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .form_label {
    font-size: 16px;
  }
}
.form_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .form_label {
    margin-bottom: 8px;
  }
}
.form_label.is_required::after {
  content: " *";
  color: #D60F0F;
}

.form_error {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .form_error {
    font-size: 14px;
  }
}
.form_error {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #D60F0F;
  margin-top: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .form_error {
    margin-top: 4px;
  }
}

.form_group + .form_group {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .form_group + .form_group {
    margin-top: 32px;
  }
}

.input_file {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .input_file {
    gap: 8px;
  }
}
.input_file .input {
  flex: 1;
}
.input_file_btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  background-color: #FFFFFF;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .input_file_btn {
    font-size: 16px;
  }
}
.input_file_btn {
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #161D27;
  cursor: pointer;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .input_file_btn {
    height: 52px;
    padding: 0 20px;
  }
}
@media (hover: hover) {
  .input_file_btn:hover {
    border-color: #025997;
    color: #025997;
  }
}

.board_card {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  text-decoration: none;
  transition: border-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .board_card {
    padding: 24px 20px;
    border-radius: 12px;
  }
}
@media (hover: hover) {
  .board_card:hover {
    border-color: #025997;
  }
}
.board_card_tag {
  align-self: flex-start;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_card_tag {
    margin-bottom: 8px;
  }
}
.board_card_title {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .board_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.board_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.board_card_date {
  margin-top: auto;
  padding-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_card_date {
    font-size: 16px;
  }
}
.board_card_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .board_card_date {
    padding-top: 20px;
  }
}
.board_card_arrow {
  position: absolute;
  right: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  color: #025997;
}
@media screen and (max-width: 1024px) {
  .board_card_arrow {
    right: 20px;
    bottom: 20px;
    width: 20px;
    height: 20px;
  }
}
.board_card.has_thumb {
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_card.has_thumb {
    padding: 20px;
  }
}
.board_card.has_thumb .board_card_thumb {
  width: 100%;
  height: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  margin-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_card.has_thumb .board_card_thumb {
    height: 140px;
    margin-bottom: 20px;
  }
}
.board_card.has_thumb .board_card_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.board_card.has_thumb .board_card_title {
  padding: 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_card.has_thumb .board_card_title {
    padding: 0 4px;
  }
}
.board_card.has_thumb .board_card_date {
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .board_card.has_thumb .board_card_date {
    padding: 16px 4px 0;
  }
}

.board_list {
  border-top: 2px solid #025997;
}
.board_list_num {
  flex-shrink: 0;
  width: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_list_num {
    font-size: 16px;
  }
}
.board_list_num {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .board_list_num {
    display: none;
  }
}
.board_list_item {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
  text-decoration: none;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .board_list_item {
    padding: 24px 0;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
}
@media (hover: hover) {
  .board_list_item:hover {
    background-color: #F3F3F3;
    border-bottom-color: #025997;
  }
}
.board_list_title {
  flex: 1;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_list_title {
    font-size: var(--fs-p1-tab);
  }
}
.board_list_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #161D27;
}
.board_list_date {
  flex-shrink: 0;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_list_date {
    font-size: 16px;
  }
}
.board_list_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .board_list_date {
    width: auto;
    text-align: left;
    align-self: flex-start;
  }
}
.board_list_action {
  flex-shrink: 0;
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 1024px) {
  .board_list.has_action .board_list_item {
    display: grid;
    grid-template-columns: 1fr auto;
    flex-direction: unset;
    align-items: center;
    gap: 0 12px;
  }
}
@media screen and (max-width: 1024px) {
  .board_list.has_action .board_list_title {
    grid-column: 1;
    grid-row: 1;
  }
}
@media screen and (max-width: 1024px) {
  .board_list.has_action .board_list_date {
    grid-column: 1;
    grid-row: 2;
    margin-top: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .board_list.has_action .board_list_action {
    grid-column: 2;
    grid-row: 1/3;
    align-self: center;
    width: auto;
  }
}
.board_list_head {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .board_list_head {
    display: none;
  }
}
.board_list_head > * {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_list_head > * {
    font-size: var(--fs-p1-tab);
  }
}
.board_list_head > * {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #161D27;
  text-align: center;
}

.board_view {
  max-width: max(1166px * var(--base-ratio), 1166 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .board_view {
    max-width: none;
  }
}
.board_view_header {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.board_view_category {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_category {
    font-size: var(--fs-p1-tab);
  }
}
.board_view_category {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #025997;
  margin-bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_category {
    margin-bottom: 10px;
  }
}
.board_view_tags {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  margin-bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_tags {
    gap: 6px;
    margin-bottom: 10px;
  }
}
.board_view_title {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .board_view_title {
    font-size: var(--fs-h2-mob);
  }
}
.board_view_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.board_view_meta {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_meta {
    gap: 6px;
    margin-top: 20px;
  }
}
.board_view_meta_label {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_meta_label {
    font-size: 16px;
  }
}
.board_view_meta_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
}
.board_view_meta_divider {
  width: 1px;
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  background: #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .board_view_meta_divider {
    height: 14px;
  }
}
.board_view_meta_value {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_meta_value {
    font-size: 16px;
  }
}
.board_view_meta_value {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
}
.board_view_date {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_date {
    font-size: 16px;
  }
}
.board_view_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_date {
    margin-top: 20px;
  }
}
.board_view_body {
  border-top: 1px solid #D1D2D4;
  border-bottom: 1px solid #D1D2D4;
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) 0;
  margin-top: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_body {
    padding: 64px 0;
    margin-top: 36px;
    gap: 36px;
  }
}
.board_view_summary {
  width: 100%;
  background: #E8F3FE;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_summary {
    font-size: var(--fs-p1-tab);
  }
}
.board_view_summary {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #025997;
}
@media screen and (max-width: 1024px) {
  .board_view_summary {
    padding: 24px;
  }
}
.board_view_text {
  width: 100%;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_text {
    font-size: var(--fs-p1-tab);
  }
}
.board_view_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
}
.board_view_img {
  width: 100%;
}
.board_view_img img {
  width: 100%;
  height: auto;
  display: block;
}
.board_view_img_caption {
  background: #F3F3F3;
  padding: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_img_caption {
    font-size: 14px;
  }
}
.board_view_img_caption {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .board_view_img_caption {
    padding: 12px;
  }
}
.board_view_content {
  width: 100%;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_content {
    font-size: var(--fs-p1-tab);
  }
}
.board_view_content {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
}
.board_view_content img {
  max-width: 100%;
  height: auto;
}
.board_view_nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_view_nav {
    padding-top: 48px;
  }
}
.board_view_nav_link {
  display: flex;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-decoration: none;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .board_view_nav_link {
    font-size: 16px;
  }
}
.board_view_nav_link {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  transition: color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .board_view_nav_link {
    gap: 8px;
  }
}
.board_view_nav_link svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  color: #949599;
}
@media screen and (max-width: 1024px) {
  .board_view_nav_link svg {
    width: 24px;
    height: 24px;
  }
}
@media (hover: hover) {
  .board_view_nav_link:hover {
    color: #025997;
  }
  .board_view_nav_link:hover svg {
    color: #025997;
  }
}

.board_write {
  max-width: max(1166px * var(--base-ratio), 1166 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_write {
    max-width: 1166px;
  }
}
.board_write .form_group + .form_group {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_write .form_group + .form_group {
    margin-top: 32px;
  }
}
.board_write_actions {
  display: flex;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .board_write_actions {
    gap: 12px;
    margin-top: 40px;
  }
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .pagination {
    gap: 8px;
  }
}
.pagination_arrows {
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .pagination_arrows {
    gap: 4px;
  }
}
.pagination_nums {
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .pagination_nums {
    gap: 4px;
  }
}
@media screen and (max-width: 767px) {
  .pagination_nums {
    display: none;
  }
}
.pagination_info {
  display: none;
}
@media screen and (max-width: 767px) {
  .pagination_info {
    display: flex;
    align-items: center;
    gap: 4px;
  }
}
.pagination_current {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .pagination_current {
    font-size: 16px;
  }
}
.pagination_current {
  letter-spacing: -0.02em;
  line-height: 1.3;
  font-weight: 700;
  background-color: #025997;
  color: #FFFFFF;
}
.pagination_total {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .pagination_total {
    font-size: 16px;
  }
}
.pagination_total {
  letter-spacing: -0.02em;
  line-height: 1.3;
  font-weight: 400;
  color: #6D6E72;
}
.pagination_num {
  width: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  height: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .pagination_num {
    font-size: 16px;
  }
}
.pagination_num {
  letter-spacing: -0.02em;
  line-height: 1.3;
  font-weight: 400;
  color: #6D6E72;
  cursor: pointer;
  transition: all 0.3s ease;
  border: none;
  background: none;
}
@media screen and (max-width: 1024px) {
  .pagination_num {
    width: 32px;
    height: 32px;
  }
}
@media (hover: hover) {
  .pagination_num:hover {
    color: #025997;
  }
}
.pagination_num.is_active {
  background-color: #025997;
  color: #FFFFFF;
  font-weight: 700;
}
.pagination_first, .pagination_prev, .pagination_next, .pagination_last {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background: none;
  cursor: pointer;
  color: #6D6E72;
  transition: color 0.3s ease;
}
.pagination_first::before, .pagination_prev::before, .pagination_next::before, .pagination_last::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}
@media screen and (max-width: 1024px) {
  .pagination_first, .pagination_prev, .pagination_next, .pagination_last {
    width: 24px;
    height: 24px;
  }
}
@media (hover: hover) {
  .pagination_first:hover, .pagination_prev:hover, .pagination_next:hover, .pagination_last:hover {
    color: #161D27;
  }
}
.pagination_first.is_disabled, .pagination_prev.is_disabled, .pagination_next.is_disabled, .pagination_last.is_disabled {
  color: #BCBDC1;
  pointer-events: none;
}
.pagination_first::before {
  mask-image: url("../images/icons/ico_page_first.svg");
  -webkit-mask-image: url("../images/icons/ico_page_first.svg");
}
.pagination_prev::before {
  mask-image: url("../images/icons/ico_page_prev.svg");
  -webkit-mask-image: url("../images/icons/ico_page_prev.svg");
}
.pagination_next::before {
  mask-image: url("../images/icons/ico_page_next.svg");
  -webkit-mask-image: url("../images/icons/ico_page_next.svg");
}
.pagination_last::before {
  mask-image: url("../images/icons/ico_page_last.svg");
  -webkit-mask-image: url("../images/icons/ico_page_last.svg");
}
.pagination_separator {
  width: 23px;
  height: 32px;
  background-color: #6D6E72;
  mask-image: url("../images/icons/ico_page_separator.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-image: url("../images/icons/ico_page_separator.svg");
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.intro_page_title .intro_page_title_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.intro_page_title .intro_page_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_page_title .intro_page_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_page_title .intro_page_label {
    font-size: var(--fs-h5-mob);
  }
}
.intro_page_title .intro_page_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
  text-align: center;
}
.intro_page_title .intro_page_name {
  font-size: round(down, max(var(--fs-d2-pc) * 1px * var(--base-ratio), var(--fs-d2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_page_title .intro_page_name {
    font-size: var(--fs-d2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_page_title .intro_page_name {
    font-size: var(--fs-d2-mob);
  }
}
.intro_page_title .intro_page_name {
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1;
  color: #161D27;
  text-align: center;
}
.intro_page_title .intro_page_tab {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.intro_page_title .intro_tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_page_title .intro_tab {
    font-size: 16px;
  }
}
.intro_page_title .intro_tab {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
  text-decoration: none;
  border: 1px solid #D1D2D4;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
}
.intro_page_title .intro_tab.is_active {
  background-color: #025997;
  color: #FFFFFF;
  border-color: #025997;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .intro_page_title .intro_page_title_inner {
    gap: 12px;
    padding: 120px 0 60px;
  }
  .intro_page_title .intro_page_tab {
    margin-top: 16px;
  }
  .intro_page_title .intro_tab {
    width: 120px;
    height: 52px;
  }
}
@media screen and (max-width: 767px) {
  .intro_page_title .intro_page_title_inner {
    padding: 60px 20px 40px;
  }
  .intro_page_title .intro_page_tab {
    margin-top: 12px;
  }
  .intro_page_title .intro_tab {
    line-height: 26px;
  }
}

@media screen and (max-width: 1024px) {
  .scroll_notice {
    position: relative;
  }
  .scroll_notice::before, .scroll_notice::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 80px;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .scroll_notice::before {
    left: 0;
    background: linear-gradient(90deg, var(--scroll-notice-bg, #F3F3F3) 0%, rgba(255, 255, 255, 0) 100%);
  }
  .scroll_notice::after {
    right: 0;
    background: linear-gradient(270deg, var(--scroll-notice-bg, #F3F3F3) 0%, rgba(255, 255, 255, 0) 100%);
  }
  .scroll_notice.has_dim_left::before {
    opacity: 1;
  }
  .scroll_notice.has_dim_right::after {
    opacity: 1;
  }
}

.scroll_notice_swipe {
  display: none;
}
@media screen and (max-width: 1024px) {
  .scroll_notice_swipe {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 160px;
    height: 140px;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }
  .scroll_notice_swipe.is_visible {
    display: flex;
    opacity: 1;
    pointer-events: auto;
  }
  .scroll_notice_swipe.is_hidden {
    opacity: 0;
    pointer-events: none;
  }
  .scroll_notice_swipe p {
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 600;
    line-height: 1.3;
    color: #FFFFFF;
    text-align: center;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .scroll_notice_swipe p {
    font-size: 16px;
  }
}

.bottom_nav {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  display: flex;
  border-top: 1px solid #D1D2D4;
}
.bottom_nav .bottom_link {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(210px * var(--base-ratio), 210 / var(--base-size) * var(--base-percent));
  text-decoration: none;
}
.bottom_nav .bottom_link:first-child {
  border-right: 1px solid #D1D2D4;
}
@media (hover: hover) {
  .bottom_nav .bottom_link:hover .bottom_link_arrow:not(.is_prev) svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .bottom_nav .bottom_link:hover .bottom_link_arrow.is_prev svg {
    animation: arrow-slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.bottom_nav .bottom_link_text {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .bottom_nav .bottom_link_text {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .bottom_nav .bottom_link_text {
    font-size: var(--fs-h4-mob);
  }
}
.bottom_nav .bottom_link_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.bottom_nav .bottom_link_text br {
  content: "";
}
.bottom_nav .bottom_link_text br::after {
  content: " ";
}
.bottom_nav .bottom_link_arrow {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  border: 2px solid #D1D2D4;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #6D6E72;
}
.bottom_nav .bottom_link_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.bottom_nav .bottom_link_arrow.is_prev {
  order: -1;
}
.bottom_nav .bottom_link_arrow.is_prev svg {
  transform: rotate(180deg);
}
@media screen and (max-width: 1024px) {
  .bottom_nav .bottom_link {
    gap: 16px;
    height: 160px;
  }
  .bottom_nav .bottom_link_arrow {
    width: 40px;
    height: 40px;
  }
  .bottom_nav .bottom_link_arrow svg {
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 767px) {
  .bottom_nav .bottom_link {
    gap: 16px;
    height: 100px;
  }
  .bottom_nav .bottom_link_arrow {
    width: 40px;
    height: 40px;
  }
  .bottom_nav .bottom_link_arrow svg {
    width: 20px;
    height: 20px;
  }
  .bottom_nav .bottom_link_text {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .bottom_nav .bottom_link_text {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .bottom_nav .bottom_link_text {
    font-size: var(--fs-h5-mob);
  }
}

.header {
  width: 100%;
  height: fluid(100);
  z-index: 1000;
}
@media screen and (max-width: 1024px) {
  .header {
    height: 80px;
  }
}
@media screen and (max-width: 767px) {
  .header {
    height: 68px;
  }
}
.header.is_white {
  position: relative;
  background-color: #FFFFFF;
  border-bottom: 1px solid #D1D2D4;
}
.header.is_white .header_logo .logo_white {
  display: none;
}
.header.is_white .header_logo .logo_dark {
  display: block;
}
.header.is_white .nav_item a {
  color: #161D27;
}
.header.is_white .btn_lang .lang_white {
  display: none;
}
.header.is_white .btn_lang .lang_dark {
  display: block;
}
.header.is_white .btn_menu span {
  background-color: #949599;
}
.header.is_trans {
  position: absolute;
  top: 0;
  left: 0;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.header.is_trans .header_logo .logo_white {
  display: block;
}
.header.is_trans .header_logo .logo_dark {
  display: none;
}
.header.is_trans .header_nav .nav_item a {
  color: #FFFFFF;
}
.header.is_trans .header_nav .nav_item.is_active > a {
  color: #FFFFFF;
}
.header.is_trans .btn_lang .lang_white {
  display: block;
}
.header.is_trans .btn_lang .lang_dark {
  display: none;
}
.header.is_trans .btn_menu span {
  background-color: #FFFFFF;
}
.header.is_fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  transform: translateY(-100%);
  overflow: visible;
  background-color: rgba(10, 14, 18, 0.98);
}
.header.is_fixed .header_logo .logo_white {
  display: block;
}
.header.is_fixed .header_logo .logo_dark {
  display: none;
}
.header.is_fixed .nav_item a {
  color: #FFFFFF;
}
.header.is_fixed .btn_lang .lang_white {
  display: block;
}
.header.is_fixed .btn_lang .lang_dark {
  display: none;
}
.header.is_fixed .btn_menu span {
  background-color: #FFFFFF;
}
.header.is_fixed.is_visible {
  transform: translateY(0);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.header.is_fixed.is_hidden {
  transform: translateY(-100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 1, 1);
}
.header.is_fixed.is_white {
  background-color: #FFFFFF;
  border-bottom: 1px solid #D1D2D4;
}
.header.is_fixed.is_white .header_logo .logo_white {
  display: none;
}
.header.is_fixed.is_white .header_logo .logo_dark {
  display: block;
}
.header.is_fixed.is_white .nav_item a {
  color: #161D27;
}
.header.is_fixed.is_white .btn_lang .lang_white {
  display: none;
}
.header.is_fixed.is_white .btn_lang .lang_dark {
  display: block;
}
.header.is_fixed.is_white .btn_menu span {
  background-color: #161D27;
}
.header.is_open {
  transition: background-color 0.3s ease, border-color 0.3s ease;
  background-color: #FFFFFF;
  border-bottom: 1px solid #D1D2D4;
}
.header.is_open .header_logo .logo_white {
  display: none;
}
.header.is_open .header_logo .logo_dark {
  display: block;
}
.header.is_open .header_nav .nav_item a {
  color: #161D27;
}
.header.is_open .header_nav .nav_item.is_active > a {
  color: #025997;
}
.header.is_open .header_nav .nav_item.is_hover > a {
  color: #025997;
}
.header.is_open .btn_lang .lang_white {
  display: none;
}
.header.is_open .btn_lang .lang_dark {
  display: block;
}
.header.is_open .btn_menu span {
  background-color: #161D27;
}
.header .header_inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1920px;
  height: 100%;
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .header .header_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .header .header_inner {
    padding: 0 20px;
  }
}
.header .header_logo {
  flex-shrink: 0;
}
.header .header_logo a {
  display: block;
}
.header .header_logo img {
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  object-fit: contain;
}
@media screen and (max-width: 1024px) {
  .header .header_logo img {
    width: 94px;
    height: 36px;
  }
}
@media screen and (max-width: 767px) {
  .header .header_logo img {
    width: 78px;
    height: 30px;
  }
}
.header .header_nav {
  position: relative;
}
@media screen and (max-width: 1024px) {
  .header .header_nav {
    display: none;
  }
}
.header .header_nav .nav_list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
}
.header .header_nav .nav_item {
  position: relative;
}
.header .header_nav .nav_item a {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .header_nav .nav_item a {
    font-size: var(--fs-p1-tab);
  }
}
.header .header_nav .nav_item a {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  transition: color 0.3s ease;
  white-space: nowrap;
}
.header .header_nav .nav_item a br {
  display: none;
}
@media (hover: hover) {
  .header .header_nav .nav_item a:hover {
    color: #025997;
  }
}
.header .header_nav .nav_item.is_active > a {
  color: #025997;
}
.header .gnb_indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 0;
  background-color: #025997;
  transition: left 0.3s ease, width 0.3s ease;
  pointer-events: none;
}
.header .nav_depth2 {
  position: absolute;
  top: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  left: 0;
  width: 100%;
  height: max(232px * var(--base-ratio), 232 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-top: 1px solid #D1D2D4;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 1000;
}
@media screen and (max-width: 1024px) {
  .header .nav_depth2 {
    display: none;
  }
}
.header .nav_depth2.is_open {
  opacity: 1;
  visibility: visible;
}
.header .nav_depth2 .depth2_panel {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.header .nav_depth2 .depth2_panel.is_active {
  display: block;
}
.header .depth2_info {
  position: absolute;
  top: 0;
  left: 0;
  width: max(434px * var(--base-ratio), 434 / var(--base-size) * var(--base-percent));
  height: 100%;
  background-color: #E8F3FE;
  padding: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent)) 0 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.header .depth2_info .depth2_title {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .depth2_info .depth2_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .header .depth2_info .depth2_title {
    font-size: var(--fs-h4-mob);
  }
}
.header .depth2_info .depth2_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  line-height: 1.3;
}
.header .depth2_info .depth2_desc {
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .depth2_info .depth2_desc {
    font-size: 16px;
  }
}
.header .depth2_info .depth2_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  line-height: 1.5;
}
.header .depth2_menu {
  position: absolute;
  top: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  left: max(570px * var(--base-ratio), 570 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.header .depth2_menu .depth2_group {
  display: flex;
  flex-direction: column;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
.header .depth2_menu .depth2_link {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .depth2_menu .depth2_link {
    font-size: var(--fs-p1-tab);
  }
}
.header .depth2_menu .depth2_link {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  line-height: 1.5;
  text-decoration: none;
  transition: color 0.3s ease;
  white-space: nowrap;
}
@media (hover: hover) {
  .header .depth2_menu .depth2_link:hover {
    color: #025997;
  }
}
.header .depth2_menu .depth2_link.is_active {
  color: #025997;
  font-weight: 600;
}
.header .depth2_menu .depth2_link.is_outlink {
  display: inline-flex;
  align-items: center;
}
.header .depth2_menu .depth2_link.is_outlink .ico_outlink {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.header .depth2_banner {
  position: absolute;
  top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  right: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  width: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  height: max(188px * var(--base-ratio), 188 / var(--base-size) * var(--base-percent));
}
.header .depth2_banner a {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background-color: #003264;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-decoration: none;
  overflow: hidden;
}
.header .depth2_banner .banner_label {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .depth2_banner .banner_label {
    font-size: var(--fs-p1-tab);
  }
}
.header .depth2_banner .banner_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #FFFFFF;
  line-height: 1.3;
}
.header .depth2_banner svg {
  flex-shrink: 0;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  opacity: 0.6;
  transition: opacity 0.3s ease;
}
.header .depth2_banner .banner_illust_wrap {
  position: absolute;
  left: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  bottom: 0;
  width: max(256px * var(--base-ratio), 256 / var(--base-size) * var(--base-percent));
  height: max(114px * var(--base-ratio), 114 / var(--base-size) * var(--base-percent));
  border-radius: 8px 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) 0;
  overflow: hidden;
  pointer-events: none;
}
.header .depth2_banner .banner_illust {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0, 0.49, 1, 1);
}
@media (hover: hover) {
  .header .depth2_banner:hover .banner_illust {
    transform: scale(1.3);
  }
  .header .depth2_banner:hover svg {
    opacity: 1;
  }
}
.header .depth2_banner .banner_txt {
  position: absolute;
  left: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  top: max(33px * var(--base-ratio), 33 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent));
  object-fit: contain;
}
.header .depth2_banner .banner_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  pointer-events: none;
}
.header .depth2_banner.is_video a, .header .depth2_banner.is_recruit a {
  align-items: flex-end;
  padding-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.header .depth2_banner.is_video .banner_label,
.header .depth2_banner.is_video .banner_outlink, .header .depth2_banner.is_recruit .banner_label,
.header .depth2_banner.is_recruit .banner_outlink {
  position: relative;
  z-index: 1;
}
.header .depth2_banner.is_video .banner_outlink, .header .depth2_banner.is_recruit .banner_outlink {
  flex-shrink: 0;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: url("/images/recruit/ico_outlink_circle.svg") no-repeat center/contain;
  position: relative;
  overflow: hidden;
}
.header .depth2_banner.is_video .banner_outlink img, .header .depth2_banner.is_recruit .banner_outlink img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
.header .depth2_banner.is_video .banner_outlink::after, .header .depth2_banner.is_recruit .banner_outlink::after {
  content: "";
  position: absolute;
  top: 200%;
  left: -100%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url("/images/gnb_banner_outlink_arrow.svg") no-repeat center/contain;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
@media (hover: hover) {
  .header .depth2_banner.is_video:hover .banner_outlink img, .header .depth2_banner.is_recruit:hover .banner_outlink img {
    top: -100%;
    left: 200%;
  }
  .header .depth2_banner.is_video:hover .banner_outlink::after, .header .depth2_banner.is_recruit:hover .banner_outlink::after {
    top: 50%;
    left: 50%;
  }
}
.header .depth2_banner.is_video a {
  background-color: #025997;
}
.header .depth2_banner.is_recruit a {
  background-color: #00A3F1;
}
.header .depth2_banner.is_support {
  height: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.header .depth2_banner.is_support .banner_card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: max(84px * var(--base-ratio), 84 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-decoration: none;
  transition: opacity 0.3s ease;
}
.header .depth2_banner.is_support .banner_card .banner_arrow {
  flex-shrink: 0;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.header .depth2_banner.is_support .banner_card .banner_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .header .depth2_banner.is_support .banner_card:hover {
    opacity: 0.85;
  }
  .header .depth2_banner.is_support .banner_card:hover .banner_arrow svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.header .depth2_banner.is_support .banner_card.is_primary {
  background-color: #025997;
}
.header .depth2_banner.is_support .banner_card.is_primary .banner_label {
  color: #FFFFFF;
  font-weight: 700;
}
.header .depth2_banner.is_support .banner_card.is_outline {
  background-color: #FFFFFF;
  border: 1px solid #D1D2D4;
}
.header .depth2_banner.is_support .banner_card.is_outline .banner_label {
  color: #161D27;
  font-weight: 600;
}
.header .depth2_panel[data-menu=invest] .depth2_banner a {
  background-color: #025997;
}
.header .depth2_panel[data-menu=invest] .depth2_banner .banner_txt {
  left: max(89px * var(--base-ratio), 89 / var(--base-size) * var(--base-percent));
  top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(78px * var(--base-ratio), 78 / var(--base-size) * var(--base-percent));
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
html[lang=en] .header .depth2_panel[data-menu=support] .depth2_menu .depth2_group {
  flex-direction: row;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.header .header_dimmed {
  position: fixed;
  top: max(332px * var(--base-ratio), 332 / var(--base-size) * var(--base-percent));
  left: 0;
  right: 0;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .header .header_dimmed {
    display: none;
  }
}
.header .header_dimmed.is_visible {
  opacity: 1;
  visibility: visible;
}
.header .header_util {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.header .lang_select {
  position: relative;
}
@media screen and (max-width: 1024px) {
  .header .lang_select {
    display: none;
  }
}
.header .btn_lang {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  transition: opacity 0.3s ease;
}
.header .btn_lang img {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .header .btn_lang:hover {
    opacity: 0.7;
  }
}
.header .lang_dropdown {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: 8px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 1001;
}
.header .lang_dropdown.is_open {
  opacity: 1;
  visibility: visible;
}
.header .lang_dropdown .lang_option {
  display: block;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .header .lang_dropdown .lang_option {
    font-size: 14px;
  }
}
.header .lang_dropdown .lang_option {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
  text-decoration: none;
  transition: color 0.3s ease;
}
.header .lang_dropdown .lang_option.is_active {
  font-weight: 700;
  color: #025997;
}
@media (hover: hover) {
  .header .lang_dropdown .lang_option:hover {
    color: #025997;
  }
}
.header .btn_menu {
  width: 48px;
  height: 48px;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  cursor: pointer;
  background: none;
  border: none;
  display: none;
}
@media screen and (max-width: 1024px) {
  .header .btn_menu {
    display: flex;
    width: 32px;
    height: 32px;
  }
}
@media screen and (max-width: 767px) {
  .header .btn_menu {
    width: 28px;
    height: 28px;
    gap: 6px;
  }
}
.header .btn_menu span {
  display: block;
  width: 22px;
  height: 2px;
  transform: translateZ(0);
  transition: all 0.3s ease;
}
@media screen and (max-width: 767px) {
  .header .btn_menu span {
    width: 20px;
  }
}

.mobile_menu_dimmed {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 1100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .mobile_menu_dimmed {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .mobile_menu_dimmed {
    display: none;
  }
}
.mobile_menu_dimmed.is_visible {
  opacity: 1;
  visibility: visible;
}

.mobile_menu {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-color: #FFFFFF;
  z-index: 1101;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.6s ease, visibility 0s linear 0.6s ease;
  overflow-y: auto;
}
@media screen and (max-width: 1024px) {
  .mobile_menu {
    width: 375px;
  }
}
@media screen and (max-width: 767px) {
  .mobile_menu {
    width: 100%;
  }
}
.mobile_menu.is_open {
  transform: translateX(0);
  visibility: visible;
  transition: transform 0.6s ease, visibility 0s linear 0s;
}
.mobile_menu_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #D1D2D4;
}
.mobile_menu .btn_close {
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background: none;
  cursor: pointer;
}
.mobile_menu .btn_lang_toggle {
  display: flex;
  gap: 16px;
}
.mobile_menu .btn_lang_toggle a,
.mobile_menu .btn_lang_toggle button {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .mobile_menu .btn_lang_toggle a,
  .mobile_menu .btn_lang_toggle button {
    font-size: 16px;
  }
}
.mobile_menu .btn_lang_toggle a,
.mobile_menu .btn_lang_toggle button {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #818286;
  border: none;
  background: none;
  cursor: pointer;
  transition: color 0.3s ease;
  text-decoration: none;
}
.mobile_menu .btn_lang_toggle a.is_active,
.mobile_menu .btn_lang_toggle button.is_active {
  color: #161D27;
}
.mobile_menu_list {
  padding: 24px 20px 0;
}
@media screen and (max-width: 1024px) {
  .mobile_menu_list {
    padding-bottom: 20px;
  }
}
.mobile_menu .menu_1depth {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 0;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .mobile_menu .menu_1depth {
    font-size: var(--fs-p1-tab);
  }
}
.mobile_menu .menu_1depth {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  line-height: 1.5;
  cursor: pointer;
  border: none;
  background: none;
}
.mobile_menu .menu_1depth svg {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.mobile_menu .menu_1depth.is_open svg {
  transform: rotate(180deg);
}
.mobile_menu .menu_2depth {
  display: none;
  background-color: #F3F3F3;
  padding: 20px;
  margin: 0;
}
.mobile_menu .menu_2depth.is_open {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mobile_menu .menu_2depth a {
  display: block;
  padding: 0;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .mobile_menu .menu_2depth a {
    font-size: 16px;
  }
}
.mobile_menu .menu_2depth a {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  line-height: 1.5;
  text-decoration: none;
  transition: color 0.3s ease;
}
@media (hover: hover) {
  .mobile_menu .menu_2depth a:hover {
    color: #025997;
  }
}
.mobile_menu .menu_2depth a.is_outlink {
  display: inline-flex;
  align-items: center;
}
.mobile_menu .menu_2depth a.is_outlink .ico_outlink {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}

.wrapper {
  position: relative;
  width: 100%;
  min-width: 340px;
}

.page_main .wrapper {
  overflow: hidden;
}

.content {
  padding: 0;
}

.container {
  max-width: max(1760px * var(--base-ratio), 1760 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .container {
    padding: 0 20px;
  }
}

.section {
  position: relative;
  width: 100%;
}

.section_header {
  margin-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .section_header {
    margin-bottom: 40px;
  }
}
.section_header .section_label {
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .section_header .section_label {
    margin-bottom: 12px;
  }
}
.section_header .section_desc {
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .section_header .section_desc {
    font-size: 16px;
  }
}
.section_header .section_desc {
  letter-spacing: -0.02em;
  line-height: 1.5;
  color: #A8A9AD;
}
@media screen and (max-width: 1024px) {
  .section_header .section_desc {
    margin-top: 16px;
  }
}
.section_header .section_desc.is_dark {
  color: #818286;
}

.footer {
  position: relative;
  background-color: #F3F3F3;
}
.footer .footer_inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_inner {
    padding: 0 20px;
  }
}
.footer .footer_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .footer .footer_top {
    padding: 28px 0 16px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_top {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 28px 0;
  }
}
.footer .footer_links {
  display: flex;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_links {
    gap: 12px;
    flex-wrap: wrap;
  }
}
.footer .footer_links a {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_links a {
    font-size: 14px;
  }
}
.footer .footer_links a {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-decoration: none;
  transition: color 0.3s ease;
}
.footer .footer_links a.is_bold {
  font-weight: 700;
  color: #025997;
}
@media (hover: hover) {
  .footer .footer_links a:hover {
    color: #025997;
  }
}
.footer .footer_links .link_youtube {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_links .link_youtube {
    gap: 6px;
  }
}
.footer .footer_links .ico_youtube {
  width: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_links .ico_youtube {
    width: 28px;
    height: 28px;
  }
}
.footer .link_divider {
  width: 1px;
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  background-color: #D1D2D4;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .footer .link_divider {
    height: 12px;
  }
}
.footer .footer_family {
  position: relative;
}
@media screen and (max-width: 767px) {
  .footer .footer_family {
    width: 100%;
  }
}
.footer .footer_family .family_select {
  position: relative;
  z-index: 999;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  width: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: none;
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_select {
    font-size: 14px;
  }
}
.footer .footer_family .family_select {
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #6D6E72;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_select {
    width: 200px;
    height: 42px;
    padding: 0 16px 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_family .family_select {
    width: 100%;
    padding: 12px 20px;
    height: auto;
  }
}
.footer .footer_family .family_select .ico_plus {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_select .ico_plus {
    width: 20px;
    height: 20px;
  }
}
.footer .footer_family .family_list {
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  width: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  box-shadow: 6px 8px 22px 0px rgba(0, 0, 0, 0.16);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.3s ease;
  z-index: 998;
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_list {
    bottom: 100%;
    width: 220px;
    border: 1px solid #D1D2D4;
    border-radius: 12px;
    padding: 8px 0;
    margin-bottom: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_family .family_list {
    width: 100%;
  }
}
.footer .footer_family .family_list li {
  list-style: none;
}
.footer .footer_family .family_list a {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_list a {
    font-size: 14px;
  }
}
.footer .footer_family .family_list a {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-decoration: none;
  transition: color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer .footer_family .family_list a {
    display: block;
    padding: 10px 20px;
  }
}
@media (hover: hover) {
  .footer .footer_family .family_list a:hover {
    color: #025997;
  }
}
.footer .footer_family.is_open .family_list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.footer .footer_family.is_open .ico_plus {
  transform: rotate(45deg);
}
.footer .footer_bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) 0 max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_bottom {
    padding: 20px 0 30px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 28px 0 20px;
  }
}
.footer .footer_slogan {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_slogan {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_slogan {
    font-size: var(--fs-h3-mob);
  }
}
.footer .footer_slogan {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #BCBDC1;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
@media screen and (max-width: 767px) {
  .footer .footer_slogan {
    align-self: stretch;
    text-align: left;
    margin-top: 36px;
  }
}
.footer .footer_info {
  display: flex;
  flex-direction: row;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_info {
    gap: 26px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_info {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}
.footer .footer_logo {
  width: max(110px * var(--base-ratio), 110 / var(--base-size) * var(--base-percent));
  height: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_logo {
    width: 94px;
    height: 36px;
  }
}
@media screen and (max-width: 767px) {
  .footer .footer_logo {
    width: 89px;
    height: 34px;
  }
}
.footer .footer_copyright_wrap {
  display: flex;
  flex-direction: column;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer .footer_copyright_wrap {
    gap: 6px;
  }
}
.footer .footer_offices {
  display: flex;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_offices {
    font-size: 14px;
  }
}
.footer .footer_offices {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
@media screen and (max-width: 1024px) {
  .footer .footer_offices {
    gap: 10px;
  }
}
.footer .office_divider {
  width: 1px;
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  background-color: #D1D2D4;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .footer .office_divider {
    height: 14px;
  }
}
.footer .footer_copyright {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer .footer_copyright {
    font-size: 12px;
  }
}
.footer .footer_copyright {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #818286;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: left;
}

.email_popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1100;
}
.email_popup.is_open {
  display: block;
}
.email_popup .email_popup_dimmed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
.email_popup .email_popup_content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  height: auto;
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .email_popup .email_popup_content {
    width: 511px;
    height: auto;
    gap: 16px;
    padding: 36px 30px;
    border-radius: 16px;
  }
}
@media screen and (max-width: 767px) {
  .email_popup .email_popup_content {
    width: 335px;
    height: auto;
    gap: 16px;
    padding: 36px 30px;
    border-radius: 16px;
  }
}
.email_popup .email_popup_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .email_popup .email_popup_header {
    gap: 20px;
  }
}
.email_popup .email_popup_title {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .email_popup .email_popup_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .email_popup .email_popup_title {
    font-size: var(--fs-h3-mob);
  }
}
.email_popup .email_popup_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin: 0;
}
.email_popup .email_popup_close {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .email_popup .email_popup_close {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 767px) {
  .email_popup .email_popup_close {
    width: 40px;
    height: 40px;
  }
}
.email_popup .email_popup_close img {
  width: 100%;
  height: 100%;
}
.email_popup .email_popup_line {
  width: 100%;
  height: 1px;
  background: #D1D2D4;
}
.email_popup .email_popup_body {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .email_popup .email_popup_body {
    font-size: var(--fs-p1-tab);
  }
}
.email_popup .email_popup_body {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  margin: 0;
}

.footer_quick {
  position: fixed;
  right: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .footer_quick {
    right: 20px;
    bottom: 16px;
  }
}
@media screen and (max-width: 767px) {
  .footer_quick {
    bottom: 12px;
  }
}
.footer_quick .quick_btn {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 1.25px solid #D1D2D4;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: height 0.3s ease, background 0.3s ease, border-radius 0.3s ease, border 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_btn {
    width: 48px;
    height: 48px;
    border-width: 1px;
  }
}
.footer_quick .quick_logo {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  display: none;
  color: #FFFFFF;
  cursor: pointer;
  transition: color 0.3s ease;
}
@media (hover: hover) {
  .footer_quick .quick_logo:hover {
    color: #7BCDF5;
  }
}
.footer_quick :lang(en) .quick_logo {
  width: max(35px * var(--base-ratio), 35 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  object-fit: contain;
}
@media screen and (max-width: 1024px) {
  .footer_quick :lang(en) .quick_logo {
    width: 35px;
  }
}
.footer_quick .quick_dot {
  width: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
  height: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #BCBDC1;
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  display: none;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_dot {
    width: 2px;
    height: 2px;
  }
}
.footer_quick .quick_text {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_text {
    font-size: 12px;
  }
}
.footer_quick .quick_text {
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: center;
  padding: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  display: none;
  cursor: pointer;
  transition: color 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_text {
    font-size: 10px;
  }
}
@media (hover: hover) {
  .footer_quick .quick_text:hover {
    color: #7BCDF5;
  }
}
.footer_quick .quick_close {
  display: none;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  margin-top: auto;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_close {
    width: 19px;
    height: 19px;
    margin-bottom: 16px;
  }
}
.footer_quick .quick_close svg {
  width: 100%;
  height: 100%;
}
.footer_quick .quick_plus {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #6D6E72;
  display: block;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_plus {
    width: 19px;
    height: 19px;
  }
}
.footer_quick .quick_top {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #025997;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  cursor: pointer;
  transition: background 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_top {
    width: 48px;
    height: 48px;
    margin-top: 7px;
  }
}
.footer_quick .quick_top svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_top svg {
    width: 19px;
    height: 19px;
  }
}
@media (hover: hover) {
  .footer_quick .quick_top:hover {
    background: rgb(1.4666666667, 65.2666666667, 110.7333333333);
  }
}
.footer_quick .quick_panel {
  display: none;
  position: absolute;
  right: 0;
  bottom: 100%;
  width: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  margin-bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer_quick .quick_panel {
    width: 200px;
    padding: 16px;
    gap: 20px;
    border-radius: 12px;
    margin-bottom: 6px;
  }
}
.footer_quick .panel_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_header {
    gap: 10px;
  }
}
.footer_quick .panel_header > span {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_header > span {
    font-size: 14px;
  }
}
.footer_quick .panel_header > span {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.footer_quick .panel_close {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_close {
    width: 20px;
    height: 20px;
  }
}
.footer_quick .panel_close {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transform: rotate(45deg);
}
.footer_quick .panel_close svg {
  width: 100%;
  height: 100%;
}
.footer_quick .panel_list {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  list-style: none;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_list {
    gap: 6px;
  }
}
.footer_quick .panel_list a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_list a {
    gap: 8px;
  }
}
.footer_quick .panel_list a {
  text-decoration: none;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .footer_quick .panel_list a {
    font-size: 14px;
  }
}
.footer_quick .panel_list a {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  transition: opacity 0.3s ease;
}
@media (hover: hover) {
  .footer_quick .panel_list a:hover {
    opacity: 0.8;
  }
}
.footer_quick .link_arrow {
  flex-shrink: 0;
}
.footer_quick .link_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: block;
}
@media screen and (max-width: 1024px) {
  .footer_quick .link_arrow svg {
    width: 24px;
    height: 24px;
  }
}
@media (hover: hover) {
  .footer_quick .panel_list a:hover .link_arrow svg .arrow {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.footer_quick.is_open .quick_btn {
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  background: rgba(0, 0, 0, 0.8);
  border: none;
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  justify-content: flex-start;
}
@media screen and (max-width: 1024px) {
  .footer_quick.is_open .quick_btn {
    height: 132px;
    background: rgba(0, 0, 0, 0.6);
    border: none;
    border-radius: 999px;
  }
}
.footer_quick.is_open .quick_logo {
  display: block;
}
@media screen and (max-width: 1024px) {
  .footer_quick.is_open .quick_logo {
    margin-top: 16px;
  }
}
.footer_quick.is_open .quick_dot {
  display: block;
}
@media screen and (max-width: 1024px) {
  .footer_quick.is_open .quick_dot {
    margin-top: 4px;
  }
}
.footer_quick.is_open .quick_text {
  display: block;
}
@media screen and (max-width: 1024px) {
  .footer_quick.is_open .quick_text {
    padding: 8px 7px;
  }
}
.footer_quick.is_open .quick_close {
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer_quick.is_open .quick_plus {
  display: none;
}
.footer_quick.is_panel_open .quick_btn {
  display: none;
}
.footer_quick.is_panel_open .quick_panel {
  display: flex;
}

.swiper {
  width: 100%;
}
.swiper .swiper-wrapper {
  align-items: stretch;
}
.swiper .swiper-slide {
  height: auto;
}

.swiper_nav {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 12px;
}
.swiper_nav .swiper_btn {
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid #D1D2D4;
  background-color: #FFFFFF;
  transition: all 0.3s ease;
  cursor: pointer;
}
@media (hover: hover) {
  .swiper_nav .swiper_btn:hover {
    background-color: #F3F3F3;
  }
}
.swiper_nav .swiper_btn.is_dark {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}
@media (hover: hover) {
  .swiper_nav .swiper_btn.is_dark:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
}
.swiper_nav .swiper_btn.swiper-button-disabled {
  opacity: 0.3;
  cursor: default;
}
.swiper_nav .swiper_btn svg {
  width: 20px;
  height: 20px;
}
.swiper_nav .swiper_btn.swiper_prev svg {
  transform: rotate(180deg);
}

.swiper_pagination {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  margin-top: 32px;
}
.swiper_pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  transition: all 0.3s ease;
}
.swiper_pagination .swiper-pagination-bullet-active {
  width: 24px;
  border-radius: 4px;
  background-color: #FFFFFF;
}

html.page_main {
  overflow: hidden;
}
html.page_main:not(.is_loaded) .sc_kv .kv_btn {
  visibility: hidden;
}
html.page_main.is_loaded {
  overflow: visible;
}
html.page_main::-webkit-scrollbar {
  display: none;
}
html.page_main {
  scrollbar-width: none;
}

.page_main .wrapper {
  background-color: #0A0E12;
}

.sc_intro {
  position: relative;
  width: 100%;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sc_intro .intro_inner {
  position: relative;
  width: 100%;
  height: max(1399px * var(--base-ratio), 1399 / var(--base-size) * var(--base-percent));
  max-height: 100%;
}
@media screen and (max-width: 1024px) {
  .sc_intro .intro_inner {
    height: 1024px;
  }
}
.sc_intro .intro_title {
  position: relative;
  visibility: hidden;
}
.sc_intro .intro_title .title_line1,
.sc_intro .intro_title .title_line2 {
  display: block;
  position: absolute;
  overflow: hidden;
  white-space: nowrap;
  padding-bottom: 0.3em;
}
.sc_intro .intro_title .title_line1 .title_text,
.sc_intro .intro_title .title_line2 .title_text {
  display: block;
  font-size: round(down, max(var(--fs-d2-pc) * 1px * var(--base-ratio), var(--fs-d2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_intro .intro_title .title_line1 .title_text,
  .sc_intro .intro_title .title_line2 .title_text {
    font-size: var(--fs-d2-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_intro .intro_title .title_line1 .title_text,
  .sc_intro .intro_title .title_line2 .title_text {
    font-size: var(--fs-d2-mob);
  }
}
.sc_intro .intro_title .title_line1 .title_text,
.sc_intro .intro_title .title_line2 .title_text {
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1;
  color: #161D27;
}
.sc_intro .intro_title .color_primary {
  color: #025997;
}
.sc_intro.intro_v1 .intro_title .title_line1 {
  left: 50%;
  right: auto;
  top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
}
.sc_intro.intro_v1 .intro_title .title_line2 {
  left: 50%;
  right: auto;
  top: max(296px * var(--base-ratio), 296 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
}
.sc_intro.intro_v2 .intro_title .title_line1 {
  left: max(653px * var(--base-ratio), 653 / var(--base-size) * var(--base-percent));
  top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.sc_intro.intro_v2 .intro_title .title_line2 {
  left: max(781px * var(--base-ratio), 781 / var(--base-size) * var(--base-percent));
  top: max(296px * var(--base-ratio), 296 / var(--base-size) * var(--base-percent));
}
.sc_intro.intro_v2 .intro_title .title_line2 .title_text {
  color: #025997;
}
html[lang=en] .sc_intro .intro_title .title_line1 {
  left: 50%;
  right: auto;
  top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
}
html[lang=en] .sc_intro .intro_title .title_line2 {
  left: 50%;
  right: auto;
  top: max(296px * var(--base-ratio), 296 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
}
.sc_intro .intro_images {
  visibility: hidden;
  position: absolute;
  left: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  top: max(452px * var(--base-ratio), 452 / var(--base-size) * var(--base-percent));
  width: max(1760px * var(--base-ratio), 1760 / var(--base-size) * var(--base-percent));
  height: max(827px * var(--base-ratio), 827 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img {
  position: absolute;
  overflow: hidden;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_intro .intro_img_center {
  left: max(573px * var(--base-ratio), 573 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(614px * var(--base-ratio), 614 / var(--base-size) * var(--base-percent));
  height: max(827px * var(--base-ratio), 827 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img_top_right {
  left: max(1227px * var(--base-ratio), 1227 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(533px * var(--base-ratio), 533 / var(--base-size) * var(--base-percent));
  height: max(325px * var(--base-ratio), 325 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img_bottom_left {
  left: 0;
  top: max(522px * var(--base-ratio), 522 / var(--base-size) * var(--base-percent));
  width: max(533px * var(--base-ratio), 533 / var(--base-size) * var(--base-percent));
  height: max(305px * var(--base-ratio), 305 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img_small_right {
  left: max(1227px * var(--base-ratio), 1227 / var(--base-size) * var(--base-percent));
  top: max(365px * var(--base-ratio), 365 / var(--base-size) * var(--base-percent));
  width: max(370px * var(--base-ratio), 370 / var(--base-size) * var(--base-percent));
  height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
}
.sc_intro .intro_img_left_mid {
  left: max(101px * var(--base-ratio), 101 / var(--base-size) * var(--base-percent));
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  width: max(432px * var(--base-ratio), 432 / var(--base-size) * var(--base-percent));
  height: max(322px * var(--base-ratio), 322 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_intro.intro_v1 .intro_title .title_line1 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 138px;
  }
  .sc_intro.intro_v1 .intro_title .title_line2 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 186px;
  }
  .sc_intro.intro_v2 .intro_title .title_line1 {
    left: calc(50% - 168px);
    top: 138px;
  }
  .sc_intro.intro_v2 .intro_title .title_line2 {
    left: calc(50% - 100px);
    top: 188px;
  }
  html[lang=en] .sc_intro .intro_title .title_line1 {
    top: 140px;
  }
  html[lang=en] .sc_intro .intro_title .title_line2 {
    top: 192px;
  }
  .sc_intro .intro_images {
    left: 50%;
    transform: translateX(-50%);
    top: 288px;
    width: 1382px;
    height: 662px;
  }
  .sc_intro .intro_img {
    border-radius: 12px;
  }
  .sc_intro .intro_img_center {
    left: 446px;
    top: 0;
    width: 490px;
    height: 662px;
  }
  .sc_intro .intro_img_top_right {
    left: 956px;
    top: 0;
    width: 426px;
    height: 260px;
  }
  .sc_intro .intro_img_bottom_left {
    left: 0;
    top: 418px;
    width: 426px;
    height: 244px;
  }
  .sc_intro .intro_img_small_right {
    left: 956px;
    top: 280px;
    width: 296px;
    height: 192px;
  }
  .sc_intro .intro_img_left_mid {
    left: 81px;
    top: 140px;
    width: 345px;
    height: 258px;
  }
}
@media screen and (max-width: 767px) {
  .sc_intro .intro_inner {
    height: 812px;
  }
  .sc_intro.intro_v1 .intro_title .title_line1 {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
  .sc_intro.intro_v1 .intro_title .title_line2 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
  .sc_intro.intro_v2 .intro_title .title_line1 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 140px;
  }
  .sc_intro.intro_v2 .intro_title .title_line2 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 190px;
    text-align: center;
  }
  html[lang=en] .sc_intro .intro_title .title_line1 {
    top: 138px;
  }
  html[lang=en] .sc_intro .intro_title .title_line2 {
    top: 188px;
  }
  html[lang=en] .sc_intro.intro_v2 .intro_title .title_line1 {
    top: 120px;
  }
  html[lang=en] .sc_intro.intro_v2 .intro_title .title_line2 {
    top: 170px;
  }
  .sc_intro .intro_images {
    width: 828px;
    height: 397px;
  }
  .sc_intro .intro_img_center {
    left: 267px;
    top: 0;
    width: 294px;
    height: 397px;
  }
  .sc_intro .intro_img_top_right {
    left: 573px;
    top: 0;
    width: 255px;
    height: 156px;
  }
  .sc_intro .intro_img_bottom_left {
    left: 0;
    top: 251px;
    width: 255px;
    height: 146px;
  }
  .sc_intro .intro_img_small_right {
    left: 573px;
    top: 168px;
    width: 177px;
    height: 115px;
  }
  .sc_intro .intro_img_left_mid {
    left: 49px;
    top: 84px;
    width: 206px;
    height: 155px;
  }
}

.label_text {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .label_text {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .label_text {
    font-size: var(--fs-h5-mob);
  }
}
.label_text {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #025997;
}

.title_text {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .title_text {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .title_text {
    font-size: var(--fs-h1-mob);
  }
}
.title_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.btn_more_circle {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  position: relative;
  border: none;
  background: none;
  cursor: pointer;
}
.btn_more_circle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #FFFFFF;
  opacity: 0.2;
  z-index: 1;
}
.btn_more_circle svg {
  position: relative;
  z-index: 2;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.btn_interaction {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: none;
  cursor: pointer;
  transition: all 0.3s ease;
  animation: bounce 2s infinite;
}

.main_stage {
  position: relative;
  width: 100%;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}
.main_stage > .main_card_wrapper {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: max(960px * var(--base-ratio), 960 / var(--base-size) * var(--base-percent));
  height: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .main_stage > .main_card_wrapper {
    width: 511px;
    height: 560px;
  }
}
@media screen and (max-width: 767px) {
  .main_stage > .main_card_wrapper {
    width: 308px;
    height: 340px;
  }
}

.main_card_wrapper .main_card_branding {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.main_card_wrapper .main_card_branding img {
  width: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
}
.main_card_wrapper .main_card_content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  clip-path: inset(100% 0 0 0);
  display: block;
  text-decoration: none;
  cursor: pointer;
}
.main_card_wrapper .main_card_content .card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.main_card_wrapper .main_card_content .card_bg img, .main_card_wrapper .main_card_content .card_bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.main_card_wrapper .main_card_content .card_bg .card_thumb {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
.main_card_wrapper .main_card_content .card_bg::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  height: 42.86%;
  background: linear-gradient(0deg, rgb(0, 88, 138) 30%, rgba(0, 88, 138, 0) 100%), linear-gradient(0deg, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 100%);
  opacity: var(--after-opacity, 1);
}
.main_card_wrapper .main_card_content .card_icon {
  position: absolute;
  top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  right: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  z-index: 3;
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .card_icon {
    width: 48px;
    height: 48px;
    top: 28px;
    right: 28px;
  }
}
@media screen and (max-width: 767px) {
  .main_card_wrapper .main_card_content .card_icon {
    width: 48px;
    height: 48px;
    top: 20px;
    right: 20px;
  }
}
.main_card_wrapper .main_card_content .card_icon img {
  width: 100%;
  height: 100%;
}
.main_card_wrapper .main_card_content .card_content {
  position: absolute;
  left: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  right: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .card_content {
    left: 36px;
    right: 36px;
    bottom: 28px;
  }
}
@media screen and (max-width: 767px) {
  .main_card_wrapper .main_card_content .card_content {
    left: 20px;
    right: 20px;
    bottom: 20px;
  }
}
.main_card_wrapper .main_card_content .card_name {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .card_name {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .main_card_wrapper .main_card_content .card_name {
    font-size: var(--fs-h3-mob);
  }
}
.main_card_wrapper .main_card_content .card_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.main_card_wrapper .main_card_content .card_desc {
  display: block;
  margin-top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.main_card_wrapper .main_card_content .card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .card_desc {
    margin-top: 12px;
  }
}
@media screen and (max-width: 767px) {
  .main_card_wrapper .main_card_content .card_desc {
    display: none;
  }
}
.main_card_wrapper .main_card_content .btn_more_circle {
  position: absolute;
  top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  right: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  z-index: 2;
  opacity: 1;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .main_card_wrapper .main_card_content .btn_more_circle {
    top: 28px;
    right: 28px;
    width: 48px;
    height: 48px;
  }
}
@media screen and (max-width: 767px) {
  .main_card_wrapper .main_card_content .btn_more_circle {
    top: 20px;
    right: 20px;
    width: 48px;
    height: 48px;
  }
}
.main_card_wrapper .main_card_content .btn_more_circle::before {
  background-color: #FFFFFF;
  opacity: 1;
}
.main_card_wrapper .main_card_content .btn_more_circle svg path {
  stroke: #818286;
}
@media (hover: hover) {
  .main_card_wrapper .main_card_content:hover .btn_more_circle svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

.sc_kv {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background-color: #FFFFFF;
}
.sc_kv .kv_inner {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
@media screen and (min-width: 1025px) {
  .sc_kv .kv_inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
.sc_kv .kv_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sc_kv .kv_bg img,
.sc_kv .kv_bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_kv .kv_container {
  position: relative;
  z-index: 2;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
}
@media screen and (min-width: 1025px) {
  .sc_kv .kv_container {
    height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
    padding: 0 0 max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent)) max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_container {
    height: 100%;
    padding: 0 40px 96px;
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_container {
    height: 100%;
    padding: 0 20px 60px;
  }
}
.sc_kv .kv_title {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d1-pc) * 1px * var(--base-ratio), var(--fs-d1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_title {
    font-size: var(--fs-d1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_title {
    font-size: var(--fs-d1-mob);
  }
}
.sc_kv .kv_title {
  letter-spacing: -0.03em;
  font-weight: 600;
  line-height: 1;
  color: #FFFFFF;
}
.sc_kv .kv_title_line {
  display: block;
}
.sc_kv .kv_timeline {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(255, 255, 255, 0.3);
}
@media screen and (min-width: 1025px) {
  .sc_kv .kv_timeline {
    bottom: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_timeline {
    bottom: 162px;
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_timeline {
    bottom: 156px;
  }
}
.sc_kv .kv_timeline .kv_timeline_bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0%;
  background: #FFFFFF;
}
.sc_kv .kv_desc {
  margin-top: max(112px * var(--base-ratio), 112 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_desc {
    font-size: var(--fs-h5-mob);
  }
}
.sc_kv .kv_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_desc {
    margin-top: 84px;
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_desc {
    margin-top: 84px;
  }
}
.sc_kv .kv_btn {
  position: absolute;
  bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  right: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  z-index: 4;
}
@media screen and (max-width: 1024px) {
  .sc_kv .kv_btn {
    right: 24px;
    bottom: 28px;
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_btn {
    right: 20px;
    bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_btn .btn_cta {
    display: none;
  }
}
.sc_kv .kv_btn .btn_flower {
  display: none;
}
@media screen and (max-width: 767px) {
  .sc_kv .kv_btn .btn_flower {
    display: block;
    width: 52px;
    height: 52px;
  }
  .sc_kv .kv_btn .btn_flower img {
    width: 100%;
    height: 100%;
  }
}

.sc_business {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sc_business .business_title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  text-align: center;
  margin-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_business .business_title {
    margin-bottom: 40px;
    padding: 0 40px;
  }
}
.sc_business .business_title .title_text .split_char {
  opacity: 0.15;
}
.sc_business .business_carousel {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .sc_business .business_carousel {
    gap: 16px;
  }
}
.sc_business .carousel_side {
  flex: 1;
  min-width: 0;
  position: relative;
  height: max(400px * var(--base-ratio), 400 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_business .carousel_side {
    height: 400px;
  }
}
@media screen and (max-width: 767px) {
  .sc_business .carousel_side {
    height: 268px;
  }
}
.sc_business .carousel_left .carousel_track {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  justify-content: flex-end;
  will-change: transform;
}
@media screen and (max-width: 767px) {
  .sc_business .carousel_left .carousel_track {
    gap: 16px;
  }
}
.sc_business .carousel_right .carousel_track {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  justify-content: flex-start;
  will-change: transform;
}
@media screen and (max-width: 767px) {
  .sc_business .carousel_right .carousel_track {
    gap: 16px;
  }
}
.sc_business .main_card_placeholder {
  flex-shrink: 0;
  width: max(960px * var(--base-ratio), 960 / var(--base-size) * var(--base-percent));
  height: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_business .main_card_placeholder {
    width: 511px;
    height: 560px;
  }
}
@media screen and (max-width: 767px) {
  .sc_business .main_card_placeholder {
    width: 308px;
    height: 340px;
  }
}
.sc_business .side_card {
  flex-shrink: 0;
  position: relative;
  width: max(400px * var(--base-ratio), 400 / var(--base-size) * var(--base-percent));
  height: max(400px * var(--base-ratio), 400 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .sc_business .side_card {
    width: 400px;
    height: 400px;
  }
}
@media screen and (max-width: 767px) {
  .sc_business .side_card {
    width: 268px;
    height: 268px;
  }
}
.sc_business .side_card .card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sc_business .side_card .card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_business .side_card .card_icon {
  position: absolute;
  top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  right: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  z-index: 2;
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_business .side_card .card_icon {
    width: 52px;
    height: 52px;
    top: 20px;
    right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .sc_business .side_card .card_icon {
    width: 52px;
    height: 52px;
    top: 20px;
    right: 20px;
  }
}
.sc_business .side_card .card_icon img {
  width: 100%;
  height: 100%;
}
.sc_business .side_card .card_content {
  position: absolute;
  bottom: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  left: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  right: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .sc_business .side_card .card_content {
    bottom: 24px;
    left: 28px;
    right: 28px;
  }
}
.sc_business .side_card .card_name {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_business .side_card .card_name {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_business .side_card .card_name {
    font-size: var(--fs-h4-mob);
  }
}
.sc_business .side_card .card_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_business .side_card .btn_more_circle {
  position: absolute;
  top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  right: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  z-index: 2;
  opacity: 0;
  transition: opacity 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .sc_business .side_card .btn_more_circle {
    top: 20px;
    right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .sc_business .side_card .btn_more_circle {
    top: 20px;
    right: 20px;
  }
}
.sc_business .side_card .btn_more_circle::before {
  background-color: #FFFFFF;
  opacity: 1;
}
.sc_business .side_card .btn_more_circle svg path {
  stroke: #818286;
}
.sc_business .side_card:has(.card_icon) .btn_more_circle {
  display: none;
}
@media (hover: hover) {
  .sc_business .side_card:hover .btn_more_circle {
    opacity: 1;
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  40% {
    transform: translateX(-50%) translateY(-8px);
  }
  60% {
    transform: translateX(-50%) translateY(-4px);
  }
}
.sc_value {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.sc_value .value_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 300%;
  background: linear-gradient(180deg, #FFFFFF 0%, #8BBDD6 10%, #5B9FC4 20%, #025997 33%, #06375B 66%, #0D1A3D 100%);
  z-index: 0;
}
.sc_value .value_inner {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.sc_value .value_content {
  position: relative;
  z-index: 1;
  text-align: center;
}
.sc_value .value_line {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  z-index: 0;
  pointer-events: none;
}
.sc_value .value_line svg {
  display: block;
  width: 100%;
  height: auto;
}
.sc_value .value_title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_value .value_title {
    gap: 8px;
  }
}
.sc_value .title_sub {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(98px * var(--base-ratio), 98 / var(--base-size) * var(--base-percent));
  font-weight: 600;
  color: rgba(255, 255, 255, 0.3);
  letter-spacing: -0.03em;
  line-height: 1em;
  opacity: 0;
  transform: translateY(max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)));
}
@media screen and (max-width: 1024px) {
  .sc_value .title_sub {
    font-size: 75.25px;
  }
}
@media screen and (max-width: 767px) {
  .sc_value .title_sub {
    font-size: 36.64px;
  }
}
.sc_value .title_main {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: -0.03em;
  line-height: 1em;
  opacity: 0;
  transform: translateY(max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)));
}
@media screen and (max-width: 1024px) {
  .sc_value .title_main {
    font-size: 107.5px;
  }
}
@media screen and (max-width: 767px) {
  .sc_value .title_main {
    font-size: 52.34px;
  }
}

.sc_network_global {
  position: relative;
  width: 100%;
  height: 100vh;
  background: #0D1A3D;
  margin-top: -1px;
  overflow: hidden;
}
.sc_network_global .shared_bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
.sc_network_global .shared_bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_network_global .shared_bg .globe_video_mo {
  display: none;
}
@media screen and (max-width: 767px) {
  .sc_network_global .shared_bg .globe_video_pc {
    display: none;
  }
  .sc_network_global .shared_bg .globe_video_mo {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    height: auto;
  }
}
.sc_network_global .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sc_network_global .panel_inner {
  max-width: max(1760px * var(--base-ratio), 1760 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_inner {
    padding: 0 20px;
  }
}
.sc_network_global .panel_inner {
  width: 100%;
}
.sc_network_global .panel_network {
  z-index: 3;
}
.sc_network_global .panel_network .network_content {
  position: relative;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  height: max(867px * var(--base-ratio), 867 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_content {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
  }
}
.sc_network_global .panel_network .network_header {
  width: max(406px * var(--base-ratio), 406 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_header {
    width: 100%;
  }
}
.sc_network_global .panel_network .network_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .network_label {
    font-size: var(--fs-h5-mob);
  }
}
.sc_network_global .panel_network .network_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #e7e7e9;
  opacity: 0.6;
  margin-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .network_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .network_title {
    font-size: var(--fs-h1-mob);
  }
}
.sc_network_global .panel_network .network_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  margin-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .network_title {
    margin-bottom: 24px;
  }
}
.sc_network_global .panel_network .network_grid {
  position: absolute;
  left: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  top: max(279px * var(--base-ratio), 279 / var(--base-size) * var(--base-percent));
  width: max(1204px * var(--base-ratio), 1204 / var(--base-size) * var(--base-percent));
  height: max(588px * var(--base-ratio), 588 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_grid {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    display: flex;
    gap: 20px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -40px;
    padding: 0 40px;
  }
  .sc_network_global .panel_network .network_grid::-webkit-scrollbar {
    display: none;
  }
  .sc_network_global .panel_network .network_grid {
    scrollbar-width: none;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .sc_network_global .panel_network .network_grid {
    margin: 0 -20px;
    padding: 0 20px;
  }
}
.sc_network_global .panel_network .network_card {
  position: absolute;
  width: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  background: linear-gradient(218deg, rgba(153, 153, 153, 0.18) 0%, rgba(255, 255, 255, 0.12) 38%, rgba(255, 255, 255, 0.12) 63%, rgba(152, 152, 153, 0.18) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateZ(0);
  transition: backdrop-filter 0.3s ease, background 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_card {
    position: relative;
    width: 220px;
    height: 220px;
    border-radius: 8px;
    flex-shrink: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .network_card {
    padding: 20px;
  }
}
.sc_network_global .panel_network .network_card .card_hover_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .sc_network_global .panel_network .network_card:hover {
    backdrop-filter: none;
    background: transparent;
  }
  .sc_network_global .panel_network .network_card:hover .card_hover_bg {
    opacity: 1;
  }
  .sc_network_global .panel_network .network_card:hover .card_icon {
    opacity: 0;
  }
}
.sc_network_global .panel_network .network_card[data-index="0"] {
  left: 0;
  top: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .network_card[data-index="1"] {
  left: max(308px * var(--base-ratio), 308 / var(--base-size) * var(--base-percent));
  top: 0;
}
.sc_network_global .panel_network .network_card[data-index="2"] {
  left: max(308px * var(--base-ratio), 308 / var(--base-size) * var(--base-percent));
  top: max(308px * var(--base-ratio), 308 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .network_card[data-index="3"] {
  left: max(616px * var(--base-ratio), 616 / var(--base-size) * var(--base-percent));
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .network_card[data-index="4"] {
  left: max(924px * var(--base-ratio), 924 / var(--base-size) * var(--base-percent));
  top: max(308px * var(--base-ratio), 308 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .network_card[data-index="5"] {
  left: max(924px * var(--base-ratio), 924 / var(--base-size) * var(--base-percent));
  top: 0;
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .network_card[data-index="0"], .sc_network_global .panel_network .network_card[data-index="1"], .sc_network_global .panel_network .network_card[data-index="2"], .sc_network_global .panel_network .network_card[data-index="3"], .sc_network_global .panel_network .network_card[data-index="4"], .sc_network_global .panel_network .network_card[data-index="5"] {
    left: auto;
    top: auto;
  }
  .sc_network_global .panel_network .network_card[data-index="0"], .sc_network_global .panel_network .network_card[data-index="2"], .sc_network_global .panel_network .network_card[data-index="4"] {
    margin-top: 48px;
  }
}
.sc_network_global .panel_network .card_icon {
  position: absolute;
  right: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  z-index: 1;
  transition: opacity 0.3s ease;
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .card_icon {
    width: 80px;
    height: 45px;
  }
}
.sc_network_global .panel_network .card_icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sc_network_global .panel_network .card_content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sc_network_global .panel_network .card_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .card_label {
    font-size: var(--fs-p1-tab);
  }
}
.sc_network_global .panel_network .card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_network_global .panel_network .card_value {
  display: flex;
  align-items: flex-end;
  gap: 2px;
}
.sc_network_global .panel_network .card_value .count {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .card_value .count {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_network .card_value .count {
    font-size: var(--fs-d3-mob);
  }
}
.sc_network_global .panel_network .card_value .count {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.sc_network_global .panel_network .card_value .plus {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  line-height: 1;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .card_value .unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .card_value .unit {
    font-size: 16px;
  }
}
.sc_network_global .panel_network .card_value .unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_network .card_note {
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_network .card_note {
    font-size: 12px;
  }
}
.sc_network_global .panel_network .card_note {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-top: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_global {
  top: 100%;
  visibility: hidden;
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global {
    align-items: flex-start;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .panel_inner {
    padding-top: 150px;
    padding-bottom: 150px;
  }
}
.sc_network_global .panel_global .global_content {
  display: flex;
  gap: max(136px * var(--base-ratio), 136 / var(--base-size) * var(--base-percent));
  align-items: flex-start;
  justify-content: flex-start;
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .global_content {
    flex-direction: column-reverse;
    gap: 40px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .sc_network_global .panel_global .global_content {
    gap: 50px;
  }
}
.sc_network_global .panel_global .global_stats {
  flex-shrink: 0;
  width: max(780px * var(--base-ratio), 780 / var(--base-size) * var(--base-percent));
  padding-top: max(62px * var(--base-ratio), 62 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .global_stats {
    width: 100%;
    padding-top: 0;
  }
}
.sc_network_global .panel_global .global_header {
  flex: 1;
  max-width: max(548px * var(--base-ratio), 548 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .global_header {
    width: 100%;
    max-width: 100%;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .sc_network_global .panel_global .global_header {
    gap: 8px;
  }
  html[lang=en] .sc_network_global .panel_global .global_header .btn {
    margin-top: 18px;
  }
}
.sc_network_global .panel_global .global_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .global_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .global_label {
    font-size: var(--fs-h5-mob);
  }
}
.sc_network_global .panel_global .global_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #e7e7e9;
  opacity: 0.6;
}
.sc_network_global .panel_global .global_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .global_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .global_title {
    font-size: var(--fs-h1-mob);
  }
}
.sc_network_global .panel_global .global_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: right;
}
.sc_network_global .panel_global .stat_card_featured {
  position: relative;
  width: 100%;
  height: max(230px * var(--base-ratio), 230 / var(--base-size) * var(--base-percent));
  background: linear-gradient(218deg, rgba(153, 153, 153, 0.18) 0%, rgba(255, 255, 255, 0.12) 38%, rgba(255, 255, 255, 0.12) 63%, rgba(152, 152, 153, 0.18) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured {
    height: auto;
    min-height: 200px;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured {
    height: 257px;
    padding: 32px 20px;
    border-radius: 8px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_title {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured .stat_title {
    gap: 4px;
    margin-bottom: 6px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured .stat_label {
    font-size: var(--fs-p1-tab);
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_network_global .panel_global .stat_card_featured .stat_year {
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured .stat_year {
    font-size: 12px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_year {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #a8a9ad;
}
.sc_network_global .panel_global .stat_card_featured .stat_value {
  display: flex;
  align-items: flex-end;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured .stat_value {
    gap: 6px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_value .count {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured .stat_value .count {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured .stat_value .count {
    font-size: var(--fs-d3-mob);
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_value .count {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.sc_network_global .panel_global .stat_card_featured .stat_value .unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured .stat_value .unit {
    font-size: 16px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_value .unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-bottom: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}
html[lang=en] .sc_network_global .panel_global .stat_card_featured .stat_value .unit {
  line-height: 1.2;
  margin-bottom: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  html[lang=en] .sc_network_global .panel_global .stat_card_featured .stat_value .unit {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured .stat_value .unit {
    margin-bottom: 0;
    align-self: flex-end;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_chart {
  position: absolute;
  top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  right: 0;
  width: max(452px * var(--base-ratio), 452 / var(--base-size) * var(--base-percent));
  height: max(210px * var(--base-ratio), 210 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_featured .stat_chart {
    width: 60%;
    right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_featured .stat_chart {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 156px;
  }
}
.sc_network_global .panel_global .stat_card_featured .stat_chart svg {
  width: 100%;
  height: 100%;
}
.sc_network_global .panel_global .stat_card_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: max(184px * var(--base-ratio), 184 / var(--base-size) * var(--base-percent));
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background: linear-gradient(218deg, rgba(153, 153, 153, 0.18) 0%, rgba(255, 255, 255, 0.12) 38%, rgba(255, 255, 255, 0.12) 63%, rgba(152, 152, 153, 0.18) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_card_row {
    height: auto;
    flex-wrap: wrap;
    gap: 24px;
    padding: 24px 0 28px;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_card_row {
    height: 291px;
    flex-direction: column;
    align-items: flex-start;
    padding: 0 20px;
    margin-top: 20px;
    border-radius: 8px;
    gap: 0;
  }
}
.sc_network_global .panel_global .stat_item {
  flex: auto;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 max(23px * var(--base-ratio), 23 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_global .stat_item:first-child {
  padding-left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.sc_network_global .panel_global .stat_item:last-child {
  padding-right: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item {
    flex: 1;
    width: 100%;
    padding: 0;
    justify-content: center;
  }
  .sc_network_global .panel_global .stat_item:first-child {
    padding-left: 0;
  }
  .sc_network_global .panel_global .stat_item:last-child {
    padding-right: 0;
  }
}
.sc_network_global .panel_global .stat_item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: max(104px * var(--base-ratio), 104 / var(--base-size) * var(--base-percent));
  background-color: rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item:not(:last-child)::after {
    position: absolute;
    right: 0;
    left: 0;
    top: auto;
    bottom: 0;
    transform: none;
    width: 100%;
    height: 1px;
  }
}
.sc_network_global .panel_global .stat_item .stat_cont {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item .stat_cont {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_label {
    font-size: var(--fs-p1-tab);
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_label {
    margin-bottom: 0;
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_value {
  display: flex;
  align-items: flex-end;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_value {
    gap: 6px;
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_value .count {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_value .count {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_value .count {
    font-size: var(--fs-d3-mob);
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_value .count {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
@media screen and (min-width: 1025px) {
  html[lang=ko] .sc_network_global .panel_global .stat_item .stat_cont .stat_value .count {
    font-size: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
    font-size: 16px;
  }
}
.sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-bottom: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}
html[lang=en] .sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
  line-height: 1.2;
  margin-bottom: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  html[lang=en] .sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_network_global .panel_global .stat_item .stat_cont .stat_value .unit {
    margin-bottom: 0;
    align-self: flex-end;
  }
}

.sc_placeholder {
  display: none;
}

.sc_flower {
  position: relative;
  width: 100%;
  background-color: #FFFFFF;
  overflow: hidden;
}
.sc_flower .flower_inner {
  max-width: max(1920px * var(--base-ratio), 1920 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 1025px) {
  .sc_flower .flower_inner {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
    padding-bottom: max(208px * var(--base-ratio), 208 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .sc_flower .flower_inner {
    padding: 100px 40px 160px;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .flower_inner {
    padding: 160px 20px 153px;
  }
}
.sc_flower .flower_header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_flower .flower_header {
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .flower_header {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 32px;
  }
}
.sc_flower .flower_title_wrap {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_flower .flower_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_flower .flower_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .flower_label {
    font-size: var(--fs-h5-mob);
  }
}
.sc_flower .flower_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #025997;
}
.sc_flower .flower_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_flower .flower_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .flower_title {
    font-size: var(--fs-h1-mob);
  }
}
.sc_flower .flower_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.sc_flower .flower_title .split_char {
  opacity: 0.15;
}
.sc_flower .flower_banner {
  position: relative;
  width: 100%;
  height: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_flower .flower_banner {
    height: 660px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .flower_banner {
    height: 738px;
  }
}
.sc_flower .banner_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.6s ease;
}
.sc_flower .banner_bg.is_active {
  opacity: 1;
}
.sc_flower .banner_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .sc_flower .banner_bg img {
    object-fit: cover;
    object-position: center;
  }
}
.sc_flower .banner_cols {
  position: relative;
  z-index: 2;
  display: flex;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_cols {
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .banner_cols {
    flex-direction: column;
  }
}
.sc_flower .banner_col {
  position: relative;
  flex: 1;
  height: 100%;
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
.sc_flower .banner_col:not(:first-child) {
  border-left: 1px solid rgba(209, 210, 212, 0.6);
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_col {
    padding: 0 40px;
    justify-content: center;
  }
  .sc_flower .banner_col:not(:first-child) {
    border-left: none;
    border-top: 1px solid rgba(209, 210, 212, 0.6);
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .banner_col {
    padding: 28px 20px;
    justify-content: flex-end;
  }
  .sc_flower .banner_col:not(:first-child) {
    border-left: none;
    border-top: 1px solid rgba(209, 210, 212, 0.6);
  }
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_col.active {
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .banner_col.active {
    justify-content: center;
  }
}
.sc_flower .banner_col.active .col_title {
  color: #FFFFFF;
  opacity: 1;
  transition: opacity 0.4s ease;
}
.sc_flower .banner_col.active .col_top {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_col.active .col_top {
    max-height: 200px;
  }
}
.sc_flower .banner_col.inactive .col_title {
  color: #FFFFFF;
  opacity: 0.2;
  transition: opacity 0.4s ease;
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_col.inactive .col_title {
    opacity: 0.4;
  }
}
.sc_flower .banner_col.inactive .col_top {
  opacity: 0;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .sc_flower .banner_col.inactive .col_top {
    max-height: 0;
    overflow: hidden;
  }
}
.sc_flower .col_top {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  transition: opacity 0.4s ease;
}
@media screen and (max-width: 1024px) {
  .sc_flower .col_top {
    transition: opacity 0.4s ease, max-height 0.4s ease;
  }
}
.sc_flower .col_ico {
  width: max(115px * var(--base-ratio), 115 / var(--base-size) * var(--base-percent));
  height: max(87px * var(--base-ratio), 87 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_flower .col_ico {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .col_ico {
    display: none;
  }
}
.sc_flower .col_ico img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sc_flower .col_desc {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_flower .col_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .col_desc {
    font-size: var(--fs-h5-mob);
  }
}
.sc_flower .col_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.sc_flower .col_title {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_flower .col_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .col_title {
    font-size: var(--fs-h2-mob);
  }
}
.sc_flower .col_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  margin-top: auto;
}
@media screen and (max-width: 1024px) {
  .sc_flower .col_title {
    order: -1;
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_flower .col_title {
    margin-top: 0;
  }
}

.sc_recruit {
  position: relative;
  width: 100%;
  background-color: #0A0E12;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_recruit {
    padding: 140px 0 160px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit {
    padding: 140px 0 160px;
  }
}
.sc_recruit .recruit_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sc_recruit .recruit_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_recruit .recruit_inner {
  width: 100%;
  max-width: max(1920px * var(--base-ratio), 1920 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 1025px) {
  .sc_recruit .recruit_inner {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: max(159px * var(--base-ratio), 159 / var(--base-size) * var(--base-percent));
    padding-bottom: max(104px * var(--base-ratio), 104 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_inner {
    padding: 0 20px;
  }
}
.sc_recruit .recruit_header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  text-align: center;
  margin-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_header {
    margin-bottom: 40px;
  }
}
.sc_recruit .recruit_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_label {
    font-size: var(--fs-h5-mob);
  }
}
.sc_recruit .recruit_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #e7e7e9;
  opacity: 0.6;
}
.sc_recruit .recruit_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_title {
    font-size: var(--fs-h1-mob);
  }
}
.sc_recruit .recruit_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_recruit .recruit_content {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_content {
    flex-direction: column;
  }
}
.sc_recruit .recruit_left {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_recruit .recruit_right {
  flex: 0 0 41%;
  min-width: 0;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_right {
    flex: none;
    width: 100%;
  }
}
.sc_recruit .recruit_bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: 0 max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  background: linear-gradient(218deg, rgba(153, 153, 153, 0.1) 0%, rgba(255, 255, 255, 0.05) 38%, rgba(255, 255, 255, 0.05) 63%, rgba(152, 152, 153, 0.1) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar {
    height: 190px;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    border-radius: 8px;
  }
}
.sc_recruit .recruit_bar .bar_info {
  display: flex;
  align-items: center;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_info {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 16px;
  }
}
.sc_recruit .recruit_bar .bar_hiring {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_bar .bar_hiring {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_hiring {
    font-size: var(--fs-h5-mob);
  }
}
.sc_recruit .recruit_bar .bar_hiring {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
  flex-shrink: 0;
}
.sc_recruit .recruit_bar .bar_divider {
  width: 1px;
  height: max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: rgba(209, 210, 212, 0.6);
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_divider {
    width: 100%;
    height: 1px;
  }
}
.sc_recruit .recruit_bar .bar_detail {
  display: flex;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_detail {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}
.sc_recruit .recruit_bar .bar_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.2);
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_bar .bar_tag {
    font-size: 14px;
  }
}
.sc_recruit .recruit_bar .bar_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_tag {
    height: 28px;
  }
}
.sc_recruit .recruit_bar .bar_text {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_bar .bar_text {
    font-size: 16px;
  }
}
.sc_recruit .recruit_bar .bar_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_recruit .recruit_bar .bar_arrow {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_bar .bar_arrow {
    position: absolute;
    top: 24px;
    right: 20px;
    width: 20px;
    height: 20px;
  }
}
.sc_recruit .recruit_bar .bar_arrow svg {
  width: 100%;
  height: 100%;
}
@media (hover: hover) {
  .sc_recruit .recruit_bar:hover .bar_arrow svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.sc_recruit .recruit_banners {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banners {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_banners {
    flex-direction: column;
  }
}
.sc_recruit .recruit_banner {
  flex: 1;
  position: relative;
  height: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  display: block;
  text-decoration: none;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banner {
    height: 295px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_banner {
    flex: none;
    height: 295px;
  }
}
.sc_recruit .recruit_banner .banner_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sc_recruit .recruit_banner .banner_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.sc_recruit .recruit_banner .banner_txt {
  position: absolute;
  top: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  right: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banner .banner_txt {
    top: 32px;
    left: 24px;
    right: 24px;
    gap: 8px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_banner .banner_txt {
    top: 24px;
    left: 20px;
    right: 20px;
    gap: 8px;
  }
}
.sc_recruit .recruit_banner .banner_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banner .banner_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_banner .banner_title {
    font-size: var(--fs-h4-mob);
  }
}
.sc_recruit .recruit_banner .banner_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_recruit .recruit_banner .banner_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banner .banner_desc {
    font-size: 16px;
  }
}
.sc_recruit .recruit_banner .banner_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.sc_recruit .recruit_banner .banner_more {
  position: absolute;
  bottom: max(44px * var(--base-ratio), 44 / var(--base-size) * var(--base-percent));
  left: max(44px * var(--base-ratio), 44 / var(--base-size) * var(--base-percent));
  z-index: 4;
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-color: #FFFFFF;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_banner .banner_more {
    bottom: 24px;
    left: 24px;
    width: 42px;
    height: 42px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_banner .banner_more {
    bottom: 24px;
    left: 24px;
    width: 42px;
    height: 42px;
  }
}
.sc_recruit .recruit_banner .banner_more svg {
  width: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
  height: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .sc_recruit .recruit_banner:hover .banner_bg img {
    transform: scale(1.05);
  }
  .sc_recruit .recruit_banner:hover .banner_more svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
@media screen and (min-width: 1025px) {
  .sc_recruit.is_no_recruit .recruit_job {
    height: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  }
  .sc_recruit.is_no_recruit .recruit_job .job_img {
    height: max(314px * var(--base-ratio), 314 / var(--base-size) * var(--base-percent));
  }
  .sc_recruit.is_no_recruit .recruit_job .job_bottom {
    padding-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  }
}
.sc_recruit .recruit_job {
  display: flex;
  flex-direction: column;
  height: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
  background: linear-gradient(218deg, rgba(153, 153, 153, 0.1) 0%, rgba(255, 255, 255, 0.05) 38%, rgba(255, 255, 255, 0.05) 63%, rgba(152, 152, 153, 0.1) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  text-decoration: none;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job {
    height: 494px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job {
    height: 390px;
  }
}
.sc_recruit .recruit_job::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #025997;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 0;
}
@media (hover: hover) {
  .sc_recruit .recruit_job:hover::after {
    opacity: 1;
  }
  .sc_recruit .recruit_job:hover .job_more svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.sc_recruit .recruit_job > * {
  position: relative;
  z-index: 1;
}
.sc_recruit .recruit_job .job_img {
  width: 100%;
  height: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  flex-shrink: 0;
}
@media screen and (min-width: 1025px) {
  :lang(en) .sc_recruit .recruit_job .job_img {
    height: max(290px * var(--base-ratio), 290 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_img {
    height: 316px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job .job_img {
    height: 144px;
  }
}
.sc_recruit .recruit_job .job_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_recruit .recruit_job .job_bottom {
  flex: 1;
  display: flex;
  justify-content: space-between;
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job .job_bottom {
    padding: 32px 0 0;
  }
}
.sc_recruit .recruit_job .job_info {
  display: flex;
  align-items: flex-start;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_info {
    flex: 1;
    gap: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job .job_info {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
.sc_recruit .recruit_job .job_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job .job_title {
    font-size: var(--fs-h4-mob);
  }
}
.sc_recruit .recruit_job .job_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  flex-shrink: 0;
}
.sc_recruit .recruit_job .job_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_desc {
    font-size: 16px;
  }
}
.sc_recruit .recruit_job .job_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_desc {
    margin: 0 auto;
  }
  :lang(en) .sc_recruit .recruit_job .job_desc {
    margin: 0 10px;
  }
}
@media screen and (max-width: 767px) {
  :lang(en) .sc_recruit .recruit_job .job_desc {
    margin: 0 auto;
  }
}
.sc_recruit .recruit_job .job_more {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
  align-self: flex-end;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_recruit .recruit_job .job_more {
    width: 42px;
    height: 42px;
  }
}
@media screen and (max-width: 767px) {
  .sc_recruit .recruit_job .job_more {
    width: 42px;
    height: 42px;
  }
}
.sc_recruit .recruit_job .job_more::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #FFFFFF;
  opacity: 0.2;
}
.sc_recruit .recruit_job .job_more svg {
  position: relative;
  z-index: 1;
  width: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
  height: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
}

.sc_news {
  position: relative;
  width: 100%;
  background-color: #FFFFFF;
}
.sc_news .news_inner {
  max-width: max(1920px * var(--base-ratio), 1920 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  .sc_news .news_inner {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
@media screen and (max-width: 1024px) {
  .sc_news .news_inner {
    padding: 140px 40px 160px;
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_inner {
    padding: 140px 20px 160px;
  }
}
.sc_news .news_title_wrap {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  margin-bottom: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .sc_news .news_title_wrap {
    margin-bottom: 32px;
  }
}
.sc_news .news_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_label {
    font-size: var(--fs-h5-mob);
  }
}
.sc_news .news_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #025997;
}
.sc_news .news_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_title {
    font-size: var(--fs-h1-mob);
  }
}
.sc_news .news_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.sc_news .news_title .split_char {
  opacity: 0.15;
}
.sc_news .news_content {
  display: flex;
}
@media screen and (max-width: 1024px) {
  .sc_news .news_content {
    flex-direction: column;
    gap: 32px;
  }
}
.sc_news .news_section {
  flex: 1;
  min-width: 0;
}
.sc_news .news_section_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_news .news_section_header {
    margin-bottom: 20px;
  }
}
.sc_news .news_section_label {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_section_label {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_section_label {
    font-size: var(--fs-h4-mob);
  }
}
.sc_news .news_section_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #818286;
}
.sc_news .news_nav {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.sc_news .news_nav .btn_nav {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid #D1D2D4;
  background: none;
  cursor: pointer;
  transition: all 0.3s ease;
}
@media (hover: hover) {
  .sc_news .news_nav .btn_nav:hover {
    background: #F3F3F3;
  }
}
@media screen and (max-width: 1024px) {
  .sc_news .news_nav .btn_nav {
    width: 40px;
    height: 40px;
  }
}
.sc_news .news_nav .btn_nav svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_news .news_nav .btn_nav svg {
    width: 20px;
    height: 20px;
  }
}
.sc_news .news_list {
  width: 100%;
  --slide-gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_news .news_list.is_single .swiper-wrapper {
  justify-content: flex-start;
}
.sc_news .news_list.is_single .news_card {
  flex: 0 0 auto;
  width: calc((100% - var(--slide-gap) * 2) / 3);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_list.is_single .news_card {
    width: calc((100% - var(--slide-gap)) / 2);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_list.is_single .news_card {
    width: 100%;
  }
}
.sc_news .news_card {
  height: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  position: relative;
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card {
    height: 334px;
    padding: 32px 24px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_card {
    height: 334px;
  }
}
@media (hover: hover) {
  .sc_news .news_card:hover {
    background: #025997;
  }
  .sc_news .news_card:hover .card_tag {
    background: #FFFFFF;
    border-color: transparent;
  }
  .sc_news .news_card:hover .card_title {
    color: #FFFFFF;
  }
  .sc_news .news_card:hover .card_arrow svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .sc_news .news_card:hover .card_arrow svg path {
    stroke: #FFFFFF;
  }
}
.sc_news .news_card .card_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border: 1px solid #025997;
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card .card_tag {
    font-size: 14px;
  }
}
.sc_news .news_card .card_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #025997;
  align-self: flex-start;
  margin-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card .card_tag {
    margin-bottom: 16px;
  }
}
.sc_news .news_card .card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card .card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_card .card_title {
    font-size: var(--fs-h5-mob);
  }
}
.sc_news .news_card .card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.sc_news .news_card .card_arrow {
  position: absolute;
  right: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #025997;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card .card_arrow {
    right: 16px;
    bottom: 16px;
    width: 20px;
    height: 20px;
  }
}
.sc_news .news_card .card_arrow svg {
  width: 100%;
  height: 100%;
}
.sc_news .news_card.has_img {
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_news .news_card.has_img .card_thumb {
  position: relative;
  width: 100%;
  height: max(162px * var(--base-ratio), 162 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  margin-bottom: max(22px * var(--base-ratio), 22 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_news .news_card.has_img .card_thumb {
    height: 140px;
  }
}
.sc_news .news_card.has_img .card_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc_news .news_card.has_img .card_thumb .thumb_badge {
  position: absolute;
  top: 0;
  right: 0;
}
.sc_news .news_card.has_img .card_thumb .thumb_badge svg {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.sc_news .news_card.has_img .card_thumb .thumb_badge .thumb_badge_insta {
  display: block;
  width: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.sc_news .news_card.has_img .card_title {
  padding: 0;
}
.sc_news .news_divider {
  width: 1px;
  background-color: #DDDDDD;
  margin: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  align-self: stretch;
}
@media screen and (max-width: 1024px) {
  .sc_news .news_divider {
    display: none;
  }
}
.sc_news .news_banner {
  flex-shrink: 0;
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding-top: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .sc_news .news_banner {
    width: 100%;
    padding-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .sc_news .news_banner {
    flex-direction: column;
  }
}
.sc_news .banner_card {
  flex: 1;
  height: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
}
.sc_news .banner_card:hover .banner_card_btn.btn_play {
  background: #00A3F1;
}
@media screen and (min-width: 1025px) {
  .sc_news .banner_card:hover .banner_card_img img,
  .sc_news .banner_card:hover .banner_card_visual img {
    transform: scale(1.2);
  }
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card {
    height: 80px;
    border-radius: 8px;
    flex-direction: row;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  .sc_news .banner_card {
    height: 80px;
  }
}
.sc_news .banner_card.brochure {
  background-color: #003264;
}
.sc_news .banner_card.video {
  background-color: #27678C;
}
.sc_news .banner_card .banner_card_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) 0;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card .banner_card_top {
    padding: 20px;
    width: 100%;
  }
}
.sc_news .banner_card .banner_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card .banner_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .sc_news .banner_card .banner_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.sc_news .banner_card .banner_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.sc_news .banner_card .banner_card_btn {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.sc_news .banner_card .banner_card_btn img {
  width: 100%;
  height: 100%;
}
.sc_news .banner_card .banner_card_btn svg {
  width: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
.sc_news .banner_card .banner_card_btn.btn_play {
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: background 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card .banner_card_btn {
    width: 42px;
    height: 42px;
  }
  .sc_news .banner_card .banner_card_btn.btn_play {
    backdrop-filter: blur(17.5px);
    -webkit-backdrop-filter: blur(17.5px);
  }
}
.sc_news .banner_card .banner_card_img {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sc_news .banner_card .banner_card_img img {
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card .banner_card_img {
    display: none;
  }
}
.sc_news .banner_card .banner_card_visual {
  margin-top: max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent));
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .sc_news .banner_card .banner_card_visual {
    display: none;
  }
}
.sc_news .banner_card .banner_card_visual img {
  width: 100%;
  display: block;
  transition: transform 0.3s ease;
}
.sc_news .banner_card .banner_card_visual::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  background: linear-gradient(180deg, #27678C 0%, rgba(39, 103, 140, 0) 100%);
  z-index: 1;
}
.sc_news .banner_card .banner_card_visual::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  background: linear-gradient(0deg, #27678C 0%, rgba(39, 103, 140, 0) 100%);
  z-index: 1;
}

.main_popup {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
}
.main_popup[hidden] {
  display: none;
}
.main_popup .main_popup_dim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}
.main_popup .main_popup_inner {
  position: relative;
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background: #fff;
}
.main_popup .main_popup_view {
  position: relative;
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  height: max(650px * var(--base-ratio), 650 / var(--base-size) * var(--base-percent));
}
.main_popup .popup_slider {
  width: 100%;
  height: 100%;
  --swiper-pagination-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  --swiper-pagination-bullet-horizontal-gap: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent));
}
.main_popup .popup_slide {
  display: block;
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  height: max(650px * var(--base-ratio), 650 / var(--base-size) * var(--base-percent));
  background: #fff;
}
.main_popup .popup_slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.main_popup .popup_indicator {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--swiper-pagination-bottom, max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)));
  z-index: 10;
  text-align: center;
  pointer-events: none;
}
.main_popup .popup_indicator .swiper-pagination-bullet {
  pointer-events: auto;
  width: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #fff;
  border: 1px solid #d1d2d4;
  opacity: 1;
}
.main_popup .popup_indicator .swiper-pagination-bullet-active {
  background: #025997;
  border-color: #025997;
}
.main_popup .main_popup_btns {
  display: flex;
  align-items: center;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #f3f3f3;
}
.main_popup .popup_btn_hide,
.main_popup .popup_btn_close {
  flex: 1;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0;
  border: 0;
  background: transparent;
  color: #6d6e72;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .main_popup .popup_btn_hide,
  .main_popup .popup_btn_close {
    font-size: 16px;
  }
}
.main_popup .popup_btn_hide,
.main_popup .popup_btn_close {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  cursor: pointer;
}
.main_popup .popup_btns_divider {
  width: 1px;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #d1d2d4;
}
@media screen and (max-width: 767px) {
  .main_popup .main_popup_inner {
    width: 335px;
  }
  .main_popup .main_popup_view,
  .main_popup .popup_slide {
    width: 335px;
    height: 403.24px;
  }
  .main_popup .popup_slider {
    --swiper-pagination-bottom: 16px;
  }
  .main_popup .main_popup_btns {
    height: 52px;
  }
  .main_popup .popup_btn_hide,
  .main_popup .popup_btn_close,
  .main_popup .popup_btns_divider {
    height: 52px;
  }
}

.intro_overview_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro_overview_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.intro_overview_hero .intro_overview_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.intro_overview_hero .intro_overview_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .intro_overview_hero_bg {
    width: 90%;
  }
}
.intro_overview_hero .intro_overview_hero_content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.intro_overview_hero .intro_overview_hero_tagline {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .intro_overview_hero_tagline {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_overview_hero .intro_overview_hero_tagline {
    font-size: var(--fs-h2-mob);
  }
}
.intro_overview_hero .intro_overview_hero_tagline {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
  margin-bottom: max(47px * var(--base-ratio), 47 / var(--base-size) * var(--base-percent));
}
.intro_overview_hero .intro_hero_cards {
  position: relative;
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  justify-content: center;
}
.intro_overview_hero .hero_stat_card {
  width: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
  position: relative;
  text-align: center;
  padding-top: max(89px * var(--base-ratio), 89 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  opacity: 0;
}
.intro_overview_hero .stat_ico {
  position: absolute;
  top: max(37px * var(--base-ratio), 37 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
.intro_overview_hero .stat_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .stat_label {
    font-size: var(--fs-p1-tab);
  }
}
.intro_overview_hero .stat_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.intro_overview_hero .stat_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  color: #FFFFFF;
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.intro_overview_hero .stat_plus {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  color: #FFFFFF;
  opacity: 0.6;
  line-height: 1;
  margin-left: 2px;
}
.intro_overview_hero .stat_unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .stat_unit {
    font-size: 16px;
  }
}
.intro_overview_hero .stat_unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-top: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.intro_overview_hero .stat_note {
  position: absolute;
  bottom: 100%;
  right: 0;
  margin-bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .stat_note {
    font-size: 12px;
  }
}
.intro_overview_hero .stat_note {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: right;
  white-space: nowrap;
  opacity: 0;
}
.intro_overview_hero .intro_hero_video {
  position: absolute;
  left: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  bottom: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  z-index: 2;
  width: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  height: max(112px * var(--base-ratio), 112 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  opacity: 0;
  cursor: pointer;
}
.intro_overview_hero .intro_hero_video iframe {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: inherit;
  pointer-events: none;
}
.intro_overview_hero .intro_hero_video .intro_hero_video_cover {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  overflow: hidden;
  transition: opacity 0.6s ease;
  pointer-events: none;
}
.intro_overview_hero .intro_hero_video .intro_hero_video_cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.intro_overview_hero .intro_hero_video .intro_hero_video_cover.is_hidden {
  opacity: 0;
}
@media screen and (min-width: 1025px) {
  .intro_overview_hero .intro_hero_video::before {
    content: "";
    position: absolute;
    inset: -3px;
    z-index: 2;
    border-radius: calc(max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) + 3px);
    padding: 3px;
    pointer-events: none;
    animation: cta-border-rotate 3s linear infinite;
    background: #00A3F1;
    -webkit-mask-image: linear-gradient(#fff 0 0), conic-gradient(from var(--cta-angle, 0deg), transparent 0%, transparent 26%, rgba(0, 0, 0, 0.1) 29%, rgba(0, 0, 0, 0.8) 35%, #000 38%, rgba(0, 0, 0, 0.8) 41%, rgba(0, 0, 0, 0.1) 45%, transparent 47%, transparent 76%, rgba(0, 0, 0, 0.1) 79%, rgba(0, 0, 0, 0.8) 85%, #000 88%, rgba(0, 0, 0, 0.8) 91%, rgba(0, 0, 0, 0.1) 95%, transparent 97%, transparent 100%);
    -webkit-mask-clip: content-box, border-box;
    -webkit-mask-composite: destination-out;
  }
  @supports (-moz-appearance: none) {
    .intro_overview_hero .intro_hero_video::before {
      background: conic-gradient(from var(--cta-angle, 0deg), transparent 0%, transparent 26%, color-mix(in srgb, #00A3F1 10%, transparent) 29%, color-mix(in srgb, #00A3F1 80%, transparent) 35%, #00A3F1 38%, color-mix(in srgb, #00A3F1 80%, transparent) 41%, color-mix(in srgb, #00A3F1 10%, transparent) 45%, transparent 47%, transparent 76%, color-mix(in srgb, #00A3F1 10%, transparent) 79%, color-mix(in srgb, #00A3F1 80%, transparent) 85%, #00A3F1 88%, color-mix(in srgb, #00A3F1 80%, transparent) 91%, color-mix(in srgb, #00A3F1 10%, transparent) 95%, transparent 97%, transparent 100%);
      mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);
      mask-clip: content-box, border-box;
      mask-composite: subtract;
    }
  }
}
@media screen and (max-width: 1024px) {
  .intro_overview_hero .intro_overview_hero_tagline {
    margin: 0 40px 40px;
  }
  .intro_overview_hero .intro_hero_cards {
    flex-wrap: wrap;
    justify-content: center;
    max-width: 514px;
    gap: 20px;
  }
  .intro_overview_hero .hero_stat_card {
    width: 158px;
    height: 175px;
    border-radius: 8px;
    padding-top: 60px;
  }
  .intro_overview_hero .stat_ico {
    top: 24px;
    width: 28px;
    height: 28px;
  }
  .intro_overview_hero .stat_num {
    font-size: 40px;
  }
  .intro_overview_hero .stat_plus {
    font-size: 40px;
  }
  .intro_overview_hero .stat_label {
    margin-bottom: 4px;
  }
  .intro_overview_hero .stat_unit {
    margin-top: 4px;
  }
  .intro_overview_hero .stat_note {
    margin-bottom: 8px;
  }
  .intro_overview_hero .intro_hero_video {
    left: 20px;
    bottom: 24px;
    width: 158px;
    height: 89px;
  }
}
@media screen and (max-width: 767px) {
  .intro_overview_hero {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
    padding: 160px 0;
  }
  .intro_overview_hero .intro_overview_hero_tagline {
    margin: 0 20px 40px;
  }
  .intro_overview_hero .stat_note {
    right: calc((100% - 336px) / 2);
  }
}

.video_popup {
  position: fixed;
  inset: 0;
  z-index: 1100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.video_popup.is_visible {
  opacity: 1;
  visibility: visible;
}
.video_popup .video_popup_dimmed {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.6);
}
.video_popup .video_popup_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 69.17%;
  max-width: 1328px;
}
.video_popup .video_popup_close {
  position: absolute;
  top: -68px;
  right: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #FFFFFF;
  transition: opacity 0.3s ease;
}
@media (hover: hover) {
  .video_popup .video_popup_close:hover:hover {
    opacity: 0.7;
  }
}
.video_popup .video_popup_player {
  width: 100%;
  aspect-ratio: 1328/737;
  overflow: hidden;
  background-color: #000;
}
.video_popup .video_popup_player iframe {
  width: 100%;
  height: 100%;
  display: block;
}
@media screen and (max-width: 1024px) {
  .video_popup .video_popup_inner {
    width: calc(100% - 80px);
  }
  .video_popup .video_popup_close {
    top: -64px;
    right: 0;
  }
}
@media screen and (max-width: 767px) {
  .video_popup .video_popup_inner {
    width: calc(100% - 40px);
  }
  .video_popup .video_popup_close {
    top: -64px;
    right: 0;
  }
}

.intro_business {
  position: relative;
  z-index: 1;
  height: 100vh;
  height: 100svh;
  pointer-events: none;
  overflow: hidden;
}
.intro_business .intro_business_content, .intro_globe_bg .intro_business_content {
  position: relative;
  z-index: 3;
  max-width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 20.37svh max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .intro_business .intro_business_content, .intro_globe_bg .intro_business_content {
    padding: 27.34svh 40px 0;
  }
}
@media screen and (max-width: 767px) {
  .intro_business .intro_business_content, .intro_globe_bg .intro_business_content {
    padding: 27.09svh 20px 0;
  }
}
.intro_business .intro_business_title, .intro_globe_bg .intro_business_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_business .intro_business_title, .intro_globe_bg .intro_business_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_business .intro_business_title, .intro_globe_bg .intro_business_title {
    font-size: var(--fs-h2-mob);
  }
}
.intro_business .intro_business_title, .intro_globe_bg .intro_business_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
  width: fit-content;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .intro_business .intro_business_title, .intro_globe_bg .intro_business_title {
    width: auto;
    margin-left: 0;
    text-align: center;
  }
}
.intro_business .intro_business_slider, .intro_globe_bg .intro_business_slider {
  position: relative;
  z-index: 2;
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  overflow: visible;
  pointer-events: auto;
  clip-path: polygon(-100% 0%, 0% 6.8%, 10% 8.4%, 25% 9.9%, 35% 10.4%, 50% 10.7%, 65% 10.4%, 75% 9.9%, 90% 8.4%, 100% 6.8%, 200% 0%, 200% 100%, 100% 95.2%, 90% 93.6%, 75% 92.1%, 65% 91.5%, 50% 91.2%, 35% 91.5%, 25% 92.1%, 10% 93.6%, 0% 95.2%, -100% 100%);
}
@media screen and (max-width: 1024px) {
  .intro_business .intro_business_slider, .intro_globe_bg .intro_business_slider {
    margin-top: 40px;
    clip-path: polygon(-100% 0%, 0% 1.6%, 10% 2.5%, 25% 3.4%, 35% 3.8%, 50% 4%, 65% 3.8%, 75% 3.4%, 90% 2.5%, 100% 1.6%, 200% 0%, 200% 100%, 100% 98.9%, 90% 97.9%, 75% 97%, 65% 96.6%, 50% 96.4%, 35% 96.6%, 25% 97%, 10% 97.9%, 0% 98.9%, -100% 100%);
  }
}
@media screen and (max-width: 767px) {
  .intro_business .intro_business_slider, .intro_globe_bg .intro_business_slider {
    margin-top: 40px;
    clip-path: polygon(-100% 0%, 0% 1.3%, 10% 2%, 25% 2.7%, 35% 3%, 50% 3.2%, 65% 3%, 75% 2.7%, 90% 2%, 100% 1.3%, 200% 0%, 200% 100%, 100% 99%, 90% 98.3%, 75% 97.6%, 65% 97.3%, 50% 97.1%, 35% 97.3%, 25% 97.6%, 10% 98.3%, 0% 99%, -100% 100%);
  }
}
.intro_business .bx-wrapper, .intro_globe_bg .bx-wrapper {
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.intro_business .bx-viewport, .intro_globe_bg .bx-viewport {
  overflow: visible !important;
}
.intro_business .bxslider > li, .intro_globe_bg .bxslider > li {
  width: max(552px * var(--base-ratio), 552 / var(--base-size) * var(--base-percent)) !important;
  height: max(410px * var(--base-ratio), 410 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .intro_business .bxslider > li, .intro_globe_bg .bxslider > li {
    width: 334px !important;
    height: 249px;
  }
}
@media screen and (max-width: 767px) {
  .intro_business .bxslider > li, .intro_globe_bg .bxslider > li {
    width: 246px !important;
    height: 183px;
  }
}
.intro_business .business_card, .intro_globe_bg .business_card {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.intro_business .business_card .business_card_bg, .intro_globe_bg .business_card .business_card_bg {
  position: absolute;
  inset: -1px;
}
.intro_business .business_card .business_card_bg img, .intro_globe_bg .business_card .business_card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.intro_business .business_card .business_card_content, .intro_globe_bg .business_card .business_card_content {
  position: absolute;
  bottom: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  left: max(23px * var(--base-ratio), 23 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
.intro_business .business_card .business_card_name, .intro_globe_bg .business_card .business_card_name {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_business .business_card .business_card_name, .intro_globe_bg .business_card .business_card_name {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_business .business_card .business_card_name, .intro_globe_bg .business_card .business_card_name {
    font-size: var(--fs-h4-mob);
  }
}
.intro_business .business_card .business_card_name, .intro_globe_bg .business_card .business_card_name {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_business .business_card .btn_more_circle, .intro_globe_bg .business_card .btn_more_circle {
  position: absolute;
  bottom: max(57px * var(--base-ratio), 57 / var(--base-size) * var(--base-percent));
  right: max(19px * var(--base-ratio), 19 / var(--base-size) * var(--base-percent));
  z-index: 2;
  width: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  height: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
  transition: opacity 0.3s ease;
}
.intro_business .business_card .btn_more_circle svg, .intro_globe_bg .business_card .btn_more_circle svg {
  width: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
  height: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
}
.intro_business .business_card .btn_more_circle svg path, .intro_globe_bg .business_card .btn_more_circle svg path {
  stroke: #161D27;
}
@media (hover: hover) {
  .intro_business .business_card .btn_more_circle:hover, .intro_globe_bg .business_card .btn_more_circle:hover {
    opacity: 0.8;
  }
  .intro_business .business_card .btn_more_circle:hover svg, .intro_globe_bg .business_card .btn_more_circle:hover svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
@media screen and (max-width: 1024px) {
  .intro_business .business_card, .intro_globe_bg .business_card {
    width: 334px;
    height: 249px;
  }
  .intro_business .business_card .business_card_content, .intro_globe_bg .business_card .business_card_content {
    bottom: 26px;
    left: 20px;
  }
  .intro_business .business_card .btn_more_circle, .intro_globe_bg .business_card .btn_more_circle {
    bottom: 24px;
    right: 20px;
    width: 36px;
    height: 36px;
  }
  .intro_business .business_card .btn_more_circle svg, .intro_globe_bg .business_card .btn_more_circle svg {
    width: 14px;
    height: 14px;
  }
}
@media screen and (max-width: 767px) {
  .intro_business .business_card, .intro_globe_bg .business_card {
    width: 246px;
    height: 183px;
  }
  .intro_business .business_card .business_card_content, .intro_globe_bg .business_card .business_card_content {
    bottom: 18.5px;
    left: 20px;
  }
  .intro_business .business_card .btn_more_circle, .intro_globe_bg .business_card .btn_more_circle {
    bottom: 16px;
    right: 20px;
    width: 36px;
    height: 36px;
  }
  .intro_business .business_card .btn_more_circle svg, .intro_globe_bg .business_card .btn_more_circle svg {
    width: 14px;
    height: 14px;
  }
}

@media screen and (max-width: 1024px) {
  .intro_business {
    height: auto;
    min-height: 800px;
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 767px) {
  .intro_business {
    min-height: 600px;
    padding-bottom: 60px;
  }
}

.intro_global {
  position: relative;
  z-index: 1;
  height: 100vh;
  height: 100svh;
  pointer-events: none;
}
.intro_global .intro_global_bottom {
  position: absolute;
  pointer-events: auto;
  bottom: 14.81svh;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_bottom {
    padding: 0 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    bottom: 100px;
  }
}
@media screen and (max-width: 767px) {
  .intro_global .intro_global_bottom {
    padding: 0 20px;
    bottom: 60px;
  }
}
.intro_global .intro_global_text {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_text {
    gap: 18px;
  }
}
.intro_global .intro_global_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_label {
    font-size: var(--fs-p1-tab);
  }
}
.intro_global .intro_global_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_global .intro_global_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_global .intro_global_title {
    font-size: var(--fs-h2-mob);
  }
}
.intro_global .intro_global_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_global .intro_global_stats .stats_card {
  display: flex;
  align-items: center;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(427px * var(--base-ratio), 427 / var(--base-size) * var(--base-percent));
  height: max(126px * var(--base-ratio), 126 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(209, 210, 212, 0.2);
}
.intro_global .intro_global_stats .stats_item {
  display: flex;
  align-items: flex-end;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_global .intro_global_stats .stats_divider {
  width: 1px;
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  background-color: #A8A9AD;
}
.intro_global .intro_global_stats .stats_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_stats .stats_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_global .intro_global_stats .stats_label {
    font-size: var(--fs-h5-mob);
  }
}
.intro_global .intro_global_stats .stats_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #FFFFFF;
}
.intro_global .intro_global_stats .stats_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
  font-weight: 600;
  color: #FFFFFF;
  line-height: 1;
  letter-spacing: -0.03em;
}
.intro_global .intro_global_stats .stats_unit {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_stats .stats_unit {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_global .intro_global_stats .stats_unit {
    font-size: var(--fs-h5-mob);
  }
}
.intro_global .intro_global_stats .stats_unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .intro_global {
    height: auto;
    min-height: 100vh;
    padding-bottom: 200px;
  }
  .intro_global .intro_global_stats .stats_card {
    width: auto;
    height: auto;
    padding: 20px 24px;
  }
  .intro_global .intro_global_stats .stats_item {
    gap: 8px;
  }
  .intro_global .intro_global_stats .stats_num {
    font-size: 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_global {
    min-height: 100vh;
    padding-bottom: 180px;
  }
  .intro_global .intro_global_stats {
    width: 100%;
  }
  .intro_global .intro_global_stats .stats_card {
    width: 100%;
    gap: 22px;
    padding: 22px 20px;
  }
  .intro_global .intro_global_stats .stats_item {
    flex: 1;
    justify-content: center;
    gap: 10px;
  }
  .intro_global .intro_global_stats .stats_num {
    font-size: 40px;
  }
}
.intro_global .intro_global_stats.is_en .stats_card {
  align-items: flex-end;
  width: max(279px * var(--base-ratio), 279 / var(--base-size) * var(--base-percent));
  height: max(125px * var(--base-ratio), 125 / var(--base-size) * var(--base-percent));
  padding: max(21px * var(--base-ratio), 21 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(19px * var(--base-ratio), 19 / var(--base-size) * var(--base-percent));
}
.intro_global .intro_global_stats.is_en .stats_item {
  flex-direction: column;
  align-items: center;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.intro_global .intro_global_stats.is_en .stats_divider {
  height: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background-color: #D1D2D4;
  flex-shrink: 0;
}
.intro_global .intro_global_stats.is_en .stats_label {
  font-size: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
}
.intro_global .intro_global_stats.is_en .stats_num {
  font-size: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_global .intro_global_stats.is_en .stats_card {
    width: 279px;
    height: 125px;
    gap: 28px;
    padding: 21px 36px 19px;
    border-radius: 12px;
  }
  .intro_global .intro_global_stats.is_en .stats_item {
    gap: 2px;
  }
  .intro_global .intro_global_stats.is_en .stats_divider {
    height: 40px;
    margin-bottom: 8px;
  }
  .intro_global .intro_global_stats.is_en .stats_label {
    font-size: 18px;
  }
  .intro_global .intro_global_stats.is_en .stats_num {
    font-size: 56px;
  }
}
@media screen and (max-width: 767px) {
  .intro_global .intro_global_stats.is_en {
    width: auto;
  }
  .intro_global .intro_global_stats.is_en .stats_card {
    width: auto;
    height: auto;
    gap: 24px;
    padding: 12px 20px;
    border-radius: 8px;
  }
  .intro_global .intro_global_stats.is_en .stats_item {
    flex: none;
    gap: 2px;
  }
  .intro_global .intro_global_stats.is_en .stats_divider {
    height: 26px;
    margin-bottom: 6px;
  }
  .intro_global .intro_global_stats.is_en .stats_label {
    font-size: 16px;
  }
  .intro_global .intro_global_stats.is_en .stats_num {
    font-size: 38px;
  }
}

.intro_vision_scroll {
  width: 100%;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  position: relative;
}
.intro_vision_scroll .intro_vision_track {
  display: flex;
  width: max-content;
  height: 100%;
}
.intro_vision_scroll .intro_vision_panel {
  width: 100vw;
  height: 100%;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.intro_vision_scroll .intro_panel_value .intro_panel_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.intro_vision_scroll .intro_panel_value .intro_panel_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.intro_vision_scroll .intro_panel_value .intro_panel_content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  text-align: center;
  max-width: max(1760px * var(--base-ratio), 1760 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_panel_value .intro_panel_content {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_vision_scroll .intro_panel_value .intro_panel_content {
    padding: 0 20px;
  }
}
.intro_vision_scroll .intro_panel_value .intro_panel_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_panel_value .intro_panel_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_vision_scroll .intro_panel_value .intro_panel_title {
    font-size: var(--fs-h2-mob);
  }
}
.intro_vision_scroll .intro_panel_value .intro_panel_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_vision_scroll .intro_panel_value .intro_panel_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_panel_value .intro_panel_desc {
    font-size: var(--fs-p1-tab);
  }
}
.intro_vision_scroll .intro_panel_value .intro_panel_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_vision_scroll .intro_panel_vision {
  background-color: #FFFFFF;
  position: relative;
}
.intro_vision_scroll .intro_vision_inner {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  aspect-ratio: 1920/1080;
  max-height: 100%;
}
.intro_vision_scroll .intro_vision_content {
  position: absolute;
  left: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  top: 50%;
  transform: translateY(-50%);
  width: max(532px * var(--base-ratio), 532 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .intro_vision_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_vision_scroll .intro_vision_title {
    font-size: var(--fs-h2-mob);
  }
}
.intro_vision_scroll .intro_vision_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-bottom: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_title {
    margin-bottom: 20px;
  }
}
.intro_vision_scroll .intro_vision_subtitle {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_subtitle {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_vision_scroll .intro_vision_subtitle {
    font-size: var(--fs-h5-mob);
  }
}
.intro_vision_scroll .intro_vision_subtitle {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #025997;
  margin-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_subtitle {
    margin-bottom: 48px;
  }
}
.intro_vision_scroll .intro_vision_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .intro_vision_list li {
  padding-left: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  position: relative;
}
.intro_vision_scroll .intro_vision_list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: max(11px * var(--base-ratio), 11 / var(--base-size) * var(--base-percent));
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #818286;
}
.intro_vision_scroll .intro_vision_list strong {
  display: block;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_list strong {
    font-size: var(--fs-p1-tab);
  }
}
.intro_vision_scroll .intro_vision_list strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .intro_vision_list p {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll .intro_vision_list p {
    font-size: var(--fs-p1-tab);
  }
}
.intro_vision_scroll .intro_vision_list p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.intro_vision_scroll .vision_img_main {
  position: absolute;
  left: max(920px * var(--base-ratio), 920 / var(--base-size) * var(--base-percent));
  top: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
  width: max(1000px * var(--base-ratio), 1000 / var(--base-size) * var(--base-percent));
  height: max(630px * var(--base-ratio), 630 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.intro_vision_scroll .vision_img_main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.intro_vision_scroll .vision_img_sub {
  position: absolute;
  left: max(811px * var(--base-ratio), 811 / var(--base-size) * var(--base-percent));
  top: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
  height: max(290px * var(--base-ratio), 290 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.intro_vision_scroll .vision_img_sub img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.intro_vision_scroll .vision_img_full {
  position: absolute;
  left: max(840px * var(--base-ratio), 840 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.intro_vision_scroll .vision_img_full img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.intro_vision_scroll .is_material .vision_img_01,
.intro_vision_scroll .is_material .vision_img_02,
.intro_vision_scroll .is_material .vision_img_03 {
  position: absolute;
  overflow: hidden;
}
.intro_vision_scroll .is_material .vision_img_01 img,
.intro_vision_scroll .is_material .vision_img_02 img,
.intro_vision_scroll .is_material .vision_img_03 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.intro_vision_scroll .is_material .vision_img_01 {
  left: max(1426px * var(--base-ratio), 1426 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(401px * var(--base-ratio), 401 / var(--base-size) * var(--base-percent));
  height: max(490px * var(--base-ratio), 490 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .is_material .vision_img_02 {
  left: max(846px * var(--base-ratio), 846 / var(--base-size) * var(--base-percent));
  top: max(255px * var(--base-ratio), 255 / var(--base-size) * var(--base-percent));
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  height: max(356px * var(--base-ratio), 356 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .is_material .vision_img_03 {
  left: max(1168px * var(--base-ratio), 1168 / var(--base-size) * var(--base-percent));
  top: max(552px * var(--base-ratio), 552 / var(--base-size) * var(--base-percent));
  width: max(752px * var(--base-ratio), 752 / var(--base-size) * var(--base-percent));
  height: max(448px * var(--base-ratio), 448 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .is_global .vision_img_main {
  left: max(840px * var(--base-ratio), 840 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  height: max(860px * var(--base-ratio), 860 / var(--base-size) * var(--base-percent));
}
.intro_vision_scroll .is_global .vision_img_sub {
  left: max(1380px * var(--base-ratio), 1380 / var(--base-size) * var(--base-percent));
  top: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
  width: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  height: max(860px * var(--base-ratio), 860 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_vision_scroll {
    height: auto;
    overflow: visible;
  }
  .intro_vision_scroll .intro_vision_track {
    flex-direction: column;
    width: 100%;
    height: auto;
    gap: 128px;
  }
  .intro_vision_scroll .intro_vision_panel {
    width: 100%;
    height: auto;
  }
  .intro_vision_scroll .intro_panel_value {
    min-height: 100vh;
    min-height: 100svh;
  }
  .intro_vision_scroll .intro_panel_value .intro_panel_bg img {
    object-position: 30% center;
  }
  .intro_vision_scroll .intro_panel_value .intro_panel_content {
    min-height: 100vh;
    min-height: 100svh;
    padding-top: 120px;
    padding-bottom: 120px;
    gap: 26px;
  }
  .intro_vision_scroll .intro_panel_vision {
    position: static;
  }
  .intro_vision_scroll .intro_vision_inner {
    position: static;
    transform: none;
    display: flex;
    flex-direction: column;
    gap: 60px;
    padding: 0 40px;
    aspect-ratio: unset;
    max-height: none;
  }
  .intro_vision_scroll .intro_vision_content {
    position: static;
    transform: none;
    width: 100%;
  }
  .intro_vision_scroll .intro_vision_content br {
    content: "";
  }
  .intro_vision_scroll .intro_vision_content br::after {
    content: " ";
  }
  .intro_vision_scroll .intro_vision_images {
    position: relative;
    margin: 0 -40px;
  }
  .intro_vision_scroll .intro_vision_list {
    gap: 14px;
  }
  .intro_vision_scroll .vision_img_main {
    position: static;
    width: 100%;
    height: auto;
  }
  .intro_vision_scroll .vision_img_main img {
    height: auto;
    object-fit: initial;
  }
  .intro_vision_scroll .vision_img_full {
    position: static;
    width: 100%;
    height: auto;
  }
  .intro_vision_scroll .vision_img_full img {
    height: auto;
    object-fit: initial;
  }
  .intro_vision_scroll .is_material .intro_vision_images {
    aspect-ratio: 768/714;
  }
  .intro_vision_scroll .is_material .vision_img_01,
  .intro_vision_scroll .is_material .vision_img_02,
  .intro_vision_scroll .is_material .vision_img_03 {
    position: absolute;
    overflow: hidden;
  }
  .intro_vision_scroll .is_material .vision_img_01 img,
  .intro_vision_scroll .is_material .vision_img_02 img,
  .intro_vision_scroll .is_material .vision_img_03 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .intro_vision_scroll .is_material .vision_img_01 {
    top: 0;
    left: 54.04%;
    width: 37.37%;
    height: 49.02%;
  }
  .intro_vision_scroll .is_material .vision_img_02 {
    top: 25.49%;
    left: 0;
    width: 50.26%;
    height: 35.57%;
  }
  .intro_vision_scroll .is_material .vision_img_03 {
    top: 55.18%;
    left: 29.95%;
    width: 70.05%;
    height: 44.82%;
  }
  .intro_vision_scroll .vision_img_sub {
    height: auto;
  }
  .intro_vision_scroll .vision_img_sub img {
    height: auto;
    object-fit: initial;
  }
  .intro_vision_scroll .is_safety .intro_vision_images {
    margin-left: 0;
    padding-bottom: 16%;
  }
  .intro_vision_scroll .is_safety .vision_img_main {
    width: calc(100% - 88px);
    margin-left: 88px;
  }
  .intro_vision_scroll .is_safety .vision_img_sub {
    position: absolute;
    left: 0;
    top: auto;
    right: auto;
    bottom: 0;
    width: 302px;
  }
  .intro_vision_scroll .is_global .intro_vision_images {
    display: flex;
  }
  .intro_vision_scroll .is_global .vision_img_main,
  .intro_vision_scroll .is_global .vision_img_sub {
    position: static;
    width: 50%;
    height: auto;
    aspect-ratio: 384/612;
    overflow: hidden;
  }
  .intro_vision_scroll .is_global .vision_img_main img,
  .intro_vision_scroll .is_global .vision_img_sub img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@media screen and (max-width: 767px) {
  .intro_vision_scroll .intro_panel_value {
    min-height: 100vh;
    min-height: 100svh;
  }
  .intro_vision_scroll .intro_panel_vision {
    padding: 0;
  }
  .intro_vision_scroll .intro_vision_inner {
    gap: 60px;
    padding: 0 20px;
  }
  .intro_vision_scroll .intro_vision_subtitle {
    margin-bottom: 48px;
  }
  .intro_vision_scroll .intro_vision_images {
    margin: 0 -20px;
  }
  .intro_vision_scroll .is_safety .intro_vision_images {
    margin-left: 0;
    padding-bottom: 17%;
  }
  .intro_vision_scroll .is_safety .vision_img_main {
    width: calc(100% - 42px);
    margin-left: 42px;
  }
  .intro_vision_scroll .is_safety .vision_img_sub {
    width: 147px;
  }
}

.intro_history_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro_history_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.intro_history_hero .intro_history_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.intro_history_hero .intro_history_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .intro_history_hero .intro_history_hero_bg {
    width: 90%;
  }
}
.intro_history_hero .intro_history_tagline {
  position: relative;
  z-index: 2;
  opacity: 0;
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_history_hero .intro_history_tagline {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_history_hero .intro_history_tagline {
    font-size: var(--fs-h2-mob);
  }
}
.intro_history_hero .intro_history_tagline {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_history_hero .intro_history_tagline {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_history_hero .intro_history_tagline {
    padding: 0 20px;
  }
}

.intro_timeline {
  padding: 0 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
}
.intro_timeline .intro_timeline_inner {
  max-width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: flex-start;
}
.intro_timeline .intro_timeline_left {
  position: sticky;
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  left: 5%;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  width: 39.208%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_year_display {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(110px * var(--base-ratio), 110 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_timeline .timeline_year_display {
    font-size: 48px;
  }
}
.intro_timeline .timeline_year_display {
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #025997;
  font-variant-numeric: tabular-nums;
  display: flex;
  justify-content: flex-start;
}
.intro_timeline .timeline_year_display .year_digit {
  display: inline-block;
  overflow: hidden;
  position: relative;
  height: 1em;
  width: 0.64em;
  text-align: center;
}
.intro_timeline .timeline_year_display .year_digit_inner {
  display: block;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.intro_timeline .timeline_year_display .year_digit_inner span {
  display: block;
  height: 1em;
  line-height: 1;
}
.intro_timeline .timeline_left_img {
  width: 100%;
  aspect-ratio: 574/360;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  display: none;
  opacity: 0;
}
.intro_timeline .timeline_left_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.intro_timeline .timeline_line {
  position: absolute;
  left: 49.932%;
  top: 0;
  bottom: 0;
  width: 2px;
  background-color: #E7E7E9;
}
.intro_timeline .timeline_line .timeline_line_active {
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 0;
  background: #025997;
}
@keyframes timeline_circle_spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.intro_timeline .timeline_circle {
  position: absolute;
  left: calc(49.932% - max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)));
  top: 0;
  width: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  height: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  z-index: 1;
}
.intro_timeline .timeline_circle::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Ccircle cx='21' cy='21' r='20' fill='none' stroke='%23024781' stroke-width='2'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  -webkit-mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  animation: timeline_circle_spin 2s linear infinite;
}
.intro_timeline .timeline_circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #025997;
}
.intro_timeline .intro_timeline_content {
  margin-left: auto;
  width: 44.467%;
  flex-shrink: 0;
  padding-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  margin-right: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_year + .timeline_year {
  margin-top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_items {
  display: flex;
  flex-direction: column;
  gap: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_item {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_month {
  flex-shrink: 0;
  width: max(38px * var(--base-ratio), 38 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_timeline .timeline_month {
    font-size: var(--fs-p1-tab);
  }
}
.intro_timeline .timeline_month {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}
.intro_timeline .timeline_text {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_timeline .timeline_text {
    font-size: var(--fs-p1-tab);
  }
}
.intro_timeline .timeline_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.intro_timeline .timeline_text > .timeline_icon {
  display: inline-flex;
  vertical-align: middle;
  margin-left: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_text[data-image]:not([data-image=""]) {
  cursor: pointer;
}
.intro_timeline .timeline_text[data-image]:not([data-image=""]):hover {
  text-decoration: underline;
}
.intro_timeline .timeline_texts {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_icon {
  width: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.intro_timeline .timeline_icon.is_prize {
  background-color: #F4ECE3;
}
.intro_timeline .timeline_icon.is_cp {
  background-color: #E3EEF9;
}
.intro_timeline .timeline_icon img {
  width: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  height: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
.intro_timeline .timeline_row_img {
  display: none;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.intro_timeline .timeline_row_img img {
  width: 100%;
  height: auto;
  display: block;
}
.intro_timeline .timeline_end_dot {
  position: absolute;
  left: calc(49.932% - max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)));
  bottom: 0;
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .intro_timeline {
    padding-bottom: 160px;
  }
  .intro_timeline .intro_timeline_inner {
    max-width: 768px;
    padding: 0 40px;
  }
  .intro_timeline .intro_timeline_left {
    width: auto;
    margin-top: 80px;
    top: 120px;
    left: 5%;
    gap: 0;
  }
  .intro_timeline .timeline_year_display {
    justify-content: flex-start;
  }
  .intro_timeline .timeline_left_img {
    display: none !important;
  }
  .intro_timeline .timeline_line {
    left: 206px;
  }
  .intro_timeline .timeline_circle {
    left: 195px;
    width: 24px;
    height: 24px;
  }
  .intro_timeline .timeline_circle::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='none' stroke='%23024781' stroke-width='1'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  }
  .intro_timeline .timeline_circle::after {
    width: 8px;
    height: 8px;
  }
  .intro_timeline .intro_timeline_content {
    width: 466px;
    padding-top: 120px;
    margin-right: 0;
    flex-shrink: 1;
  }
  .intro_timeline .timeline_year + .timeline_year {
    margin-top: 96px;
  }
  .intro_timeline .timeline_text,
  .intro_timeline .timeline_texts {
    flex: 1;
    min-width: 0;
  }
  .intro_timeline .timeline_items {
    gap: 32px;
  }
  .intro_timeline .timeline_icon {
    width: 20px;
    height: 20px;
  }
  .intro_timeline .timeline_icon img {
    width: 20px;
    height: 20px;
  }
  .intro_timeline .timeline_row_img {
    display: block;
  }
  .intro_timeline .timeline_end_dot {
    left: 203px;
    width: 8px;
    height: 8px;
  }
}
@media screen and (max-width: 767px) {
  .intro_timeline {
    padding-bottom: 160px;
  }
  .intro_timeline .intro_timeline_inner {
    padding: 0 20px;
  }
  .intro_timeline .intro_timeline_left {
    display: none;
  }
  .intro_timeline .timeline_year::before {
    content: attr(data-year);
    display: block;
    font-family: "Bai Jamjuree", sans-serif;
    font-size: 44px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #025997;
    margin-bottom: 32px;
  }
  .intro_timeline .timeline_line {
    left: 19px;
  }
  .intro_timeline .timeline_circle {
    left: 10px;
    width: 20px;
    height: 20px;
  }
  .intro_timeline .timeline_circle::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='none' stroke='%23024781' stroke-width='1'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  }
  .intro_timeline .timeline_circle::after {
    width: 7px;
    height: 7px;
  }
  .intro_timeline .intro_timeline_content {
    min-width: 0;
    width: auto;
    margin-left: 24px;
  }
  .intro_timeline .timeline_month {
    width: 39px;
  }
  .intro_timeline .timeline_text,
  .intro_timeline .timeline_texts {
    flex: 1;
    min-width: 0;
  }
  .intro_timeline .timeline_icon {
    width: 20px;
    height: 20px;
  }
  .intro_timeline .timeline_icon img {
    width: 20px;
    height: 20px;
  }
  .intro_timeline .timeline_row_img {
    display: block;
  }
  .intro_timeline .timeline_end_dot {
    left: 16.5px;
    width: 7px;
    height: 7px;
  }
}

.intro_ci_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro_ci_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.intro_ci_hero .intro_ci_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.intro_ci_hero .intro_ci_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .intro_ci_hero .intro_ci_hero_bg {
    width: 90%;
  }
}
.intro_ci_hero .intro_ci_hero_title {
  position: relative;
  z-index: 2;
  opacity: 0;
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_ci_hero .intro_ci_hero_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_ci_hero .intro_ci_hero_title {
    font-size: var(--fs-h1-mob);
  }
}
.intro_ci_hero .intro_ci_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: center;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_ci_hero .intro_ci_hero_title {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_ci_hero .intro_ci_hero_title {
    padding: 0 20px;
  }
}

.intro_ci {
  background-color: #FFFFFF;
}

.ci_wordmark {
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) 0 max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.ci_wordmark .ci_wordmark_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  margin-bottom: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.ci_wordmark .ci_wordmark_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_wordmark .ci_wordmark_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_wordmark .ci_wordmark_title {
    font-size: var(--fs-h1-mob);
  }
}
.ci_wordmark .ci_wordmark_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: center;
}
.ci_wordmark .ci_wordmark_desc {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_wordmark .ci_wordmark_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_wordmark .ci_wordmark_desc {
    font-size: var(--fs-h5-mob);
  }
}
.ci_wordmark .ci_wordmark_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.5;
  text-align: center;
}
.ci_wordmark .ci_wordmark_visual {
  position: relative;
  max-width: max(1624px * var(--base-ratio), 1624 / var(--base-size) * var(--base-percent));
  height: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_bg {
  display: block;
  height: 100%;
  overflow: hidden;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  position: relative;
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_bg img {
  position: absolute;
  top: -60px;
  left: 0;
  width: 100%;
  height: calc(100% + 120px);
  display: block;
  object-fit: cover;
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_content {
  position: absolute;
  top: 0;
  bottom: 0;
  left: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  right: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_content {
    font-size: var(--fs-p1-tab);
  }
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_content {
  letter-spacing: -0.02em;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_logo {
  display: block;
  margin-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_logo img {
  width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  height: auto;
  display: block;
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
    font-size: var(--fs-h5-mob);
  }
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.5;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #F3F3F3;
  letter-spacing: -0.02em;
  line-height: 1.5;
}
@media screen and (max-width: 1024px) {
  .ci_wordmark {
    padding: 144px 0 36px;
  }
  .ci_wordmark .ci_wordmark_visual {
    height: 500px;
  }
  .ci_wordmark .ci_wordmark_head {
    gap: 26px;
    margin-bottom: 64px;
    padding: 0 40px;
  }
  .ci_wordmark .ci_wordmark_visual {
    padding: 0 40px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_content {
    left: 40px;
    right: 40px;
    padding: 0 80px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_bg img {
    top: -60px;
    height: calc(100% + 200px);
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_logo img {
    width: 291px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
    margin-bottom: 12px;
  }
}
@media screen and (max-width: 767px) {
  .ci_wordmark {
    padding: 144px 0 0;
  }
  .ci_wordmark .ci_wordmark_head {
    gap: 26px;
    margin-bottom: 64px;
    padding: 0 20px;
  }
  .ci_wordmark .ci_wordmark_visual {
    padding: 0 20px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_content {
    left: 20px;
    right: 20px;
    padding: 0 16px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_bg img {
    top: -60px;
    height: calc(100% + 200px);
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_logo {
    margin-bottom: 16px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_logo img {
    width: 233px;
  }
  .ci_wordmark .ci_wordmark_visual .ci_wordmark_visual_title {
    margin-bottom: 12px;
  }
}

.ci_section {
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) 0;
}
.ci_section .ci_section_inner {
  max-width: max(1624px * var(--base-ratio), 1624 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_section_head {
  flex: 0 1 clamp(200px, 25vw, 425px);
}
.ci_section .ci_section_title {
  font-size: round(down, max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_section .ci_section_title {
    font-size: 28px;
  }
}
@media screen and (max-width: 767px) {
  .ci_section .ci_section_title {
    font-size: 24px;
  }
}
.ci_section .ci_section_title {
  font-weight: 700;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.ci_section .ci_section_body {
  flex: 1;
  min-width: 0;
}
.ci_section .ci_section_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_section .ci_section_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ci_section .ci_section_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  letter-spacing: -0.02em;
  line-height: 1.5;
  margin-bottom: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_img_area {
  position: relative;
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  margin-bottom: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ci_section .ci_img_area picture {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.ci_section .ci_img_area img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.ci_section .ci_img_area .ci_img_on {
  display: none;
}
.ci_section .ci_img_area.is_guide_on {
  background-image: repeating-linear-gradient(90deg, #F3F3F3 0, #F3F3F3 1px, transparent 1px, transparent 10px), repeating-linear-gradient(0deg, #F3F3F3 0, #F3F3F3 1px, transparent 1px, transparent 10px);
}
.ci_section .ci_img_area.is_guide_on .ci_img_off {
  display: none;
}
.ci_section .ci_img_area.is_guide_on .ci_img_on {
  display: flex;
}
.ci_section .ci_img_area.is_guide_on .ci_guide_toggle {
  background-color: #00A3F1;
  flex-direction: row-reverse;
  padding: 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) 0 max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_img_area.is_guide_on .ci_guide_toggle .ci_check {
  opacity: 1;
}
.ci_section .ci_guide_toggle {
  position: absolute;
  top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  right: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  border: none;
  background-color: #949599;
  color: #FFFFFF;
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_section .ci_guide_toggle {
    font-size: 12px;
  }
}
.ci_section .ci_guide_toggle {
  letter-spacing: -0.02em;
  font-weight: 400;
  letter-spacing: -0.02em;
  cursor: pointer;
  transition: background-color 0.25s ease;
}
.ci_section .ci_guide_toggle .ci_check {
  opacity: 0;
  transition: opacity 0.2s ease;
}
.ci_section .ci_guide_toggle svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_download_btns {
  display: flex;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_sub_group + .ci_sub_group {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.ci_section .ci_sub_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_section .ci_sub_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_section .ci_sub_label {
    font-size: var(--fs-h5-mob);
  }
}
.ci_section .ci_sub_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.5;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ci_section {
    padding: 60px 0;
  }
  .ci_section .ci_section_inner {
    flex-direction: column;
    padding: 0 40px;
  }
  .ci_section .ci_section_head {
    flex: none;
    margin-bottom: 0;
  }
  .ci_section .ci_section_desc {
    margin-bottom: 32px;
  }
  .ci_section .ci_sub_group + .ci_sub_group {
    margin-top: 64px;
  }
  .ci_section .ci_img_area {
    height: 240px;
    margin-bottom: 22px;
  }
  .ci_section .ci_guide_toggle {
    top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .ci_section {
    padding: 96px 0 0;
  }
  .ci_section .ci_section_inner {
    padding: 0 20px;
  }
  .ci_section .ci_section_head {
    margin-bottom: 0;
  }
  .ci_section .ci_section_desc {
    margin-bottom: 32px;
  }
  .ci_section .ci_download_btns {
    flex-wrap: wrap;
  }
  .ci_section .ci_sub_group + .ci_sub_group {
    margin-top: 64px;
  }
  .ci_section .ci_img_area {
    height: 240px;
    margin-bottom: 22px;
    padding: 13px;
  }
  .ci_section .ci_guide_toggle {
    top: 16px;
  }
}

.ci_color {
  background-color: #F3F3F3;
}
.ci_color .ci_color_inner {
  max-width: max(1624px * var(--base-ratio), 1624 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_section_head {
  flex: 0 1 clamp(200px, 25vw, 425px);
}
.ci_color .ci_section_title {
  font-size: round(down, max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_section_title {
    font-size: 28px;
  }
}
@media screen and (max-width: 767px) {
  .ci_color .ci_section_title {
    font-size: 24px;
  }
}
.ci_color .ci_section_title {
  font-weight: 700;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.ci_color .ci_section_body {
  flex: 1;
  min-width: 0;
}
.ci_color .ci_section_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_section_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ci_color .ci_section_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #6D6E72;
  letter-spacing: -0.02em;
  line-height: 1.5;
}
.ci_color .ci_color_group {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_color_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_color_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_color .ci_color_label {
    font-size: var(--fs-h5-mob);
  }
}
.ci_color .ci_color_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #161D27;
  letter-spacing: -0.02em;
  line-height: 1.5;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_color_main {
  min-height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  background-color: #05507D;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.ci_color .ci_color_sub {
  display: flex;
  min-height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.ci_color .ci_color_panel {
  flex: 1;
}
.ci_color .ci_color_panel.is_light_blue {
  background-color: #00A5E5;
}
.ci_color .ci_color_panel.is_dark_gray {
  background-color: #4B5151;
}
.ci_color .ci_color_panel.is_light_gray {
  background-color: #BDBDBA;
}
.ci_color .ci_color_main .ci_color_info {
  padding: max(89px * var(--base-ratio), 89 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_color_panel .ci_color_info {
  padding: max(62px * var(--base-ratio), 62 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_color_name {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_color_name {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ci_color .ci_color_name {
    font-size: var(--fs-h5-mob);
  }
}
.ci_color .ci_color_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.3;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.ci_color .ci_color_specs {
  display: flex;
  flex-direction: column;
}
.ci_color .ci_spec_row {
  display: flex;
  align-items: baseline;
  column-gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  row-gap: 0;
  flex-wrap: wrap;
}
.ci_color .ci_spec_key {
  flex-shrink: 0;
  width: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_spec_key {
    font-size: 14px;
  }
}
.ci_color .ci_spec_key {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.5;
}
.ci_color .ci_spec_vals {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  flex-wrap: wrap;
}
.ci_color .ci_spec_val {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_spec_val {
    font-size: 14px;
  }
}
.ci_color .ci_spec_val {
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.5;
  opacity: 0.8;
  white-space: nowrap;
}
.ci_color .ci_spec_divider {
  width: 0;
  height: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border-left: 1px solid #FFFFFF;
  opacity: 0.8;
}
@media screen and (max-width: 1024px) {
  .ci_color .ci_color_inner {
    flex-direction: column;
    padding: 128px 40px 160px;
  }
  .ci_color .ci_section_head {
    flex: none;
    margin-bottom: 0;
  }
  .ci_color .ci_color_group {
    margin-top: 64px;
  }
  .ci_color .ci_color_main,
  .ci_color .ci_color_sub {
    min-height: 200px;
  }
  .ci_color .ci_color_sub {
    flex-direction: column;
  }
  .ci_color .ci_color_main .ci_color_info,
  .ci_color .ci_color_panel .ci_color_info {
    padding: 75px 20px 20px;
  }
}
@media screen and (max-width: 767px) {
  .ci_color {
    margin-top: 128px;
  }
  .ci_color .ci_color_inner {
    padding: 128px 20px 160px;
  }
  .ci_color .ci_section_head {
    margin-bottom: 0;
  }
  .ci_color .ci_color_group {
    margin-top: 64px;
  }
  .ci_color .ci_color_sub {
    flex-direction: column;
  }
  .ci_color .ci_color_main .ci_color_info,
  .ci_color .ci_color_panel .ci_color_info {
    padding: 75px 20px 20px;
  }
}

.intro_network_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro_network_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.intro_network_hero .intro_network_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.intro_network_hero .intro_network_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .intro_network_hero .intro_network_hero_bg {
    width: 90%;
  }
}
.intro_network_hero .intro_network_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  text-align: center;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.intro_network_hero .intro_network_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_network_hero .intro_network_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_network_hero .intro_network_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.intro_network_hero .intro_network_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.intro_network_hero .intro_network_hero_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_network_hero .intro_network_hero_desc {
    font-size: var(--fs-p1-tab);
  }
}
.intro_network_hero .intro_network_hero_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .intro_network_hero .intro_network_hero_content {
    gap: 24px;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_network_hero .intro_network_hero_content {
    gap: 20px;
    padding: 0 20px;
  }
}

.intro_map_wrap {
  overflow: clip;
}

.intro_map {
  position: relative;
  z-index: 1;
  padding: 0;
  background-color: #FFFFFF;
}
.intro_map .intro_map_inner {
  max-width: 1920px;
  margin: 0 auto;
}
.intro_map .intro_map_visual {
  position: relative;
  overflow: hidden;
  background-color: #F3F3F3;
}
.intro_map .intro_map_visual .map_image {
  width: 100%;
  height: auto;
  max-height: 100vh;
  max-height: 100svh;
  display: block;
}
.intro_map .map_pin {
  position: absolute;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  transform: translate(-50%, -50%);
  cursor: pointer;
  z-index: 1;
}
.intro_map .map_pin::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  opacity: 0.3;
  animation: dotpulse 1.5s ease-out infinite;
}
.intro_map .map_pin::after {
  content: "";
  position: absolute;
  top: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  left: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  border: 2px solid #FFFFFF;
}
.intro_map .map_pin.is_pflow::before {
  background-color: #025997;
}
.intro_map .map_pin.is_pflow::after {
  background-color: #025997;
}
.intro_map .map_pin.is_group::before {
  background-color: #00A3F1;
}
.intro_map .map_pin.is_group::after {
  background-color: #00A3F1;
}
.intro_map .map_pin:hover, .intro_map .map_pin.is_active {
  z-index: 10;
}
.intro_map .map_pin:hover .map_popup, .intro_map .map_pin.is_active .map_popup {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}
.intro_map .map_popup {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  width: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
  pointer-events: none;
}
.intro_map .map_popup::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}
.intro_map .map_popup_title {
  position: relative;
  display: block;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_map .map_popup_title {
    font-size: 16px;
  }
}
.intro_map .map_popup_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-bottom: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_map .map_popup_links {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.intro_map .map_popup_link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_map .map_popup_link {
    font-size: 14px;
  }
}
.intro_map .map_popup_link {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.intro_map .map_popup_link svg {
  flex-shrink: 0;
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.intro_map .map_legend {
  position: absolute;
  bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  right: 11.875%;
  display: flex;
  flex-direction: column;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_map .legend_item {
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.intro_map .legend_dot {
  width: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
}
.intro_map .legend_dot.is_pflow {
  background-color: #025997;
}
.intro_map .legend_dot.is_group {
  background-color: #00A3F1;
}
.intro_map .legend_label {
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_map .legend_label {
    font-size: 12px;
  }
}
.intro_map .legend_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .intro_map {
    display: none;
  }
}

.intro_location {
  position: relative;
  z-index: 2;
  padding: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) 0 max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
}
.intro_location .intro_location_inner {
  max-width: max(1760px * var(--base-ratio), 1760 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .intro_location .intro_location_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .intro_location .intro_location_inner {
    padding: 0 20px;
  }
}
.intro_location .intro_location_inner {
  max-width: max(1624px * var(--base-ratio), 1624 / var(--base-size) * var(--base-percent));
}
.intro_location .location_section {
  display: flex;
  margin-bottom: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.intro_location .location_section:last-child {
  margin-bottom: 0;
}
.intro_location .location_section_title {
  flex-shrink: 0;
  width: max(277px * var(--base-ratio), 277 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_location .location_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.intro_location .location_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (min-width: 1025px) {
  .intro_location .location_section_title {
    align-self: flex-start;
  }
}
.intro_location .location_section_content {
  flex: 0 1 max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  max-width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  margin-left: auto;
  display: flex;
  flex-direction: column;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.intro_location .location_region:last-child {
  margin-bottom: 0;
}
.intro_location .location_region_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_region_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_location .location_region_title {
    font-size: var(--fs-h5-mob);
  }
}
.intro_location .location_region_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.intro_location .location_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.intro_location .location_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  min-height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.intro_location .location_card_txt {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.intro_location .location_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_tag {
    font-size: 14px;
  }
}
.intro_location .location_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #025997;
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  line-height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border: 1px solid #025997;
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.intro_location .location_tag.is_filled {
  background: #025997;
  color: #FFFFFF;
}
.intro_location .location_tag.p {
  color: #00A3F1;
  border: 1px solid #00A3F1;
}
.intro_location .location_info {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.intro_location .location_name {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_name {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .intro_location .location_name {
    font-size: var(--fs-h5-mob);
  }
}
.intro_location .location_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.intro_location .location_address {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_address {
    font-size: 16px;
  }
}
.intro_location .location_address {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.intro_location .location_mail {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.intro_location .location_mail_item {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.intro_location .location_mail_icon {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.intro_location .location_mail_icon img {
  width: 100%;
  height: 100%;
  display: block;
}
.intro_location .location_email {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .intro_location .location_email {
    font-size: 14px;
  }
}
.intro_location .location_email {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-decoration: none;
  transition: color 0.3s ease;
}
@media (hover: hover) {
  .intro_location .location_email:hover:hover {
    color: #025997;
  }
}
@media screen and (max-width: 1024px) {
  .intro_location {
    padding: 0 0 160px;
    margin-top: 80px;
  }
  .intro_location .location_section {
    flex-direction: column;
    gap: 16px;
    margin-bottom: 96px;
  }
  .intro_location .location_section_title {
    width: 100%;
  }
  .intro_location .location_section_content {
    flex: 1;
    max-width: none;
    margin-left: 0;
    gap: 64px;
  }
  .intro_location .location_region_title {
    margin-bottom: 12px;
  }
  .intro_location .location_grid {
    gap: 16px;
  }
  .intro_location .location_card {
    height: auto;
    min-height: 240px;
    padding: 24px 24px 20px;
    border-radius: 8px;
  }
  .intro_location .location_card_txt {
    gap: 16px;
  }
  .intro_location .location_tag {
    height: 28px;
    line-height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
}
@media screen and (max-width: 767px) {
  .intro_location .location_grid {
    grid-template-columns: 1fr;
  }
}

.intro_domestic {
  position: relative;
  background-color: #E8F3FE;
}
.intro_domestic .intro_domestic_inner {
  display: flex;
  align-items: flex-start;
  margin: 0 auto;
  min-height: max(1433px * var(--base-ratio), 1433 / var(--base-size) * var(--base-percent));
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) max(269px * var(--base-ratio), 269 / var(--base-size) * var(--base-percent)) 0;
}

.domestic_map {
  position: sticky;
  top: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  width: max(580px * var(--base-ratio), 580 / var(--base-size) * var(--base-percent));
  margin-left: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
.domestic_map .domestic_map_img {
  width: 100%;
  height: auto;
  display: block;
}

.domestic_map_pin {
  position: absolute;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  transform: translate(-50%, -50%);
  cursor: pointer;
}
.domestic_map_pin[data-region="0"] {
  left: 30.43%;
  top: 22.11%;
}
.domestic_map_pin[data-region="1"] {
  left: 45.09%;
  top: 74.14%;
}
.domestic_map_pin[data-region="2"] {
  left: 86.29%;
  top: 54.35%;
}
.domestic_map_pin::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background-color: rgba(2, 89, 151, 0.3);
  animation: dotpulse 1.5s ease-out infinite;
}
.domestic_map_pin .domestic_map_pin_dot {
  position: absolute;
  top: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  left: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  box-sizing: border-box;
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #025997;
  border: 2px solid #FFFFFF;
}

.domestic_list {
  position: relative;
  margin-left: auto;
  width: max(574px * var(--base-ratio), 574 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
}

.domestic_region {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.domestic_region_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_region_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .domestic_region_title {
    font-size: var(--fs-h4-mob);
  }
}
.domestic_region_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.domestic_region_card {
  background-color: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.domestic_region_name {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_region_name {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .domestic_region_name {
    font-size: var(--fs-h5-mob);
  }
}
.domestic_region_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.domestic_panel_add {
  background-color: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}

.domestic_panel_add_row {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_panel_add_row {
    font-size: 14px;
  }
}
.domestic_panel_add_row {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.domestic_panel_add_row .domestic_panel_add_ico {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}

.domestic_panel_detail {
  padding: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.domestic_detail_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_detail_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .domestic_detail_title {
    font-size: var(--fs-h5-mob);
  }
}
.domestic_detail_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.domestic_facility_list {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.domestic_facility {
  padding-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border-top: 1px solid #D1D2D4;
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}

.domestic_facility_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_facility_tag {
    font-size: 14px;
  }
}
.domestic_facility_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #00A3F1;
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  line-height: 1.3;
  border: 1px solid #00A3F1;
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.domestic_facility_tag.is_secondary {
  color: #025997;
  border-color: #025997;
}
.domestic_facility_tag.is_filled {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
}
html[lang=en] .domestic_facility_tag {
  width: 100%;
}

.domestic_facility_info {
  display: flex;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}

.domestic_facility_conts {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.domestic_facility_name {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_facility_name {
    font-size: var(--fs-p1-tab);
  }
}
.domestic_facility_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.domestic_facility_specs {
  display: flex;
  flex-direction: column;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}

.domestic_facility_spec {
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.domestic_spec_label {
  min-width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_spec_label {
    font-size: 14px;
  }
}
.domestic_spec_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  white-space: nowrap;
}
html[lang=en] .domestic_spec_label {
  flex: 1;
  min-width: 0;
  white-space: normal;
  display: block;
}
html[lang=en] .domestic_spec_label .domestic_spec_info {
  vertical-align: middle;
  margin-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}

.domestic_spec_value {
  flex: 1;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_spec_value {
    font-size: 14px;
  }
}
.domestic_spec_value {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: right;
}
html[lang=en] .domestic_spec_value {
  flex: 0 0 max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}

.domestic_spec_info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  flex-shrink: 0;
}
.domestic_spec_info img {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.domestic_spec_info .domestic_spec_tooltip {
  display: none;
  position: absolute;
  left: calc(100% + max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)));
  top: 50%;
  transform: translateY(-50%);
  padding: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .domestic_spec_info .domestic_spec_tooltip {
    font-size: 14px;
  }
}
.domestic_spec_info .domestic_spec_tooltip {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  white-space: pre;
  pointer-events: none;
  z-index: 10;
}
.domestic_spec_info .domestic_spec_tooltip::before {
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-right-color: rgba(0, 0, 0, 0.8);
}
.domestic_spec_info.is_active, .domestic_spec_info:hover {
  z-index: 10;
}
.domestic_spec_info.is_active .domestic_spec_tooltip, .domestic_spec_info:hover .domestic_spec_tooltip {
  display: block;
}

.domestic_facility_thum {
  flex-shrink: 0;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: max(112px * var(--base-ratio), 112 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.domestic_facility_thum.is_empty {
  visibility: hidden;
}
.domestic_facility_thum.has_slides {
  height: auto;
  overflow: visible;
}
.domestic_facility_thum.has_slides .domestic_thum_swiper {
  width: 100%;
  height: max(112px * var(--base-ratio), 112 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.domestic_facility_thum img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.domestic_thum_pagination {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding-top: 8px;
}
.domestic_thum_pagination.swiper-pagination-horizontal .swiper-pagination-bullet,
.domestic_thum_pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #F3F3F3;
  border: 1px solid #D1D2D4;
  opacity: 1;
  margin: 0;
}
.domestic_thum_pagination.swiper-pagination-horizontal .swiper-pagination-bullet-active,
.domestic_thum_pagination .swiper-pagination-bullet-active {
  background: #025997;
  border-color: transparent;
}

.domestic_anchor,
.domestic_anchor_fixed {
  display: none;
}

@media screen and (max-width: 1024px) {
  .domestic_anchor {
    display: flex;
    width: 100%;
    height: 72px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .domestic_anchor {
    height: 60px;
  }
}
@media screen and (max-width: 1024px) {
  .domestic_anchor_fixed {
    display: none;
    width: 100%;
    height: 72px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .domestic_anchor_fixed {
    height: 60px;
  }
}
@media screen and (max-width: 1024px) {
  .domestic_anchor_fixed.is_visible {
    display: flex;
  }
  .domestic_anchor_tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #FFFFFF;
    border-top: 1px solid #D1D2D4;
    border-bottom: 1px solid #D1D2D4;
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #161D27;
    cursor: pointer;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .domestic_anchor_tab {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .domestic_anchor_tab + .domestic_anchor_tab {
    border-left: 1px solid #D1D2D4;
  }
  .domestic_anchor_tab.is_active {
    background-color: #025997;
    color: #FFFFFF;
    font-weight: 700;
    border-color: #025997;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .domestic_anchor_tab + .domestic_anchor_tab {
    border-left: 1px solid rgba(209, 210, 212, 0.6);
  }
  .domestic_anchor_tab {
    border-top-color: rgba(209, 210, 212, 0.6);
    border-bottom-color: rgba(209, 210, 212, 0.6);
  }
}
@media screen and (max-width: 1024px) {
  .intro_domestic .intro_domestic_inner {
    min-height: auto;
    padding: 128px 0 160px;
  }
  .domestic_map {
    display: none;
  }
  .domestic_list {
    width: 100%;
    padding: 0 40px;
    gap: 80px;
  }
  .domestic_region {
    gap: 16px;
  }
  .domestic_region_card {
    border-radius: 12px;
    padding: 22px 28px;
    gap: 20px;
  }
  .domestic_panel_add {
    border-radius: 8px;
    padding: 16px;
    gap: 4px;
  }
  .domestic_panel_add_row {
    gap: 6px;
  }
  .domestic_panel_add_row .domestic_panel_add_ico {
    width: 20px;
    height: 20px;
  }
  .domestic_panel_detail {
    padding: 6px 0;
    gap: 16px;
  }
  .domestic_facility_list {
    gap: 20px;
  }
  .domestic_facility {
    padding-top: 20px;
    gap: 6px;
  }
  .domestic_facility_tag {
    height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
  html[lang=en] .domestic_facility_tag {
    height: auto;
    padding: 4px 8px;
    text-align: center;
  }
  .domestic_facility_info {
    gap: 32px;
  }
  .domestic_facility_conts {
    gap: 20px;
  }
  .domestic_facility_specs {
    gap: 6px;
  }
  .domestic_facility_spec {
    gap: 12px;
  }
  .domestic_spec_label {
    min-width: 80px;
    gap: 4px;
  }
  html[lang=en] .domestic_spec_value {
    flex: 0 0 100px;
    width: 100px;
  }
  .domestic_spec_info {
    width: 20px;
    height: 20px;
  }
  .domestic_spec_info img {
    width: 20px;
    height: 20px;
  }
  .domestic_spec_info .domestic_spec_tooltip {
    left: calc(100% + 6px);
    padding: 8px;
    border-radius: 8px;
  }
  .domestic_spec_label:hover .domestic_spec_tooltip {
    display: block;
  }
  .domestic_facility_thum {
    width: 200px;
    height: 124px;
  }
  .domestic_facility_thum.has_slides {
    height: auto;
  }
  .domestic_facility_thum.has_slides .domestic_thum_swiper {
    height: 124px;
  }
  .domestic_facility_thum.is_empty {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .intro_domestic .intro_domestic_inner {
    padding: 128px 0 160px;
  }
  .domestic_list {
    padding: 0 20px;
  }
  .domestic_region {
    gap: 12px;
  }
  .domestic_region_card {
    padding: 20px;
    gap: 20px;
  }
  .domestic_facility_info {
    flex-direction: column;
    gap: 20px;
  }
  .domestic_facility_thum {
    width: 100%;
    height: auto;
    aspect-ratio: 295/184;
  }
  .domestic_facility_thum.has_slides {
    aspect-ratio: auto;
  }
  .domestic_facility_thum.has_slides .domestic_thum_swiper {
    width: 100%;
    height: auto;
    aspect-ratio: 295/184;
  }
}
.page_vision .header_spacer {
  display: none !important;
}
.page_vision #header.is_white:not(.is_fixed) {
  position: absolute;
  visibility: hidden;
}
.page_vision #visionHeader {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

.page_vision.vision_hero_active #header {
  transform: translateY(-100%) !important;
  pointer-events: none;
}

.vision_hero_wrap {
  height: 300vh;
}

.vision_hero {
  z-index: 1;
}
.vision_hero .vision_hero_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vision_hero .vision_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
.vision_hero .vision_hero_title {
  position: absolute;
  top: max(280px, 50vh - 160px);
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.vision_hero .vision_hero_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_hero .vision_hero_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_hero .vision_hero_label {
    font-size: var(--fs-h5-mob);
  }
}
.vision_hero .vision_hero_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.vision_hero .vision_hero_name {
  font-size: round(down, max(var(--fs-d2-pc) * 1px * var(--base-ratio), var(--fs-d2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_hero .vision_hero_name {
    font-size: var(--fs-d2-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_hero .vision_hero_name {
    font-size: var(--fs-d2-mob);
  }
}
.vision_hero .vision_hero_name {
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.vision_hero .vision_value_content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  transform: translateY(75%);
}
.vision_hero .vision_value_curve {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  aspect-ratio: 1920/400;
  opacity: 0.3;
}
.vision_hero .vision_value_curve svg {
  width: 100%;
  height: 100%;
  display: block;
}
.vision_hero .vision_value_curve img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_hero .vision_value_texts {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.vision_hero .vision_value_text {
  font-family: "Bai Jamjuree", sans-serif;
  font-weight: 500;
  font-size: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #FFFFFF;
  text-align: center;
}
.vision_hero .vision_value_text:first-child {
  transform: translateX(-100vw);
}
.vision_hero .vision_value_text:last-child {
  transform: translateX(100vw);
}
@media screen and (max-width: 1024px) {
  .vision_hero .vision_hero_title {
    top: calc(50svh - 92px);
    gap: 12px;
  }
  .vision_hero .vision_value_curve {
    width: 1536px;
    left: 50%;
    transform: translate(-50%, -50%);
    aspect-ratio: 1536/240;
  }
  .vision_hero .vision_value_texts {
    gap: 28px;
  }
  .vision_hero .vision_value_text {
    font-size: 58px;
  }
}
@media screen and (max-width: 767px) {
  .vision_hero .vision_hero_title {
    top: calc(50svh - 86px);
    gap: 12px;
    padding: 0 20px;
  }
  .vision_hero .vision_value_texts {
    flex-direction: column;
    align-items: center;
    gap: 19px;
  }
  .vision_hero .vision_value_text {
    font-size: 58px;
  }
}

.vision_ceo {
  position: sticky;
  top: 0;
  z-index: 0;
  min-height: 100vh;
  margin-bottom: 50vh;
  background: #FFFFFF;
  box-shadow: 0 1px 0 #FFFFFF;
  display: flex;
  align-items: center;
  transform: translateZ(0);
}
.vision_ceo .vision_ceo_inner {
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent)) 0 max(176px * var(--base-ratio), 176 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_content {
  display: flex;
}
.vision_ceo .vision_ceo_label_mo {
  display: none;
}
.vision_ceo .vision_ceo_photo {
  width: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.vision_ceo .vision_ceo_img {
  width: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  height: max(780px * var(--base-ratio), 780 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.vision_ceo .vision_ceo_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_ceo .vision_ceo_sign {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  margin-top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_position {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_position {
    font-size: 16px;
  }
}
.vision_ceo .vision_ceo_position {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  padding-top: max(11px * var(--base-ratio), 11 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_signature {
  width: max(121px * var(--base-ratio), 121 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_txt {
  margin-left: max(183px * var(--base-ratio), 183 / var(--base-size) * var(--base-percent));
  padding-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  width: max(621px * var(--base-ratio), 621 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_label {
    font-size: var(--fs-p1-tab);
  }
}
.vision_ceo .vision_ceo_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}
.vision_ceo .vision_ceo_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_ceo .vision_ceo_title {
    font-size: var(--fs-h2-mob);
  }
}
.vision_ceo .vision_ceo_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-top: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_subtitle {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_subtitle {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_ceo .vision_ceo_subtitle {
    font-size: var(--fs-h5-mob);
  }
}
.vision_ceo .vision_ceo_subtitle {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_body {
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.vision_ceo .vision_ceo_body p {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_body p {
    font-size: var(--fs-p1-tab);
  }
}
.vision_ceo .vision_ceo_body p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.vision_ceo .vision_ceo_body p + p {
  margin-top: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .vision_ceo .vision_ceo_inner {
    width: auto;
    margin: 0 40px;
    padding: 160px 0 120px;
  }
  .vision_ceo .vision_ceo_content {
    flex-direction: column;
  }
  .vision_ceo .vision_ceo_photo {
    width: 100%;
  }
  .vision_ceo .vision_ceo_img {
    width: 100%;
    height: auto;
  }
  .vision_ceo .vision_ceo_sign {
    width: 100%;
    height: 47px;
    margin-top: 16px;
  }
  .vision_ceo .vision_ceo_signature {
    width: 121px;
    height: 47px;
  }
  .vision_ceo .vision_ceo_txt {
    margin-left: 0;
    padding-top: 80px;
    width: 559px;
  }
  .vision_ceo .vision_ceo_title {
    margin-top: 42px;
  }
  .vision_ceo .vision_ceo_subtitle {
    margin-top: 24px;
  }
  .vision_ceo .vision_ceo_body {
    margin-top: 20px;
  }
  .vision_ceo .vision_ceo_body p + p {
    margin-top: 24px;
  }
}
@media screen and (max-width: 767px) {
  .vision_ceo {
    margin-bottom: 0;
  }
  .vision_ceo .vision_ceo_inner {
    width: auto;
    margin: 0 20px;
    flex-direction: column;
    padding: 144px 0 128px;
  }
  .vision_ceo .vision_ceo_photo {
    width: 100%;
  }
  .vision_ceo .vision_ceo_img {
    width: 100%;
    height: auto;
  }
  .vision_ceo .vision_ceo_sign {
    width: 100%;
    height: 47px;
    margin-top: 16px;
  }
  .vision_ceo .vision_ceo_signature {
    width: 121px;
    height: 47px;
  }
  .vision_ceo .vision_ceo_content {
    flex-direction: column;
  }
  .vision_ceo .vision_ceo_label_mo {
    display: block;
    margin-bottom: 20px;
  }
  .vision_ceo .vision_ceo_txt .vision_ceo_label {
    display: none;
  }
  .vision_ceo .vision_ceo_txt {
    margin-left: 0;
    padding-top: 60px;
    width: 335px;
  }
  .vision_ceo .vision_ceo_title {
    margin-top: 0;
  }
  .vision_ceo .vision_ceo_subtitle {
    margin-top: 24px;
  }
  .vision_ceo .vision_ceo_body {
    margin-top: 20px;
  }
  .vision_ceo .vision_ceo_body p + p {
    margin-top: 24px;
  }
}

.vision_section_header {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
}
.vision_section_header .vision_section_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_section_header .vision_section_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_section_header .vision_section_title {
    font-size: var(--fs-h2-mob);
  }
}
.vision_section_header .vision_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  flex-shrink: 0;
  text-align: center;
}
.vision_section_header .vision_section_line {
  flex: 1;
  height: 0;
  border-top: 4px solid #D1D2D4;
}

.vision_mission,
.vision_direction,
.vision_bridge,
.vision_slogan {
  position: relative;
  width: 100%;
}
.vision_mission > .sticky,
.vision_direction > .sticky,
.vision_bridge > .sticky,
.vision_slogan > .sticky {
  display: flex;
  align-items: center;
  justify-content: center;
}
.vision_mission .vision_section_inner,
.vision_direction .vision_section_inner,
.vision_bridge .vision_section_inner,
.vision_slogan .vision_section_inner {
  position: relative;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  height: max(622px * var(--base-ratio), 622 / var(--base-size) * var(--base-percent));
}
.vision_mission .vision_section_header,
.vision_direction .vision_section_header,
.vision_bridge .vision_section_header,
.vision_slogan .vision_section_header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  justify-content: center;
}
.vision_mission .vision_section_header .vision_section_line,
.vision_direction .vision_section_header .vision_section_line,
.vision_bridge .vision_section_header .vision_section_line,
.vision_slogan .vision_section_header .vision_section_line {
  flex: none;
  width: 10px;
}
.vision_mission .vision_section_card,
.vision_direction .vision_section_card,
.vision_bridge .vision_section_card,
.vision_slogan .vision_section_card {
  position: absolute;
  left: 0;
  top: max(102px * var(--base-ratio), 102 / var(--base-size) * var(--base-percent));
  width: 100%;
  height: max(520px * var(--base-ratio), 520 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.vision_mission .vision_card_label,
.vision_direction .vision_card_label,
.vision_bridge .vision_card_label,
.vision_slogan .vision_card_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_mission .vision_card_label,
  .vision_direction .vision_card_label,
  .vision_bridge .vision_card_label,
  .vision_slogan .vision_card_label {
    font-size: var(--fs-p1-tab);
  }
}
.vision_mission .vision_card_label,
.vision_direction .vision_card_label,
.vision_bridge .vision_card_label,
.vision_slogan .vision_card_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .vision_mission .vision_section_inner,
  .vision_direction .vision_section_inner,
  .vision_bridge .vision_section_inner,
  .vision_slogan .vision_section_inner {
    width: calc(100% - 80px);
    height: 594px;
  }
  .vision_mission .vision_section_header,
  .vision_direction .vision_section_header,
  .vision_bridge .vision_section_header,
  .vision_slogan .vision_section_header {
    width: 100%;
    gap: 16px;
    flex-direction: row;
  }
  .vision_mission .vision_section_header .vision_section_line,
  .vision_direction .vision_section_header .vision_section_line,
  .vision_bridge .vision_section_header .vision_section_line,
  .vision_slogan .vision_section_header .vision_section_line {
    border-top: 2px solid #D1D2D4;
    border-left: none;
    width: 10px;
    height: 0;
  }
  .vision_mission .vision_section_card,
  .vision_direction .vision_section_card,
  .vision_bridge .vision_section_card,
  .vision_slogan .vision_section_card {
    top: 74px;
    width: 100%;
    height: 520px;
    border-radius: 16px;
  }
  .vision_mission .vision_card_label,
  .vision_direction .vision_card_label,
  .vision_bridge .vision_card_label,
  .vision_slogan .vision_card_label {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_mission .vision_card_label,
  .vision_direction .vision_card_label,
  .vision_bridge .vision_card_label,
  .vision_slogan .vision_card_label {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_mission .vision_section_inner,
  .vision_direction .vision_section_inner,
  .vision_bridge .vision_section_inner,
  .vision_slogan .vision_section_inner {
    width: calc(100% - 40px);
  }
  .vision_mission .vision_section_header,
  .vision_direction .vision_section_header,
  .vision_bridge .vision_section_header,
  .vision_slogan .vision_section_header {
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }
  .vision_mission .vision_section_header .vision_section_line,
  .vision_direction .vision_section_header .vision_section_line,
  .vision_bridge .vision_section_header .vision_section_line,
  .vision_slogan .vision_section_header .vision_section_line {
    flex: none;
    border-top: none;
    border-left: 2px solid #D1D2D4;
    width: 0;
    height: 40px;
  }
  .vision_mission .vision_section_card,
  .vision_direction .vision_section_card,
  .vision_bridge .vision_section_card,
  .vision_slogan .vision_section_card {
    width: 100%;
    border-radius: 16px;
  }
  .vision_mission .vision_card_label,
  .vision_direction .vision_card_label,
  .vision_bridge .vision_card_label,
  .vision_slogan .vision_card_label {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_mission .vision_card_label,
  .vision_direction .vision_card_label,
  .vision_bridge .vision_card_label,
  .vision_slogan .vision_card_label {
    font-size: var(--fs-p1-tab);
  }
}

.vision_mission {
  height: 300vh;
  background: #025997;
}
.vision_mission .vision_section_title {
  color: #FFFFFF;
}
.vision_mission .vision_section_line {
  border-top-color: #ABDDFA;
  border-left-color: #ABDDFA;
}
.vision_mission .vision_mission_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vision_mission .vision_mission_card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_mission .vision_mission_card_txt {
  position: absolute;
  left: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  width: max(584px * var(--base-ratio), 584 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.vision_mission .vision_mission_main {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-mob);
  }
}
.vision_mission .vision_mission_main {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.vision_mission .vision_mission_desc {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-mob);
  }
}
.vision_mission .vision_mission_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1024px) {
  .vision_mission > .sticky {
    min-height: max(100svh, 809px);
  }
  .vision_mission .vision_section_line {
    border-top-color: #ABDDFA;
  }
  .vision_mission .vision_mission_card_txt {
    left: 0;
    right: 0;
    top: 120px;
    width: 366px;
    margin: 0 auto;
  }
  .vision_mission .vision_mission_main {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 16px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 1024px) {
  .vision_mission .vision_mission_desc {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 20px;
    width: auto;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 767px) {
  .vision_mission {
    height: auto;
    margin-top: 50vh;
  }
  .vision_mission > .sticky {
    position: relative;
    height: auto;
    overflow: visible;
    min-height: max(100svh, 812px);
  }
  .vision_mission .vision_section_inner {
    height: 652px;
  }
  .vision_mission .vision_section_header .vision_section_line {
    border-left-color: #ABDDFA;
  }
  .vision_mission .vision_section_card {
    top: 172px;
    height: 480px;
  }
  .vision_mission .vision_mission_card_txt {
    left: 0;
    right: 0;
    top: 120px;
    width: 306px;
    margin: 0 auto;
  }
  .vision_mission .vision_mission_main {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_mission .vision_mission_main {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 767px) {
  .vision_mission .vision_mission_desc {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 20px;
    width: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_mission .vision_mission_desc {
    font-size: var(--fs-h5-mob);
  }
}

.vision_direction {
  height: 300vh;
  background: #FFFFFF;
}
.vision_direction .vision_section_line {
  border-top-color: #D1D2D4;
}
.vision_direction .vision_direction_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vision_direction .vision_direction_card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_direction .vision_direction_card_txt {
  position: absolute;
  left: max(321px * var(--base-ratio), 321 / var(--base-size) * var(--base-percent));
  top: max(116px * var(--base-ratio), 116 / var(--base-size) * var(--base-percent));
  width: max(822px * var(--base-ratio), 822 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.vision_direction .vision_direction_main {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h2-mob);
  }
}
.vision_direction .vision_direction_main {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.vision_direction .vision_direction_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_direction .vision_direction_desc {
    font-size: var(--fs-p1-tab);
  }
}
.vision_direction .vision_direction_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(749px * var(--base-ratio), 749 / var(--base-size) * var(--base-percent));
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1024px) {
  .vision_direction > .sticky {
    min-height: max(100svh, 811px);
  }
  .vision_direction .vision_direction_card_txt {
    left: 0;
    right: 0;
    top: 120px;
    width: 627px;
    margin: 0 auto;
  }
  .vision_direction .vision_direction_main {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 16px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 1024px) {
  .vision_direction .vision_direction_desc {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 20px;
    width: auto;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_direction .vision_direction_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_direction .vision_direction_desc {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 767px) {
  .vision_direction {
    height: auto;
  }
  .vision_direction > .sticky {
    position: relative;
    height: auto;
    overflow: visible;
    min-height: max(100svh, 812px);
  }
  .vision_direction .vision_section_inner {
    height: 652px;
  }
  .vision_direction .vision_section_card {
    top: 172px;
    height: 480px;
  }
  .vision_direction .vision_direction_card_txt {
    left: 0;
    right: 0;
    top: 48px;
    width: 325px;
    margin: 0 auto;
  }
  .vision_direction .vision_direction_main {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_direction .vision_direction_main {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 767px) {
  .vision_direction .vision_direction_desc {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 20px;
    width: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_direction .vision_direction_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_direction .vision_direction_desc {
    font-size: var(--fs-h5-mob);
  }
}

.vision_bridge {
  position: relative;
  z-index: 1;
  height: 300vh;
  margin-top: -100vh;
  background: #FFFFFF;
}
.vision_bridge .vision_section_inner {
  height: max(818px * var(--base-ratio), 818 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_section_card {
  height: max(716px * var(--base-ratio), 716 / var(--base-size) * var(--base-percent));
  overflow: visible;
  border-radius: 0;
}
.vision_bridge .vision_bridge_slider {
  overflow: visible;
}
.vision_bridge .vision_bridge_slider .swiper-wrapper {
  display: flex;
}
.vision_bridge .vision_bridge_slider .swiper-slide {
  width: 100%;
  flex-shrink: 0;
}
.vision_bridge .vision_bridge_card {
  position: relative;
  width: 100%;
  height: max(640px * var(--base-ratio), 640 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_bridge_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vision_bridge .vision_bridge_card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_bridge .vision_bridge_card_title {
  position: absolute;
  left: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_bridge_badge {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_badge {
    font-size: var(--fs-p1-tab);
  }
}
.vision_bridge .vision_bridge_badge {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.vision_bridge .vision_bridge_name {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-mob);
  }
}
.vision_bridge .vision_bridge_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_bridge_card_list {
  position: absolute;
  left: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  bottom: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  html[lang=en] .vision_bridge_card_list {
    left: max(844px * var(--base-ratio), 844 / var(--base-size) * var(--base-percent));
    bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
    width: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
  }
}
.vision_bridge .vision_bridge_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_bridge_item_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_title {
    font-size: var(--fs-p1-tab);
  }
}
.vision_bridge .vision_bridge_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.vision_bridge .vision_bridge_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.vision_bridge .vision_bridge_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.vision_bridge .vision_bridge_indicator {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.vision_bridge .vision_bridge_dot {
  position: relative;
  width: 12px;
  height: 12px;
  border-radius: 12px;
  background: #FFFFFF;
  border: 1px solid #D1D2D4;
  transition: width 0.3s ease, background 0.3s ease;
  overflow: hidden;
  cursor: pointer;
}
.vision_bridge .vision_bridge_dot::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  border-radius: 12px;
  background: #00A3F1;
}
.vision_bridge .vision_bridge_dot.is_active {
  width: 36px;
  background: #D1D2D4;
  border: none;
}
.vision_bridge .vision_bridge_dot.is_active::after {
  animation: bridgeDotProgress var(--bridge-autoplay-duration, 5s) linear forwards;
}
@media screen and (max-width: 1024px) {
  .vision_bridge > .sticky {
    min-height: max(100svh, 885px);
  }
  .vision_bridge .vision_section_inner {
    height: 725px;
  }
  .vision_bridge .vision_section_card {
    top: 53px;
    height: 672px;
    overflow: visible;
    border-radius: 0;
  }
  .vision_bridge .vision_bridge_card {
    height: 640px;
    border-radius: 16px;
  }
  .vision_bridge .vision_bridge_card_title {
    left: 40px;
    top: 80px;
  }
  .vision_bridge .vision_bridge_badge {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_badge {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_name {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 6px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_card_list {
    left: auto;
    right: 40px;
    bottom: 60px;
    gap: 26px;
  }
  html[lang=en] .vision_bridge_card_list {
    left: 40px;
  }
  .vision_bridge .vision_bridge_item {
    gap: 8px;
  }
  .vision_bridge .vision_bridge_item_title {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_title {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_desc {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .vision_bridge .vision_bridge_indicator {
    margin-top: 20px;
    gap: 6px;
  }
}
@media screen and (max-width: 767px) {
  .vision_bridge {
    height: auto;
  }
  .vision_bridge > .sticky {
    position: relative;
    height: auto;
    overflow: visible;
    min-height: max(100svh, 964px);
  }
  .vision_bridge .vision_section_inner {
    height: 804px;
  }
  .vision_bridge .vision_section_card {
    top: 172px;
    height: 620px;
    overflow: visible;
    border-radius: 0;
  }
  .vision_bridge .vision_bridge_card {
    height: 600px;
    border-radius: 16px;
  }
  .vision_bridge .vision_bridge_card_title {
    position: absolute;
    left: 20px;
    top: 60px;
  }
  .vision_bridge .vision_bridge_badge {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_badge {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_bridge .vision_bridge_name {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 6px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_bridge .vision_bridge_name {
    font-size: var(--fs-h1-mob);
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .vision_bridge_name {
    font-size: 34px;
  }
  .vision_bridge .vision_bridge_card_list {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 40px;
    width: auto;
    gap: 26px;
  }
  html[lang=en] .vision_bridge_card_list {
    left: 20px;
  }
  .vision_bridge .vision_bridge_item {
    gap: 8px;
  }
  .vision_bridge .vision_bridge_item_title {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_title {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_bridge .vision_bridge_item_desc {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_bridge .vision_bridge_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_bridge .vision_bridge_indicator {
    margin-top: 20px;
    gap: 6px;
  }
}

@keyframes bridgeDotProgress {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
.vision_slogan_wrap {
  position: relative;
  z-index: 0;
}

.vision_slogan_bg {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 0;
}
.vision_slogan_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vision_slogan {
  position: relative;
  z-index: 1;
  height: 300vh;
}
.vision_slogan .vision_section_inner {
  height: max(382px * var(--base-ratio), 382 / var(--base-size) * var(--base-percent));
}
.vision_slogan .vision_section_title {
  color: #FFFFFF;
}
.vision_slogan .vision_section_line {
  border-top-color: #FFFFFF;
  border-left-color: #FFFFFF;
}
.vision_slogan .vision_slogan_img {
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vision_slogan .vision_slogan_img .vision_slogan_text {
  width: max(1060px * var(--base-ratio), 1060 / var(--base-size) * var(--base-percent));
  height: max(54px * var(--base-ratio), 54 / var(--base-size) * var(--base-percent));
  object-fit: contain;
}
@media screen and (max-width: 1024px) {
  .vision_slogan > .sticky {
    min-height: max(100svh, 615px);
  }
  .vision_slogan .vision_section_inner {
    height: 206px;
  }
  .vision_slogan .vision_slogan_img {
    height: 132px;
    border-radius: 8px;
  }
  .vision_slogan .vision_slogan_img .vision_slogan_text {
    width: 498px;
    height: 25px;
    object-fit: contain;
  }
}
@media screen and (max-width: 767px) {
  .vision_slogan {
    height: auto;
  }
  .vision_slogan > .sticky {
    position: relative;
    height: auto;
    overflow: visible;
    min-height: max(100svh, 812px);
  }
  .vision_slogan .vision_section_inner {
    height: 272px;
  }
  .vision_slogan .vision_section_card {
    top: 172px;
    height: 100px;
  }
  .vision_slogan .vision_slogan_img {
    height: 100px;
    border-radius: 8px;
  }
  .vision_slogan .vision_slogan_img .vision_slogan_text {
    width: 310px;
    height: 16px;
    object-fit: contain;
  }
}

.vision_posco_link {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.vision_posco_link .vision_posco_link_inner {
  display: block;
  position: relative;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  overflow: hidden;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.vision_posco_link .vision_posco_link_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vision_posco_link .vision_posco_link_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vision_posco_link .vision_posco_link_content {
  position: absolute;
  left: max(84px * var(--base-ratio), 84 / var(--base-size) * var(--base-percent));
  top: max(92px * var(--base-ratio), 92 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  height: max(86px * var(--base-ratio), 86 / var(--base-size) * var(--base-percent));
}
.vision_posco_link .vision_posco_logo {
  width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  height: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.vision_posco_link .vision_posco_logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.vision_posco_link .vision_posco_divider {
  width: 0;
  height: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  border-left: 1px solid #FFFFFF;
  opacity: 0.2;
  margin-left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.vision_posco_link .vision_posco_text {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-mob);
  }
}
.vision_posco_link .vision_posco_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.vision_posco_link .vision_posco_btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  margin-left: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  align-self: flex-end;
  overflow: hidden;
}
.vision_posco_link .vision_posco_btn_circle {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.vision_posco_link .vision_posco_btn_arrow {
  position: relative;
  width: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
  height: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .vision_posco_link .vision_posco_link_inner:hover .vision_posco_btn_arrow {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
@media screen and (max-width: 1024px) {
  .vision_posco_link {
    padding: 80px 0 160px;
  }
  .vision_posco_link .vision_posco_link_inner {
    width: auto;
    margin: 0 40px;
    height: 260px;
    border-radius: 12px;
  }
  .vision_posco_link .vision_posco_link_content {
    left: 40px;
    top: 60px;
    width: 381px;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
  }
  .vision_posco_link .vision_posco_logo {
    width: 192px;
    height: 52px;
  }
  .vision_posco_link .vision_posco_divider {
    display: none;
  }
  .vision_posco_link .vision_posco_text {
    font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-left: 0;
    margin-top: 28px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-mob);
  }
}
@media screen and (max-width: 1024px) {
  .vision_posco_link .vision_posco_btn {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 42px;
    height: 42px;
    margin-left: 0;
    align-self: auto;
  }
}
@media screen and (max-width: 767px) {
  .vision_posco_link {
    padding: 80px 0 160px;
  }
  .vision_posco_link .vision_posco_link_inner {
    width: auto;
    margin: 0 20px;
    height: 400px;
    border-radius: 12px;
  }
  .vision_posco_link .vision_posco_link_content {
    left: 20px;
    top: 60px;
    width: auto;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
  }
  .vision_posco_link .vision_posco_logo {
    width: 177px;
    height: 48px;
  }
  .vision_posco_link .vision_posco_divider {
    display: none;
  }
  .vision_posco_link .vision_posco_text {
    font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-left: 0;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .vision_posco_link .vision_posco_text {
    font-size: var(--fs-h4-mob);
  }
}
@media screen and (max-width: 767px) {
  .vision_posco_link .vision_posco_btn {
    position: absolute;
    left: 0;
    right: auto;
    bottom: auto;
    top: 181px;
    width: 42px;
    height: 42px;
    margin-left: 0;
    align-self: auto;
  }
  html[lang=en] .vision_posco_link .vision_posco_btn {
    top: 196px;
  }
}

.intro_globe_section {
  position: relative;
  margin-bottom: -1px;
}
.intro_globe_section > .pin-spacer {
  pointer-events: none;
}

.intro_globe_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 0;
  overflow: hidden;
  background-color: #0A0E12;
}

.intro_globe_video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

.intro_globe_bg .intro_business_content {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
}

.intro_globe_bg .intro_business_slider {
  position: absolute;
  z-index: 1;
  left: 0;
  width: 100%;
}

.intro_globe_canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.intro_globe_canvas canvas {
  width: 100% !important;
  pointer-events: auto;
}
.intro_globe_canvas .scene-container {
  overflow: visible !important;
  width: 100%;
  height: 100%;
  pointer-events: auto;
}
.intro_globe_canvas.is_inactive {
  pointer-events: none !important;
}
.intro_globe_canvas.is_inactive * {
  pointer-events: none !important;
}

div:has(> .globe-marker) {
  overflow: visible !important;
}

.globe-marker {
  pointer-events: auto;
}
.globe-marker .dot {
  position: relative;
  width: 24px;
  height: 24px;
}
@media screen and (max-width: 1024px) {
  .globe-marker .dot {
    width: 12px;
    height: 12px;
  }
}
.globe-marker .dot {
  border-radius: 999px;
  background: rgba(0, 170, 255, 0.9);
  box-shadow: 0 0 0 2px #FFFFFF;
  filter: drop-shadow(0 0 8px rgba(0, 170, 255, 0.35));
}
.globe-marker .dot::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: rgba(0, 170, 255, 0.35);
  z-index: -1;
  transform: scale(1);
  opacity: 0.9;
  animation: markerPulse 1.6s ease-out infinite;
}
.globe-marker .dot::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  border: 2px solid rgba(0, 170, 255, 0.6);
  z-index: -1;
  transform: scale(1);
  opacity: 0;
  animation: markerPulse 1.6s ease-out infinite;
  animation-delay: 0.4s;
}
.globe-marker .globe_label {
  position: absolute;
  transform: translate(-50%, -240%) scale(var(--globe-inverse-scale, 1));
  transform-origin: center bottom;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 4px 10px 4px 6px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.8);
  white-space: nowrap;
  width: max-content;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.globe-marker .globe_label img {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.globe-marker .globe_label span {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .globe-marker .globe_label span {
    font-size: 16px;
  }
}
.globe-marker .globe_label span {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.globe-marker .dot:hover ~ .globe_label {
  opacity: 1;
}

@keyframes markerPulse {
  0% {
    transform: scale(1);
    opacity: 0.85;
  }
  70% {
    opacity: 0.15;
  }
  100% {
    transform: scale(2.6);
    opacity: 0;
  }
}
.ir_library,
.ir_announcement {
  position: relative;
}
.ir_library .intro_page_title,
.ir_announcement .intro_page_title {
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 1024px) {
  .ir_announcement .ir_bg {
    height: 1153px;
  }
}
@media screen and (max-width: 767px) {
  .ir_announcement .ir_bg {
    height: 808px;
  }
}

.ir_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: max(963px * var(--base-ratio), 963 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .ir_bg {
    height: 1124px;
  }
}
@media screen and (max-width: 767px) {
  .ir_bg {
    height: 779px;
  }
}

.ir_latest {
  position: relative;
  z-index: 1;
  display: flex;
  max-width: 76.25%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .ir_latest {
    flex-direction: column;
    max-width: none;
    margin: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .ir_latest {
    margin: 0 20px;
  }
}

.ir_latest_cover {
  flex: none;
  width: max(722px * var(--base-ratio), 722 / var(--base-size) * var(--base-percent));
  position: relative;
  overflow: hidden;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) 0 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background-color: #D9D9D9;
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover {
    flex: none;
    width: auto;
    border-radius: 8px 8px 0 0;
    height: 453px;
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_cover {
    height: 220px;
  }
}
.ir_latest_cover .ir_cover_img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ir_latest_cover .ir_cover_logo {
  position: absolute;
  top: max(35px * var(--base-ratio), 35 / var(--base-size) * var(--base-percent));
  left: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  width: max(78px * var(--base-ratio), 78 / var(--base-size) * var(--base-percent));
  height: auto;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_logo {
    top: 33px;
    left: 29px;
    width: 74px;
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_cover .ir_cover_logo {
    top: 16px;
    left: 14px;
    width: 36px;
  }
}
.ir_latest_cover .ir_cover_txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 1;
}
.ir_latest_cover .ir_cover_company {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_company {
    font-size: var(--fs-p1-tab);
  }
}
.ir_latest_cover .ir_cover_company {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_company {
    margin-bottom: 6px;
  }
}
.ir_latest_cover .ir_cover_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_cover .ir_cover_title {
    font-size: var(--fs-h2-mob);
  }
}
.ir_latest_cover .ir_cover_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
  white-space: nowrap;
}
.ir_latest_cover .ir_cover_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_date {
    font-size: 16px;
  }
}
.ir_latest_cover .ir_cover_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #FFFFFF;
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ir_latest_cover .ir_cover_date {
    margin-top: 16px;
  }
}

.ir_latest_info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  min-height: max(476px * var(--base-ratio), 476 / var(--base-size) * var(--base-percent));
  padding: clamp(32px, 3.125vw, 60px);
  background-color: #FFFFFF;
  border-radius: 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ir_latest_info {
    gap: 24px;
    min-height: auto;
    padding: 40px;
    border-radius: 0 0 8px 8px;
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_info {
    padding: 24px 20px;
  }
}
.ir_latest_info .btn {
  align-self: flex-start;
}

.ir_latest_list {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ir_latest_list {
    gap: 16px;
  }
}
.ir_latest_list .ir_latest_list_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ir_latest_list .ir_latest_list_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_list .ir_latest_list_title {
    font-size: var(--fs-h4-mob);
  }
}
.ir_latest_list .ir_latest_list_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.ir_latest_toc_wrap {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  .ir_latest_toc_wrap {
    height: max(196px * var(--base-ratio), 196 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .ir_latest_toc_wrap {
    gap: 16px;
    height: 139px;
  }
}
@media screen and (max-width: 767px) {
  .ir_latest_toc_wrap {
    height: 185px;
  }
}

.ir_latest_toc {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}
.ir_latest_toc::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
@media screen and (max-width: 1024px) {
  .ir_latest_toc {
    gap: 6px;
  }
}
.ir_latest_toc li {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ir_latest_toc li {
    font-size: var(--fs-p1-tab);
  }
}
.ir_latest_toc li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #6D6E72;
}
.ir_latest_toc.is_numbered {
  counter-reset: toc;
}
.ir_latest_toc.is_numbered li {
  counter-increment: toc;
}
.ir_latest_toc.is_numbered li::before {
  content: counter(toc) ". ";
}

.ir_latest_toc_scrollbar {
  position: relative;
  flex-shrink: 0;
  align-self: stretch;
  width: 2px;
  background: #F3F3F3;
  border-radius: 999px;
  visibility: hidden;
}

.ir_latest_toc_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #818286;
  border-radius: 999px;
  cursor: grab;
  touch-action: none;
}
.ir_latest_toc_scrollbar_thumb:active {
  cursor: grabbing;
}

.ir_board {
  position: relative;
  z-index: 1;
  max-width: 76.25%;
  margin: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent)) auto 0;
}
@media screen and (max-width: 1024px) {
  .ir_board {
    max-width: none;
    margin: 192px 40px 0;
  }
}
@media screen and (max-width: 767px) {
  .ir_board {
    margin: 192px 20px 0;
  }
}
.ir_board .board_list_date {
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}

.ir_pagination {
  position: relative;
  z-index: 1;
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ir_pagination {
    margin-top: 40px;
    padding-bottom: 160px;
  }
}

.financial_info {
  background-color: #FFFFFF;
}
.financial_info .intro_page_title_inner {
  padding-bottom: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
}

.fi_content {
  max-width: 76.25%;
  margin: 0 auto;
  padding-bottom: clamp(120px, 10.4vw, 200px);
}
@media screen and (max-width: 1024px) {
  .fi_content {
    max-width: none;
    margin: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .fi_content {
    margin: 0 20px;
  }
}

.fi_section + .fi_section {
  margin-top: clamp(100px, 8.33vw, 160px);
}
@media screen and (max-width: 1024px) {
  .fi_section + .fi_section {
    margin-top: 120px;
  }
}

.fi_section_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fi_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.fi_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  margin-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_section_title {
    margin-bottom: 16px;
  }
}

.fi_rating_cards {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_rating_cards {
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .fi_rating_cards {
    flex-direction: column;
  }
}

.fi_rating_card {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  min-height: max(300px * var(--base-ratio), 300 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_rating_card {
    min-height: 240px;
    padding: 30px 40px 30px 30px;
    border-radius: 12px;
  }
}
.fi_rating_card.is_blue {
  background-color: #E8F3FE;
}
.fi_rating_card.is_blue .fi_card_company {
  color: #025997;
}

.fi_card_info {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_card_info {
    gap: 8px;
  }
}

.fi_card_company {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_card_company {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fi_card_company {
    font-size: var(--fs-h5-mob);
  }
}
.fi_card_company {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
}

.fi_card_details {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_card_details {
    gap: 2px;
  }
}

.fi_card_detail {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_card_detail {
    gap: 20px;
  }
}
.fi_card_detail dt {
  flex-shrink: 0;
  width: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_card_detail dt {
    font-size: var(--fs-p1-tab);
  }
}
.fi_card_detail dt {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .fi_card_detail dt {
    width: 90px;
  }
}
.fi_card_detail dd {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_card_detail dd {
    font-size: var(--fs-p1-tab);
  }
}
.fi_card_detail dd {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #161D27;
}

.fi_card_grade {
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_card_grade {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fi_card_grade {
    font-size: var(--fs-d3-mob);
  }
}
.fi_card_grade {
  letter-spacing: -0.03em;
  font-weight: 600;
  line-height: 1;
  font-family: "Bai Jamjuree", sans-serif;
  color: #161D27;
}

.fi_def_board {
  display: flex;
  flex-direction: column;
}

@media screen and (max-width: 1024px) {
  .fi_def_scroll {
    overflow-x: auto;
  }
}

.fi_def_header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-top: 2px solid #025997;
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .fi_def_header {
    min-width: 1160px;
    gap: 0;
    padding: 28px 20px;
  }
}
.fi_def_header > span {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_def_header > span {
    font-size: var(--fs-p1-tab);
  }
}
.fi_def_header > span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #161D27;
  text-align: center;
}

.fi_def_row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .fi_def_row {
    min-width: 1160px;
    gap: 0;
  }
}

.fi_def_cell {
  min-width: 0;
  display: flex;
  align-items: center;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_def_cell {
    padding: 28px 20px;
  }
}
.fi_def_cell.has_multi {
  flex-direction: column;
  align-items: stretch;
  padding: 0;
}
.fi_def_cell.has_multi .fi_def_item {
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_def_cell.has_multi .fi_def_item {
    padding: 28px 20px;
  }
}
.fi_def_cell.has_multi .fi_def_item + .fi_def_item {
  border-top: 1px solid #D1D2D4;
}

.fi_def_item {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .fi_def_item {
    gap: 20px;
  }
}

.fi_def_grade {
  flex-shrink: 0;
  width: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_def_grade {
    font-size: var(--fs-p1-tab);
  }
}
.fi_def_grade {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #161D27;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fi_def_grade {
    width: 48px;
  }
}

.fi_def_desc {
  flex: 1;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_def_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fi_def_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
}

.fi_def_note {
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fi_def_note {
    display: none;
  }
}

.fi_note_label {
  flex-shrink: 0;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_note_label {
    font-size: 14px;
  }
}
.fi_note_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}

.fi_note_text {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fi_note_text {
    font-size: 14px;
  }
}
.fi_note_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
.fi_note_text p + p {
  margin-top: 0;
}

.disclosure_iframe {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 840px;
  max-width: 100%;
  height: 1088px;
  margin: 0 auto;
  margin-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .disclosure_iframe {
    position: relative;
    width: auto;
    height: 1088px;
    margin: 0 40px 160px;
  }
}
@media screen and (max-width: 767px) {
  .disclosure_iframe {
    margin: 0 20px 160px;
  }
}

.disclosure_iframe_wrap {
  width: 714px;
  height: 960px;
  overflow-x: auto;
  overflow-y: hidden;
}
.disclosure_iframe_wrap iframe {
  display: block;
  width: 714px;
  height: 960px;
  border: none;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .disclosure_iframe_wrap {
    width: 100%;
    height: 960px;
    padding: 20px 10px;
  }
  .disclosure_iframe_wrap iframe {
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .disclosure_iframe_wrap {
    width: 100%;
    height: 960px;
    padding: 20px 10px;
  }
  .disclosure_iframe_wrap iframe {
    margin: 0 auto;
  }
}

.steel {
  position: relative;
}
.steel .steel_process_bg {
  background: #FFFFFF;
}
.steel .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.steel .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.steel_section {
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1024px) {
  .steel_section {
    width: 688px;
  }
}
@media screen and (max-width: 767px) {
  .steel_section {
    width: calc(100% - 40px);
  }
}

.steel_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.steel_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.steel_hero .steel_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.steel_hero .steel_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .steel_hero .steel_hero_bg {
    width: 90%;
  }
}
.steel_hero .steel_intro_txt {
  position: relative;
  z-index: 4;
  width: max(702px * var(--base-ratio), 702 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_hero .steel_intro_txt {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .steel_hero .steel_intro_txt {
    width: calc(100% - 40px);
  }
}
.steel_hero .steel_hero_txt {
  position: relative;
  z-index: 2;
  opacity: 0;
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_hero .steel_hero_txt {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_hero .steel_hero_txt {
    font-size: var(--fs-h1-mob);
  }
}
.steel_hero .steel_hero_txt {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
}
.steel_hero .steel_hero_highlight {
  color: #00A3F1;
}
.steel_hero .steel_intro_desc {
  opacity: 0;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_hero .steel_intro_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_hero .steel_intro_desc {
    font-size: var(--fs-h5-mob);
  }
}
.steel_hero .steel_intro_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: center;
}

.steel_intro_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  transform: translateY(100%);
  overflow: hidden;
}
.steel_intro_overlay .steel_intro_bg_color {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
}
.steel_intro_overlay .steel_intro_marquee {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.steel_intro_overlay .steel_intro_marquee_track {
  position: absolute;
  top: 0;
  left: max(-27px * var(--base-ratio), -27 / var(--base-size) * var(--base-percent));
  display: flex;
  height: 100%;
  animation: steelMarquee 40s linear infinite;
}
@media screen and (max-width: 1024px) {
  .steel_intro_overlay .steel_intro_marquee_track {
    left: -30px;
    animation: steelMarqueeTablet 20s linear infinite;
  }
}
.steel_intro_overlay .steel_intro_card_set {
  position: relative;
  height: 100%;
  aspect-ratio: 3992/1237;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .steel_intro_overlay .steel_intro_card_set {
    aspect-ratio: 1705/864;
  }
}
.steel_intro_overlay .steel_intro_card {
  position: absolute;
  border-radius: 12px;
  overflow: hidden;
}
.steel_intro_overlay .steel_intro_card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.steel_intro_overlay .si_card_01 {
  left: 0%;
  top: 0%;
  width: 8.5421%;
  height: 33.387%;
}
.steel_intro_overlay .si_card_02 {
  left: 5.01%;
  top: 67.421%;
  width: 7.49%;
  height: 18.108%;
}
.steel_intro_overlay .si_card_03 {
  left: 22.144%;
  top: 0%;
  width: 8.5421%;
  height: 24.252%;
}
.steel_intro_overlay .si_card_04 {
  left: 27.731%;
  top: 74.778%;
  width: 10.997%;
  height: 21.422%;
}
.steel_intro_overlay .si_card_05 {
  left: 40.281%;
  top: 21.585%;
  width: 8.5421%;
  height: 21.099%;
}
.steel_intro_overlay .si_card_06 {
  left: 61.574%;
  top: 9.943%;
  width: 12.099%;
  height: 18.432%;
}
.steel_intro_overlay .si_card_07 {
  left: 86.423%;
  top: 22.636%;
  width: 8.5672%;
  height: 18.027%;
}
.steel_intro_overlay .si_card_08 {
  left: 72.47%;
  top: 68.149%;
  width: 6.8387%;
  height: 19.402%;
}
.steel_intro_overlay .si_card_09 {
  left: 52.856%;
  top: 71.058%;
  width: 7.3897%;
  height: 28.94%;
}
@media screen and (max-width: 1024px) {
  .steel_intro_overlay .si_card_01 {
    left: 0%;
    top: 0%;
    width: 10.029%;
    height: 23.958%;
  }
  .steel_intro_overlay .si_card_02 {
    left: 4.106%;
    top: 74.769%;
    width: 9.853%;
    height: 14.583%;
  }
  .steel_intro_overlay .si_card_03 {
    left: 17.302%;
    top: 0.231%;
    width: 10.029%;
    height: 17.361%;
  }
  .steel_intro_overlay .si_card_04 {
    left: 22.464%;
    top: 81.134%;
    width: 14.487%;
    height: 17.245%;
  }
  .steel_intro_overlay .si_card_05 {
    left: 31.965%;
    top: 20.718%;
    width: 11.261%;
    height: 17.014%;
  }
  .steel_intro_overlay .si_card_06 {
    left: 51.378%;
    top: 10.88%;
    width: 15.953%;
    height: 14.815%;
  }
  .steel_intro_overlay .si_card_07 {
    left: 76.95%;
    top: 16.667%;
    width: 11.32%;
    height: 14.583%;
  }
  .steel_intro_overlay .si_card_08 {
    left: 64.34%;
    top: 67.361%;
    width: 9.032%;
    height: 15.625%;
  }
  .steel_intro_overlay .si_card_09 {
    left: 45.865%;
    top: 76.62%;
    width: 9.736%;
    height: 23.38%;
  }
}
@keyframes steelMarquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes steelMarqueeTablet {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.tpl {
  position: relative;
}
.tpl .steel_intro_txt {
  width: auto;
}
.tpl .steel_intro_marquee_track {
  left: 0;
}
.tpl .steel_intro_card_set {
  aspect-ratio: 3900/1080;
}
.tpl .steel_intro_card {
  object-fit: cover;
}
.tpl .tpl_card_01 {
  left: 0%;
  top: 0%;
  width: 8.0512820513%;
  height: 31.9444444444%;
  border-radius: 0 0 12px 0;
}
.tpl .tpl_card_02 {
  left: 4.4358974359%;
  top: 72.8703703704%;
  width: 7.6666666667%;
  height: 18.7962962963%;
}
.tpl .tpl_card_03 {
  left: 21.9743589744%;
  top: 0%;
  width: 8.7435897436%;
  height: 21.2962962963%;
  border-radius: 0 0 12px 12px;
}
.tpl .tpl_card_04 {
  left: 27.6923076923%;
  top: 76.8518518519%;
  width: 11.2564102564%;
  height: 23.1481481481%;
  border-radius: 12px 12px 0 0;
}
.tpl .tpl_card_05 {
  left: 40.5384615385%;
  top: 18.4259259259%;
  width: 10.5128205128%;
  height: 24.1666666667%;
}
.tpl .tpl_card_06 {
  left: 53.4102564103%;
  top: 75.0925925926%;
  width: 7.5641025641%;
  height: 24.9074074074%;
  border-radius: 12px 12px 0 0;
}
.tpl .tpl_card_07 {
  left: 62.3333333333%;
  top: 0%;
  width: 12.3846153846%;
  height: 25.6481481481%;
}
.tpl .tpl_card_08 {
  left: 73.4871794872%;
  top: 71.0185185185%;
  width: 9.0512820513%;
  height: 22.2222222222%;
}
.tpl .tpl_card_09 {
  left: 87.7572741386%;
  top: 19.6296296296%;
  width: 8.7692307692%;
  height: 20.6481481481%;
}

.tpl_solution {
  height: 56.25vw;
  position: relative;
  overflow: hidden;
}

.tpl_solution_title {
  position: absolute;
  top: calc(50% - max(432px * var(--base-ratio), 432 / var(--base-size) * var(--base-percent)));
  left: 0;
  width: 100%;
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_solution_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_solution_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_solution_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
}

.tpl_solution_viewport {
  position: absolute;
  top: calc(50% - max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)));
  left: 0;
  width: 100%;
  overflow: hidden;
}

.tpl_bento {
  position: relative;
  width: max(2692px * var(--base-ratio), 2692 / var(--base-size) * var(--base-percent));
  height: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
  margin-left: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  will-change: transform;
}

.tpl_bento_card {
  position: absolute;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  backface-visibility: hidden;
  will-change: transform;
  transition: transform 0.8s linear;
}

.tpl_bento_card--01 {
  transform: perspective(1000px) rotateY(180deg);
}

.tpl_bento_card--02 {
  transform: perspective(1000px) rotateX(-180deg);
  transform-origin: center top;
}

.tpl_bento_card--03 {
  transform: perspective(1000px) rotateY(180deg);
}

.tpl_bento_card--04 {
  transform: perspective(1000px) rotateX(-180deg);
  transform-origin: center center;
}

.tpl_bento_card--05 {
  transform: perspective(1000px) rotateY(180deg);
}

.tpl_bento_card--06 {
  transform: perspective(1000px) rotateY(180deg);
}

.tpl_bento_card--01.active {
  transform: perspective(1000px) rotateY(0deg);
  transition-delay: 0s;
}

.tpl_bento_card--02.active {
  transform: perspective(1000px) rotateX(0deg);
  transition-delay: 0.2s;
}

.tpl_bento_card--03.active {
  transform: perspective(1000px) rotateY(0deg);
  transition-delay: 0.4s;
}

.tpl_bento_card--04.active {
  transform: perspective(1000px) rotateX(0deg);
  transition-delay: 0.6s;
}

.tpl_bento_card--05.active {
  transform: perspective(1000px) rotateY(0deg);
  transition-delay: 0.2s;
}

.tpl_bento_card--06.active {
  transform: perspective(1000px) rotateY(0deg);
  transition-delay: 0.3s;
}

.tpl_bento_bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tpl_bento_body {
  position: absolute;
  top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  left: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.tpl_bento_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_bento_title {
    font-size: var(--fs-h4-mob);
  }
}
.tpl_bento_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}

.tpl_bento_stat {
  display: flex;
  flex-direction: column;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
}

.tpl_bento_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_label {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_bento_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
}

.tpl_bento_value {
  display: flex;
  align-items: flex-end;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
}

.tpl_bento_values {
  display: flex;
  align-items: flex-end;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}

.tpl_bento_figure {
  display: inline-flex;
  align-items: flex-end;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
}

.tpl_bento_prefix {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_prefix {
    font-size: 14px;
  }
}
.tpl_bento_prefix {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #FFFFFF;
}

html[lang=en] .tpl_bento_prefix {
  font-weight: 400;
}

.tpl_bento_divider {
  align-self: center;
  flex-shrink: 0;
  width: 1px;
  height: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent));
  background-color: rgba(255, 255, 255, 0.4);
}

.tpl_bento_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_num {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_bento_num {
    font-size: var(--fs-d3-mob);
  }
}
.tpl_bento_num {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.tpl_bento_unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_unit {
    font-size: 16px;
  }
}
.tpl_bento_unit {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
}

.tpl_bento_icon {
  position: absolute;
  z-index: 1;
}

.tpl_bento_card--01 {
  left: 0;
  top: 0;
  width: max(1060px * var(--base-ratio), 1060 / var(--base-size) * var(--base-percent));
  height: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
}

.tpl_bento_desc {
  position: absolute;
  left: 50%;
  bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
  width: max(759px * var(--base-ratio), 759 / var(--base-size) * var(--base-percent));
  z-index: 1;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_desc {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_bento_desc {
    font-size: var(--fs-h4-mob);
  }
}
.tpl_bento_desc {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: center;
}

.tpl_bento_card--02 {
  left: max(1084px * var(--base-ratio), 1084 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(620px * var(--base-ratio), 620 / var(--base-size) * var(--base-percent));
  height: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  background-color: #00A3F1;
}
.tpl_bento_card--02 .tpl_bento_icon {
  left: max(428px * var(--base-ratio), 428 / var(--base-size) * var(--base-percent));
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  height: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  mix-blend-mode: screen;
}

.tpl_bento_card--03 {
  left: max(1728px * var(--base-ratio), 1728 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(500px * var(--base-ratio), 500 / var(--base-size) * var(--base-percent));
  height: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  background-color: #e8f3fe;
}
.tpl_bento_card--03 .tpl_bento_icon {
  left: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  top: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  width: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  background-color: #025997;
  -webkit-mask: url("../images/business/3pl_solution_icon_03.svg") no-repeat center/contain;
  mask: url("../images/business/3pl_solution_icon_03.svg") no-repeat center/contain;
}
.tpl_bento_card--03 .tpl_bento_title {
  color: #161D27;
}
.tpl_bento_card--03 .tpl_bento_label,
.tpl_bento_card--03 .tpl_bento_num {
  color: #025997;
}
.tpl_bento_card--03 .tpl_bento_unit {
  color: #6d6e72;
}

.tpl_bento_card--04 {
  left: max(1084px * var(--base-ratio), 1084 / var(--base-size) * var(--base-percent));
  top: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  width: max(500px * var(--base-ratio), 500 / var(--base-size) * var(--base-percent));
  height: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  background-color: #025997;
}
.tpl_bento_card--04 .tpl_bento_icon {
  left: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  top: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  width: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  mix-blend-mode: screen;
}

.tpl_bento_card--05 {
  left: max(1608px * var(--base-ratio), 1608 / var(--base-size) * var(--base-percent));
  top: max(340px * var(--base-ratio), 340 / var(--base-size) * var(--base-percent));
  width: max(620px * var(--base-ratio), 620 / var(--base-size) * var(--base-percent));
  height: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
}
.tpl_bento_card--05 .tpl_bento_stat {
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}

.tpl_bento_card--06 {
  left: max(2252px * var(--base-ratio), 2252 / var(--base-size) * var(--base-percent));
  top: 0;
  width: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  height: max(660px * var(--base-ratio), 660 / var(--base-size) * var(--base-percent));
}

.tpl_bento_card--06.active .tpl_bento_unit {
  margin-left: 2px;
}

.tpl_bento_map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  pointer-events: none;
}

.tpl_bento_hoverdesc {
  display: none;
  width: max(290px * var(--base-ratio), 290 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_bento_hoverdesc {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_bento_hoverdesc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #e8f3fe;
}
@media screen and (max-width: 1024px) {
  .tpl_bento_hoverdesc {
    width: 100%;
  }
}

@media screen and (min-width: 1025px) {
  html[lang=en] .tpl_bento_hoverdesc {
    width: max(385px * var(--base-ratio), 385 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_card--02 .tpl_bento_hoverdesc,
  html[lang=en] .tpl_bento_card--05 .tpl_bento_hoverdesc {
    width: max(480px * var(--base-ratio), 480 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_title {
    font-size: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_label {
    font-size: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_num {
    font-size: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_unit {
    font-size: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
    font-weight: 400;
  }
  html[lang=en] .tpl_bento_desc {
    font-size: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .tpl_bento_body:not(.tpl_bento_body--center) {
    top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  }
}
.tpl_bento_card--05 .tpl_bento_hoverdesc {
  width: max(370px * var(--base-ratio), 370 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .tpl_bento_card--05 .tpl_bento_hoverdesc {
    width: 100%;
  }
}

@media screen and (max-width: 1024px) {
  html[lang=en] .tpl_bento_title {
    font-size: 18px;
  }
  html[lang=en] .tpl_bento_prefix {
    font-size: 14px;
  }
  html[lang=en] .tpl_bento_num {
    font-size: 40px;
  }
  html[lang=en] .tpl_bento_card--05 .tpl_bento_num {
    font-size: 36px;
  }
  html[lang=en] .tpl_bento_card--05 .tpl_bento_body {
    width: 356px;
  }
  html[lang=en] .tpl_bento_unit {
    font-size: 14px;
    padding-bottom: 0;
  }
  html[lang=en] .tpl_bento_hoverdesc {
    font-size: 14px;
    line-height: 18.2px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  html[lang=en] .tpl_bento_card .tpl_bento_body:not(.tpl_bento_body--center) {
    top: 36px;
  }
  html[lang=en] .tpl_bento_card.is_hoverable.is_open .tpl_bento_body:not(.tpl_bento_body--center) {
    top: 28px;
  }
  html[lang=en] .tpl_bento_card--02 .tpl_bento_hoverdesc {
    width: 323px;
  }
  html[lang=en] .tpl_bento_card--03 .tpl_bento_hoverdesc {
    width: 257px;
  }
  html[lang=en] .tpl_bento_card--04 .tpl_bento_hoverdesc {
    width: 250px;
  }
  html[lang=en] .tpl_bento_card--05 .tpl_bento_hoverdesc {
    width: 321px;
  }
  html[lang=en] .tpl_bento_card--06 .tpl_bento_hoverdesc {
    width: 213px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .tpl_bento_card .tpl_bento_body:not(.tpl_bento_body--center) {
    margin: 36px 0 0 20px;
  }
  html[lang=en] .tpl_bento_desc {
    font-size: 18px;
    line-height: 23.4px;
  }
  html[lang=en] .tpl_bento_hoverdesc {
    width: 295px;
  }
  html[lang=en] .tpl_bento_card--05 .tpl_bento_hoverdesc {
    width: 295px;
  }
  html[lang=en] .tpl_bento_card--06 .tpl_bento_hoverdesc {
    width: 213px;
  }
}
.tpl_bento_card--06 .tpl_bento_hoverdesc {
  width: max(277px * var(--base-ratio), 277 / var(--base-size) * var(--base-percent));
  text-align: center;
}

.tpl_bento_card.is_hoverable {
  transition: transform 0.8s linear, background-color 0.4s ease;
}
.tpl_bento_card.is_hoverable .tpl_bento_bg,
.tpl_bento_card.is_hoverable .tpl_bento_icon,
.tpl_bento_card.is_hoverable .tpl_bento_dot,
.tpl_bento_card.is_hoverable .tpl_bento_map {
  transition: opacity 0.4s ease;
}

@media screen and (min-width: 1025px) and (hover: hover) {
  .tpl_bento_card.is_hoverable:hover .tpl_bento_stat {
    display: none;
  }
  .tpl_bento_card.is_hoverable:hover .tpl_bento_hoverdesc {
    display: block;
  }
  .tpl_bento_card--02.is_hoverable:hover {
    background-color: #0082c1;
  }
  .tpl_bento_card--02.is_hoverable:hover .tpl_bento_icon {
    opacity: 0.2;
  }
  .tpl_bento_card--03.is_hoverable:hover {
    background-color: #bac2cb;
  }
  .tpl_bento_card--03.is_hoverable:hover .tpl_bento_title {
    color: #FFFFFF;
  }
  .tpl_bento_card--03.is_hoverable:hover .tpl_bento_hoverdesc {
    color: #f3f3f3;
  }
  .tpl_bento_card--03.is_hoverable:hover .tpl_bento_icon {
    background-color: #cfd4db;
  }
  .tpl_bento_card--04.is_hoverable:hover {
    background-color: #024779;
  }
  .tpl_bento_card--04.is_hoverable:hover .tpl_bento_icon {
    opacity: 0.2;
  }
  .tpl_bento_card--05.is_hoverable:hover {
    background-color: #017ec4;
  }
  .tpl_bento_card--05.is_hoverable:hover .tpl_bento_bg {
    opacity: 0;
  }
  .tpl_bento_card--05.is_hoverable:hover .tpl_bento_map {
    opacity: 1;
  }
  .tpl_bento_card--06.is_hoverable:hover {
    background-color: #024781;
  }
  .tpl_bento_card--06.is_hoverable:hover .tpl_bento_bg {
    opacity: 0;
  }
  .tpl_bento_card--06.is_hoverable:hover .tpl_bento_dot {
    opacity: 0;
  }
  .tpl_bento_card--06.is_hoverable:hover .tpl_bento_body--center {
    top: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
  }
}
.tpl_bento_card.is_hoverable.is_open .tpl_bento_stat {
  display: none;
}
.tpl_bento_card.is_hoverable.is_open .tpl_bento_hoverdesc {
  display: block;
}

.tpl_bento_card--02.is_hoverable.is_open {
  background-color: #0082c1;
}
.tpl_bento_card--02.is_hoverable.is_open .tpl_bento_icon {
  opacity: 0.2;
}

.tpl_bento_card--03.is_hoverable.is_open {
  background-color: #bac2cb;
}
.tpl_bento_card--03.is_hoverable.is_open .tpl_bento_title {
  color: #FFFFFF;
}
.tpl_bento_card--03.is_hoverable.is_open .tpl_bento_hoverdesc {
  color: #f3f3f3;
}
.tpl_bento_card--03.is_hoverable.is_open .tpl_bento_icon {
  background-color: #cfd4db;
}

.tpl_bento_card--04.is_hoverable.is_open {
  background-color: #024779;
}
.tpl_bento_card--04.is_hoverable.is_open .tpl_bento_icon {
  opacity: 0.2;
}

.tpl_bento_card--05.is_hoverable.is_open {
  background-color: #017ec4;
}
.tpl_bento_card--05.is_hoverable.is_open .tpl_bento_bg {
  opacity: 0;
}
.tpl_bento_card--05.is_hoverable.is_open .tpl_bento_map {
  opacity: 1;
}

.tpl_bento_card--06.is_hoverable.is_open {
  background-color: #024781;
}
.tpl_bento_card--06.is_hoverable.is_open .tpl_bento_bg {
  opacity: 0;
}
.tpl_bento_card--06.is_hoverable.is_open .tpl_bento_dot {
  opacity: 0;
}
.tpl_bento_card--06.is_hoverable.is_open .tpl_bento_body--center {
  top: 50%;
  bottom: auto;
  transform: translate(-50%, -50%);
}

html[lang=en] .tpl_bento_card.is_hoverable.is_open .tpl_bento_icon {
  opacity: 0;
}

@media screen and (min-width: 1025px) and (hover: hover) {
  html[lang=en] .tpl_bento_card.is_hoverable:hover .tpl_bento_icon {
    opacity: 0;
  }
}
.tpl_bento_body--center {
  top: auto;
  left: 50%;
  bottom: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  transform: translateX(-50%);
  align-items: center;
  text-align: center;
}
.tpl_bento_body--center .tpl_bento_value {
  justify-content: center;
}

.tpl_bento_dot {
  position: absolute;
  z-index: 1;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.3);
}
.tpl_bento_dot::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #00A3F1;
  border: 2px solid #FFFFFF;
}

.tpl_bento_dot--1 {
  left: max(201px * var(--base-ratio), 201 / var(--base-size) * var(--base-percent));
  top: max(250px * var(--base-ratio), 250 / var(--base-size) * var(--base-percent));
}

.tpl_bento_dot--2 {
  left: max(309px * var(--base-ratio), 309 / var(--base-size) * var(--base-percent));
  top: max(190px * var(--base-ratio), 190 / var(--base-size) * var(--base-percent));
}

.tpl_bento_dot--3 {
  left: max(162px * var(--base-ratio), 162 / var(--base-size) * var(--base-percent));
  top: max(119px * var(--base-ratio), 119 / var(--base-size) * var(--base-percent));
}

@media screen and (max-width: 1024px) {
  .tpl_solution {
    height: 100vh;
  }
  .tpl_solution_title {
    top: calc(50% - 283px);
  }
  .tpl_solution_viewport {
    top: calc(50% - 140px);
  }
  .tpl_bento {
    width: 1714px;
    height: 422px;
    margin-left: 40px;
  }
  .tpl_bento_card {
    border-radius: 8px;
  }
  .tpl_bento_body {
    top: 46px;
    left: 28px;
    gap: 16px;
  }
  .tpl_bento_desc {
    width: 569px;
    bottom: 28px;
  }
  .tpl_bento_card--01 {
    width: 678px;
    height: 422px;
  }
  .tpl_bento_card--02 {
    left: 690px;
    top: 0;
    width: 400px;
    height: 205px;
  }
  .tpl_bento_card--02 .tpl_bento_icon {
    left: 262px;
    top: 81px;
    width: 77px;
    height: 77px;
  }
  .tpl_bento_card--02 .tpl_bento_body {
    width: 344px;
    height: 131px;
  }
  .tpl_bento_card--03 {
    left: 1102px;
    top: 0;
    width: 320px;
    height: 205px;
  }
  .tpl_bento_card--03 .tpl_bento_icon {
    left: 228px;
    top: 94px;
    width: 64px;
    height: 64px;
  }
  .tpl_bento_card--03 .tpl_bento_body {
    width: 264px;
    height: 131px;
  }
  .tpl_bento_card--04 {
    left: 690px;
    top: 217px;
    width: 320px;
    height: 205px;
  }
  .tpl_bento_card--04 .tpl_bento_icon {
    left: 217px;
    top: 90px;
    width: 64px;
    height: 64px;
  }
  .tpl_bento_card--04 .tpl_bento_body {
    top: 39px;
    width: 264px;
    height: 138px;
  }
  .tpl_bento_card--05 {
    left: 1022px;
    top: 217px;
    width: 400px;
    height: 205px;
  }
  .tpl_bento_card--05 .tpl_bento_body {
    top: 39px;
    width: 344px;
    height: 138px;
  }
  .tpl_bento_card--05 .tpl_bento_stat {
    gap: 2px;
  }
  .tpl_bento_values {
    gap: 12px;
  }
  .tpl_bento_prefix {
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .tpl_bento_prefix {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .tpl_bento_divider {
    height: 28px;
  }
  .tpl_bento_card--06 {
    left: 1434px;
    top: 0;
    width: 280px;
    height: 422px;
  }
  .tpl_bento_body--center {
    top: auto;
    left: 50%;
    bottom: 34px;
    width: 80%;
  }
  .tpl_bento_dot {
    width: 18px;
    height: 18px;
  }
  .tpl_bento_dot::after {
    width: 9px;
    height: 9px;
  }
  .tpl_bento_dot--1 {
    left: 128px;
    top: 160px;
  }
  .tpl_bento_dot--2 {
    left: 197px;
    top: 121px;
  }
  .tpl_bento_dot--3 {
    left: 103px;
    top: 76px;
  }
}
@media screen and (max-width: 767px) {
  .tpl_solution {
    height: auto;
    overflow: visible;
    padding: 100px 20px;
  }
  .tpl_solution_title {
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    margin: 0 0 42px;
    font-size: 28px;
  }
  .tpl_solution_viewport {
    position: static;
    top: auto;
    left: auto;
    overflow: visible;
  }
  .tpl_bento {
    position: static;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    height: auto;
    margin-left: 0;
    transform: none;
    will-change: auto;
  }
  .tpl_bento_card {
    position: static;
    display: grid;
    grid-template: minmax(0, 1fr)/minmax(0, 1fr);
    width: 100%;
    transform: none;
    transition: none;
  }
  .tpl_bento_card > * {
    grid-area: 1/1;
  }
  .tpl_bento_card .tpl_card_more {
    position: static;
    justify-self: end;
    align-self: start;
    margin: 16px 16px 0 0;
  }
  .tpl_bento_bg,
  .tpl_bento_map {
    position: static;
    width: 100%;
    height: 100%;
  }
  .tpl_bento_card .tpl_bento_body {
    position: static;
    align-self: start;
    justify-self: start;
    width: auto;
    height: auto;
    margin: 46px 0 0 28px;
  }
  .tpl_bento_card--04 .tpl_bento_body,
  .tpl_bento_card--05 .tpl_bento_body {
    margin-top: 39px;
  }
  .tpl_bento_card--05 .tpl_bento_value {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }
  .tpl_bento_card--05 .tpl_bento_divider {
    height: 32px;
  }
  .tpl_bento_title {
    font-size: 20px;
  }
  .tpl_bento_desc {
    position: static;
    align-self: end;
    justify-self: center;
    width: 320px;
    margin-bottom: 20px;
    transform: none;
    font-size: 20px;
  }
  .tpl_bento_icon {
    position: static;
    align-self: start;
    justify-self: end;
  }
  .tpl_bento_card--02 .tpl_bento_icon {
    margin: 81px 24px 0 0;
  }
  .tpl_bento_card--03 .tpl_bento_icon {
    margin: 90px 26px 0 0;
    width: 72px;
    height: 72px;
  }
  .tpl_bento_card--04 .tpl_bento_icon {
    margin: 94px 30px 0 0;
  }
  .tpl_bento_dot {
    position: static;
    align-self: start;
    justify-self: start;
    display: grid;
    place-items: center;
  }
  .tpl_bento_dot::after {
    position: static;
    transform: none;
  }
  .tpl_bento_dot--1 {
    transform: translate(151px, 160px);
  }
  .tpl_bento_dot--2 {
    transform: translate(220px, 121px);
  }
  .tpl_bento_dot--3 {
    transform: translate(126px, 76px);
  }
  .tpl_bento_card .tpl_bento_body--center {
    position: static;
    align-self: end;
    justify-self: center;
    margin: 0 0 34px;
    transform: none;
  }
  .tpl_bento_hoverdesc {
    width: 287px;
  }
  .tpl_bento_card--05 .tpl_bento_hoverdesc {
    width: 287px;
  }
  .tpl_bento_card.is_hoverable.is_open:not(.tpl_bento_card--06) .tpl_bento_body {
    align-self: center;
    margin-top: 0;
  }
  .tpl_bento_card--06.is_hoverable.is_open .tpl_bento_body--center {
    align-self: center;
    margin-bottom: 0;
    transform: none;
  }
  .tpl_bento_card.is_hoverable.is_open .tpl_bento_icon {
    opacity: 0;
  }
}
.tpl_module {
  position: relative;
  overflow: hidden;
  background-color: #FFFFFF;
}

.tpl_module_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 113.75vw;
  z-index: 0;
  background: linear-gradient(180deg, #040a14 0%, #060e20 3.6%, #0a1531 7.1%, #0c1c3f 10.7%, #0a2144 14.3%, #0a264a 17.8%, #092c50 21.4%, #083255 25%, #06375b 28.5%, #053d65 32.1%, #054370 35.6%, #044a7b 39.2%, #034f86 42.8%, #025591 46.3%, #065c99 49.9%, #1968a1 53.5%, #387cad 57%, #6299bf 60.6%, #9abdd5 64.2%, #dde8f0 67.7%, #ffffff 71.3%);
}

.tpl_module_inner {
  position: relative;
  z-index: 1;
  width: 100%;
  padding-top: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}

.tpl_module_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_module_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_module_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_module_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
  margin-bottom: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
}

.tpl_module_stage {
  position: relative;
  width: 100%;
  height: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
}

.tpl_module_cards {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
}

.tpl_module_card--02 {
  transform: translateY(calc(max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) * -1));
}

.tpl_module_card {
  position: relative;
  flex-shrink: 0;
  width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
  height: max(580px * var(--base-ratio), 580 / var(--base-size) * var(--base-percent));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  box-shadow: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(73px * var(--base-ratio), 73 / var(--base-size) * var(--base-percent)) rgba(133, 148, 158, 0.28);
}

.tpl_module_card_inner {
  position: absolute;
  top: 0;
  left: 50%;
  width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
  height: 100%;
  transform: translateX(-50%);
}

.tpl_module_card_front {
  position: absolute;
  inset: 0;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: opacity 0.5s ease-in-out;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}

.tpl_module_card_back {
  position: relative;
  z-index: 1;
  height: 100%;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: opacity 0.5s ease-in-out;
  opacity: 0;
  background-color: #00A3F1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding-bottom: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
}

@media screen and (min-width: 1025px) and (hover: hover) {
  .tpl_module_card:hover .tpl_module_card_back {
    opacity: 1;
  }
}
.tpl_module_card.is_open .tpl_module_card_back {
  opacity: 1;
}

.tpl_card_more {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  width: 20px;
  height: 20px;
  background: url("../images/business/3pl_card_more.svg") no-repeat center/contain;
  pointer-events: none;
}

.is_open > .tpl_card_more {
  background-image: url("../images/business/3pl_card_close.svg");
}

@media screen and (min-width: 1025px) {
  .tpl_card_more {
    display: none;
  }
}
.tpl_module_card_bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tpl_module_card_video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

.tpl_module_card_video.is_ended {
  opacity: 0;
}

.tpl_module_card_front .tpl_module_card_title {
  position: relative;
  z-index: 1;
}

.tpl_module_card_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_module_card_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_module_card_title {
    font-size: var(--fs-h4-mob);
  }
}
.tpl_module_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}

.tpl_module_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_module_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_module_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}

.tpl_module_solution {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: max(1280px * var(--base-ratio), 1280 / var(--base-size) * var(--base-percent));
  height: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.tpl_module_solution_content {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.tpl_module_solution_thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tpl_module_solution_video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

.tpl_module_solution_video.is_ended {
  opacity: 0;
}

.tpl_module_solution_dim {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.2);
}

.tpl_module_solution_logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
  height: auto;
}

@media screen and (max-width: 1024px) {
  .tpl_module_inner {
    padding-top: 140px;
  }
  .tpl_module_title {
    margin-bottom: 88px;
    padding: 0 40px;
  }
  .tpl_module_cards {
    gap: 20px;
    margin-bottom: 80px;
  }
  .tpl_module_card {
    width: 216px;
    height: 273px;
    border-radius: 8.6px;
  }
  .tpl_module_card--02 {
    transform: translateY(-28px);
  }
  .tpl_module_card_inner {
    width: 216px;
  }
  .tpl_module_card_front,
  .tpl_module_card_back {
    border-radius: 8.6px;
  }
  .tpl_module_card_front {
    padding: 16px;
  }
  .tpl_module_card_back {
    padding: 16px;
    justify-content: flex-start;
  }
  html[lang=en] .tpl_module_card_back .tpl_module_card_title {
    font-size: 18px;
  }
  html[lang=en] .tpl_module_card_back .tpl_module_card_desc {
    font-size: 14px;
  }
  .tpl_module_solution {
    width: 688px;
    height: 387px;
    border-radius: 8.6px;
  }
  .tpl_module_solution_logo {
    width: 118px;
  }
}
@media screen and (max-width: 767px) {
  .tpl_module {
    height: auto;
    display: block;
    padding: 100px 0;
    background: linear-gradient(180deg, #040a14 0%, #060e20 3.6%, #0a1531 7.1%, #0c1c3f 10.7%, #0a2144 14.3%, #0a264a 17.8%, #092c50 21.4%, #083255 25%, #06375b 28.5%, #053d65 32.1%, #054370 35.6%, #044a7b 39.2%, #034f86 42.8%, #025591 46.3%, #065c99 49.9%, #1968a1 53.5%, #387cad 57%, #6299bf 60.6%, #9abdd5 64.2%, #dde8f0 67.7%, #ffffff 71.3%);
  }
  .tpl_module_bg {
    display: none;
  }
  .tpl_module_title {
    font-size: 28px;
    margin-bottom: 48px;
    padding: 0 20px;
  }
  .tpl_module_inner {
    padding-top: 0;
  }
  .tpl_module_cards {
    flex-direction: column;
    gap: 12px;
    margin: 0 auto;
  }
  .tpl_module_card {
    width: 335px;
    height: 220px;
  }
  .tpl_module_card--02 {
    transform: none;
  }
  .tpl_module_card_inner {
    width: 335px;
  }
  .tpl_module_card_title {
    font-size: 20px;
  }
  .tpl_module_card_front {
    padding: 16px 20px;
  }
  .tpl_module_card_back {
    justify-content: flex-end;
    gap: 10px;
    padding: 20px;
    padding-bottom: 24px;
  }
  html[lang=en] .tpl_module_card_back .tpl_module_card_title {
    font-size: 20px;
  }
  html[lang=en] .tpl_module_card_back .tpl_module_card_desc {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  html[lang=en] .tpl_module_card_back .tpl_module_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_module_solution {
    width: 335px;
    height: 188px;
    border-radius: 8px;
  }
  .tpl_module_solution_content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: none;
  }
  .tpl_module_solution_logo {
    width: 58px;
  }
}
.tpl_process {
  position: relative;
  height: 100vh;
  overflow: hidden;
  background-color: #e8f3fe;
}

.tpl_process_frame {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  aspect-ratio: 1920/1080;
}

.tpl_process_head {
  position: absolute;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  left: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  z-index: 3;
}

.tpl_process_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_process_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_process_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_process_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.tpl_process_sub {
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_process_sub {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_process_sub {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}

.tpl_process_viewport {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: flex-end;
}

.tpl_process_track {
  display: flex;
  gap: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent));
  padding-left: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  will-change: transform;
}

.tpl_process_panel {
  position: relative;
  flex-shrink: 0;
  width: max(1560px * var(--base-ratio), 1560 / var(--base-size) * var(--base-percent));
  transform: translateY(max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent)));
}

.tpl_process_img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}

.tpl_process_callout {
  position: absolute;
  top: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  z-index: 2;
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background-color: #025997;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) 0;
  opacity: 0;
}
.tpl_process_callout::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 0;
  height: 0;
  border-left: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) solid #025997;
  border-bottom: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) solid transparent;
}

.tpl_process_panel--01 .tpl_process_callout {
  left: max(1135px * var(--base-ratio), 1135 / var(--base-size) * var(--base-percent));
}

.tpl_process_panel--02 .tpl_process_callout {
  left: max(1152px * var(--base-ratio), 1152 / var(--base-size) * var(--base-percent));
}

.tpl_process_panel--03 .tpl_process_callout {
  left: max(1152px * var(--base-ratio), 1152 / var(--base-size) * var(--base-percent));
}

.tpl_process_panel--04 .tpl_process_callout {
  left: max(1185px * var(--base-ratio), 1185 / var(--base-size) * var(--base-percent));
}

.tpl_process_num {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #e8f3fe;
  color: #025997;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_process_num {
    font-size: 16px;
  }
}
.tpl_process_num {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
}

.tpl_process_callout_txt {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
}

.tpl_process_callout_title {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_process_callout_title {
    font-size: 16px;
  }
}
.tpl_process_callout_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #FFFFFF;
}

.tpl_process_callout_desc {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_process_callout_desc {
    font-size: 14px;
  }
}
.tpl_process_callout_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #e8f3fe;
}

.tpl_process_fade {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 2;
  width: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  pointer-events: none;
}

.tpl_process_fade--left {
  left: 0;
  background: linear-gradient(90deg, #e8f3fe 0%, rgba(232, 243, 254, 0) 100%);
}

.tpl_process_fade--right {
  right: 0;
  background: linear-gradient(270deg, #e8f3fe 0%, rgba(232, 243, 254, 0) 100%);
}

.tpl_process_callout_viewport {
  display: none;
}

@media screen and (max-width: 1024px) {
  .tpl_process_frame {
    top: 0;
    transform: none;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
  }
  .tpl_process_head {
    top: 120px;
    left: 0;
    width: 100%;
    padding: 0 40px;
  }
  .tpl_process_sub {
    margin-top: 20px;
  }
  .tpl_process_viewport {
    align-items: stretch;
  }
  .tpl_process_track {
    gap: 0;
    padding-left: 0;
  }
  .tpl_process_panel {
    width: 100vw;
    height: 100%;
    transform: none;
    overflow: hidden;
  }
  .tpl_process_pic {
    display: contents;
  }
  .tpl_process_img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 120%;
    max-width: none;
    height: auto;
    border-radius: 0;
  }
  .tpl_process_callout,
  .tpl_process_panel--01 .tpl_process_callout,
  .tpl_process_panel--02 .tpl_process_callout,
  .tpl_process_panel--03 .tpl_process_callout,
  .tpl_process_panel--04 .tpl_process_callout {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: auto;
    min-height: 164px;
    align-items: flex-start;
    gap: 12px;
    padding: 32px 40px;
    border-radius: 0;
    opacity: 1;
    transform: none;
  }
  .tpl_process_callout::after {
    display: none;
  }
  .tpl_process_callout_viewport {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    pointer-events: none;
  }
  .tpl_process_callout_track {
    display: flex;
    height: 100%;
    will-change: transform;
  }
  .tpl_process_callout_cell {
    position: relative;
    flex-shrink: 0;
    width: 100vw;
    height: 100%;
  }
  .tpl_process_num {
    font-size: 18px;
  }
  .tpl_process_callout_txt {
    width: auto;
    flex: 1;
  }
  .tpl_process_callout_title {
    font-size: 18px;
  }
  .tpl_process_callout_desc {
    font-size: 16px;
  }
  .tpl_process_fade {
    display: block;
    width: 32px;
  }
}
@media screen and (max-width: 767px) {
  .tpl_process_head {
    top: 60px;
    left: 0;
    width: 100%;
    padding: 0 20px;
  }
  .tpl_process_title {
    font-size: 28px;
  }
  .tpl_process_callout,
  .tpl_process_panel--01 .tpl_process_callout,
  .tpl_process_panel--02 .tpl_process_callout,
  .tpl_process_panel--03 .tpl_process_callout,
  .tpl_process_panel--04 .tpl_process_callout {
    min-height: 171px;
    padding: 24px 20px;
  }
  html[lang=en] .tpl_process_panel .tpl_process_callout,
  html[lang=en] .tpl_process_callout_cell .tpl_process_callout {
    min-height: 221px;
  }
}
.tpl_merit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent)) 0;
}

.tpl_merit_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_merit_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_merit_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_merit_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
}

.tpl_merit_cards {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
}

.tpl_merit_card {
  position: relative;
  flex-shrink: 0;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: max(520px * var(--base-ratio), 520 / var(--base-size) * var(--base-percent));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  transition: width 0.5s ease;
}

.tpl_merit_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: max(1064px * var(--base-ratio), 1064 / var(--base-size) * var(--base-percent));
  height: 100%;
  object-fit: cover;
}

.tpl_merit_card_eng {
  font-size: round(down, max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)), 1px);
  font-weight: 600;
  line-height: 1.3;
  font-family: "Bai Jamjuree", "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #FFFFFF;
}

.tpl_merit_card_eng_hyphen {
  display: none;
}

.tpl_merit_card_collapsed {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s;
}

.tpl_merit_card_expanded {
  position: absolute;
  left: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  bottom: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  z-index: 1;
  width: max(520px * var(--base-ratio), 520 / var(--base-size) * var(--base-percent));
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s;
}

.tpl_merit_card_title {
  margin-top: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_merit_card_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_merit_card_title {
    font-size: var(--fs-h3-mob);
  }
}
.tpl_merit_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}

.tpl_merit_card_desc {
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_merit_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_merit_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #e7e7e9;
}

.tpl_merit_card.is_active {
  width: max(1064px * var(--base-ratio), 1064 / var(--base-size) * var(--base-percent));
}
.tpl_merit_card.is_active .tpl_merit_card_collapsed {
  opacity: 0;
  pointer-events: none;
}
.tpl_merit_card.is_active .tpl_merit_card_expanded {
  opacity: 1;
  visibility: visible;
}

@media screen and (max-width: 1024px) {
  .tpl_merit {
    gap: 60px;
    padding: 120px 0;
  }
  .tpl_merit_title {
    width: 100%;
    padding: 0 40px;
  }
  .tpl_merit_cards {
    width: 688px;
    gap: 12px;
  }
  .tpl_merit_card {
    width: 92px;
    height: 400px;
    border-radius: 12px;
  }
  .tpl_merit_card_bg {
    width: 480px;
  }
  .tpl_merit_card_eng {
    font-size: 18px;
  }
  .tpl_merit_card_collapsed {
    width: 92px;
  }
  .tpl_merit_card_collapsed .tpl_merit_card_eng {
    text-align: center;
    word-break: break-word;
  }
  .tpl_merit_card_collapsed .tpl_merit_card_eng_hyphen {
    display: inline;
  }
  .tpl_merit_card_expanded {
    left: 28px;
    bottom: 36px;
    width: 432px;
  }
  .tpl_merit_card_desc {
    margin-top: 16px;
  }
  .tpl_merit_card.is_active {
    width: 480px;
  }
}
@media screen and (max-width: 767px) {
  .tpl_merit {
    gap: 60px;
    padding: 100px 0;
  }
  .tpl_merit_title {
    width: 100%;
    padding: 0 20px;
    font-size: 28px;
  }
  .tpl_merit_cards {
    flex-direction: column;
    width: 335px;
    gap: 12px;
  }
  .tpl_merit_card {
    width: 335px;
    height: 400px;
    cursor: default;
  }
  .tpl_merit_card.is_active {
    width: 335px;
  }
  .tpl_merit_card_bg {
    width: 818px;
    left: 50%;
    transform: translateX(-50%);
  }
  .tpl_merit_card_collapsed {
    display: none;
  }
  .tpl_merit_card_expanded {
    left: 28px;
    bottom: 36px;
    width: 288px;
    opacity: 1;
    visibility: visible;
  }
}
.tpl_outro {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.tpl_outro_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.tpl_outro_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_outro_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_outro_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_outro_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
}

.tpl_outro_desc {
  margin-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_outro_desc {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_outro_desc {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_outro_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
}

.tpl_outro_line {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(179px * var(--base-ratio), 179 / var(--base-size) * var(--base-percent));
  background-color: #D1D2D4;
}

@media screen and (max-width: 1024px) {
  .tpl_outro_desc {
    margin-top: 22px;
  }
  .tpl_outro_line {
    margin-top: 48px;
  }
}
.tpl_cta {
  overflow: hidden;
}

.tpl_cta_head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) auto 0;
}

.tpl_cta_txt {
  width: max(900px * var(--base-ratio), 900 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}

.tpl_cta_title {
  width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_cta_title {
    font-size: var(--fs-h2-mob);
  }
}
.tpl_cta_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.tpl_cta_desc {
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_desc {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_cta_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}

.tpl_cta_info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}

.tpl_cta_info_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_info_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_cta_info_label {
    font-size: var(--fs-h5-mob);
  }
}
.tpl_cta_info_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #161D27;
}

.tpl_cta_values {
  display: flex;
  align-items: flex-end;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}

.tpl_cta_value {
  display: flex;
  align-items: flex-end;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.tpl_cta_value--02 {
  gap: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}

.tpl_cta_prefix {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_prefix {
    font-size: var(--fs-p1-tab);
  }
}
.tpl_cta_prefix {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #161D27;
}

.tpl_cta_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_num {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_cta_num {
    font-size: var(--fs-d3-mob);
  }
}
.tpl_cta_num {
  letter-spacing: -0.03em;
  font-weight: 600;
  line-height: 1;
  color: #00A3F1;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.tpl_cta_unit {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .tpl_cta_unit {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .tpl_cta_unit {
    font-size: var(--fs-h5-mob);
  }
}
.tpl_cta_unit {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
  white-space: nowrap;
}

html[lang=en] .tpl_cta_prefix,
html[lang=en] .tpl_cta_unit {
  line-height: 1.2;
}

.tpl_cta_divider {
  align-self: center;
  width: 1px;
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  background-color: #D1D2D4;
}

.tpl_cta_marquee {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}

.tpl_cta_row {
  display: flex;
  width: max-content;
  animation: steelMarquee 60s linear infinite;
}

.tpl_cta_row--reverse {
  animation-direction: reverse;
}

.tpl_cta_set {
  display: flex;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  padding-right: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.tpl_cta_set img {
  height: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  width: auto;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.tpl .bottom_nav {
  margin-top: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
}

@media screen and (max-width: 1024px) {
  .tpl_outro_inner {
    width: 100%;
    padding: 0 40px;
  }
  .tpl_cta_head {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    width: 100%;
    margin-top: 80px;
  }
  .tpl_cta_txt {
    width: 100%;
    text-align: center;
  }
  .tpl_cta_title {
    width: 100%;
  }
  .tpl_cta_desc {
    margin-top: 20px;
  }
  .tpl_cta_info {
    align-items: center;
    gap: 4px;
  }
  .tpl_cta_values {
    gap: 22px;
  }
  .tpl_cta_prefix {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .tpl_cta_prefix {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .tpl_cta_prefix {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 1024px) {
  .tpl_cta_divider {
    height: 40px;
  }
  .tpl_cta_marquee {
    gap: 20px;
  }
  .tpl_cta_set {
    gap: 20px;
    padding-right: 20px;
  }
  .tpl_cta_set img {
    height: 270px;
  }
  .tpl .bottom_nav {
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  .tpl_outro_inner {
    width: 100%;
    padding: 0 20px;
  }
  .tpl_outro_title,
  .tpl_outro_desc {
    font-size: 28px;
  }
  .tpl_cta_head {
    width: 100%;
  }
  .tpl_cta_title {
    font-size: 28px;
  }
  .tpl_cta_info {
    align-items: center;
    gap: 4px;
  }
  .tpl_cta_values {
    flex-direction: column;
    width: 255px;
    gap: 16px;
  }
  html[lang=en] .tpl_cta_values {
    width: 302px;
  }
  .tpl_cta_value {
    width: 100%;
    justify-content: flex-start;
  }
  .tpl_cta_num {
    margin-left: auto;
    text-align: right;
  }
  .tpl_cta_divider {
    width: 100%;
    height: 1px;
    align-self: center;
  }
  .tpl_cta_marquee {
    gap: 12px;
  }
  .tpl_cta_set {
    gap: 12px;
    padding-right: 12px;
  }
  .tpl_cta_set img {
    height: 174px;
  }
  .tpl .bottom_nav {
    margin-top: 100px;
  }
}
.steel_numbers {
  position: relative;
  display: flex;
  align-items: flex-start;
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.steel_numbers .steel_numbers_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_numbers .steel_numbers_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_numbers .steel_numbers_title {
    font-size: var(--fs-h2-mob);
  }
}
.steel_numbers .steel_numbers_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
}
.steel_numbers .steel_numbers_cards {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  gap: max(21px * var(--base-ratio), 21 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_numbers {
    flex-direction: column;
    height: auto;
    margin-top: 80px;
    gap: 60px;
  }
  .steel_numbers .steel_numbers_cards {
    position: static;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .steel_numbers {
    gap: 40px;
  }
  .steel_numbers .steel_numbers_cards {
    flex-direction: column;
    width: 100%;
  }
}

.steel_num_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: max(276px * var(--base-ratio), 276 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  position: relative;
}
@media screen and (max-width: 1024px) {
  .steel_num_card {
    width: 216px;
    height: 160px;
    padding: 24px 20px 28px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .steel_num_card {
    width: 100%;
  }
}

.steel_num_head {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_num_head {
    gap: 4px;
  }
}

.steel_num_top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_num_top {
    padding-left: 0;
    width: 100%;
    gap: 20px;
  }
}

.steel_num_label_wrap {
  display: flex;
  align-items: flex-end;
}

.steel_num_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_num_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_num_label {
    font-size: var(--fs-h5-mob);
  }
}
.steel_num_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}

.steel_num_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .steel_num_icon {
    width: 36px;
    height: 36px;
  }
}

.steel_num_sub {
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_num_sub {
    font-size: 12px;
  }
}
.steel_num_sub {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #818286;
}
@media screen and (max-width: 1024px) {
  .steel_num_sub {
    padding-left: 0;
  }
}

.steel_num_bottom {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_num_bottom {
    gap: 4px;
  }
}

.steel_num_value {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_num_value {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_num_value {
    font-size: var(--fs-d3-mob);
  }
}
.steel_num_value {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #025997;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.steel_num_unit {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
}
.steel_num_unit span {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_num_unit span {
    font-size: 16px;
  }
}
.steel_num_unit span {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .steel_num_unit {
    padding-bottom: 2px;
  }
}

.steel_divider {
  height: 0;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  border-top: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .steel_divider {
    margin-top: 120px;
  }
}

.steel_accordion_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding-bottom: max(201px * var(--base-ratio), 201 / var(--base-size) * var(--base-percent));
}
.steel_accordion_section .steel_accordion_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_accordion_section .steel_accordion_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_accordion_section .steel_accordion_title {
    font-size: var(--fs-h2-mob);
  }
}
.steel_accordion_section .steel_accordion_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_section {
    gap: 72px;
    padding-top: 120px;
  }
}

.steel_accordion_wrap {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_wrap {
    flex-direction: column;
    gap: 16px;
  }
}

.steel_accordion {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(574px * var(--base-ratio), 574 / var(--base-size) * var(--base-percent));
  height: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background-color: #F3F3F3;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_accordion {
    width: 100%;
    height: auto;
    padding: 32px 24px 40px;
    gap: 20px;
    border-radius: 12px;
  }
}

.steel_accordion_item .steel_accordion_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(444px * var(--base-ratio), 444 / var(--base-size) * var(--base-percent));
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_header {
    width: 100%;
    gap: 24px;
  }
}
.steel_accordion_item .steel_accordion_name {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_name {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_accordion_item .steel_accordion_name {
    font-size: var(--fs-h5-mob);
  }
}
.steel_accordion_item .steel_accordion_name {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.steel_accordion_item .steel_accordion_arrow {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_arrow {
    width: 24px;
    height: 24px;
  }
}
.steel_accordion_item .steel_accordion_body {
  position: relative;
  overflow: hidden;
  transition: height 0.3s ease;
}
.steel_accordion_item:not(.is_active) .steel_accordion_body {
  height: 0 !important;
}
.steel_accordion_item.is_active .steel_accordion_arrow {
  transform: rotate(180deg);
}
.steel_accordion_item.is_active .steel_accordion_name {
  color: #025997;
}
.steel_accordion_item.is_active .steel_accordion_body {
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item.is_active .steel_accordion_body {
    margin-top: 12px;
  }
}
.steel_accordion_item .steel_accordion_body {
  display: flex;
  flex-direction: column;
}
.steel_accordion_item .steel_accordion_scroll {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}
.steel_accordion_item .steel_accordion_scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_scroll {
    overflow-y: visible;
    gap: 8px;
  }
}
.steel_accordion_item .steel_accordion_body.is_scroll .steel_accordion_scroll {
  padding-right: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.steel_accordion_item .steel_accordion_body.is_scroll::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3);
  pointer-events: none;
  opacity: 1;
  transition: opacity 0.2s ease;
}
.steel_accordion_item .steel_accordion_body.is_scroll.is_scroll_end::after {
  opacity: 0;
}
.steel_accordion_item .steel_accordion_scrollbar {
  position: absolute;
  top: 0;
  right: 0;
  width: 2px;
  height: 100%;
  background: #F3F3F3;
  border-radius: 999px;
  visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_scrollbar {
    display: none;
  }
}
.steel_accordion_item .steel_accordion_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #818286;
  border-radius: 999px;
  cursor: grab;
  touch-action: none;
}
.steel_accordion_item .steel_accordion_scrollbar_thumb:active {
  cursor: grabbing;
}
.steel_accordion_item .steel_accordion_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_desc {
    font-size: var(--fs-p1-tab);
  }
}
.steel_accordion_item .steel_accordion_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #444444;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_item .steel_accordion_desc br {
    display: none;
  }
}

.steel_accordion_line {
  width: 100%;
  height: 0;
  border-top: 1px solid #DDDDDD;
}

.steel_accordion_img {
  position: relative;
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  height: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.steel_accordion_img picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.4s ease;
}
.steel_accordion_img picture.is_active {
  opacity: 1;
}
.steel_accordion_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .steel_accordion_img {
    order: -1;
    width: 100%;
    height: 426px;
    border-radius: 12px;
    overflow: hidden;
  }
}
@media screen and (max-width: 767px) {
  .steel_accordion_img {
    height: auto;
    aspect-ratio: 335/208;
  }
}

.steel_process {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
}

.steel_process_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.steel_process_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.steel_process_video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

.steel_process_txt {
  position: absolute;
  left: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  width: max(462px * var(--base-ratio), 462 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.steel_process_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_process_title {
    font-size: var(--fs-h2-mob);
  }
}
.steel_process_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.steel_process_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_desc {
    font-size: var(--fs-p1-tab);
  }
}
.steel_process_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}

.steel_process_panel {
  position: absolute;
  right: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  top: 50%;
  transform: translateY(-50%);
  width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  background: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.steel_process_ui {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  padding: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}

.steel_process_tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-radius: 999px;
}

.steel_process_tab_item {
  flex: 1;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_tab_item {
    font-size: var(--fs-p1-tab);
  }
}
.steel_process_tab_item {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
  cursor: pointer;
  padding: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.steel_process_tab_item.is_active {
  background: #025997;
  border-radius: 999px;
  color: #FFFFFF;
}

.steel_process_conts {
  display: none;
  flex-direction: column;
  align-self: stretch;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding-left: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.steel_process_conts.is_active {
  display: flex;
}

.steel_process_pc_note {
  display: none;
}

@media screen and (min-width: 1025px) {
  .steel_process_pc_note {
    display: block;
    align-self: stretch;
    padding: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
    background: #F3F3F3;
    border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
    font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
    color: #818286;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1024px) {
  .steel_process_pc_note {
    font-size: 14px;
  }
}
.steel_process_conts_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_conts_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_process_conts_title {
    font-size: var(--fs-h5-mob);
  }
}
.steel_process_conts_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #025997;
}

.steel_process_steps {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  width: 100%;
}

.steel_process_step {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  cursor: pointer;
  position: relative;
}

.steel_process_step::before,
.steel_process_step::after {
  content: "";
  position: absolute;
  left: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
  width: 0;
  border-left: 2px dashed #D1D2D4;
}

.steel_process_step::before {
  top: 0;
  bottom: 50%;
}

.steel_process_step::after {
  top: 50%;
  bottom: calc(max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) * -1);
}

.steel_process_step:first-child::before,
.steel_process_step:last-child::after {
  display: none;
}

.steel_process_num {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_num {
    font-size: 16px;
  }
}
.steel_process_num {
  letter-spacing: -0.02em;
  font-weight: 600;
  background: #F3F3F3;
  color: #999999;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.steel_process_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_label {
    font-size: var(--fs-p1-tab);
  }
}
.steel_process_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #BCBDC1;
  flex: 1;
  min-width: 0;
  word-break: keep-all;
}

.steel_process_step.is_done .steel_process_num {
  background: #161D27;
  color: #FFFFFF;
}
.steel_process_step.is_done .steel_process_label {
  color: #161D27;
}

.steel_process_step.is_active .steel_process_num {
  background: #025997;
  color: #FFFFFF;
}
.steel_process_step.is_active .steel_process_label {
  color: #161D27;
}

.steel_process_bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  background: #025997;
  border-radius: 0 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.steel_process_arrow {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}
.steel_process_arrow.is_prev {
  transform: rotate(180deg);
}
.steel_process_arrow.is_disabled {
  opacity: 0.2;
  pointer-events: none;
}
.steel_process_arrow img {
  width: 100%;
  height: 100%;
}

.steel_process_tooltip {
  display: none;
  position: absolute;
  left: max(304px * var(--base-ratio), 304 / var(--base-size) * var(--base-percent));
  top: max(638px * var(--base-ratio), 638 / var(--base-size) * var(--base-percent));
  width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  flex-direction: column;
  align-items: center;
}

.steel_process_tooltip_box {
  align-self: stretch;
  background: rgba(0, 0, 0, 0.8);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.steel_process_tooltip_box p {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_tooltip_box p {
    font-size: 14px;
  }
}
.steel_process_tooltip_box p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #FFFFFF;
  white-space: pre-line;
}

.steel_process_tooltip_arrow {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.8);
}

.steel_process_spot {
  display: none;
  position: absolute;
  left: max(386px * var(--base-ratio), 386 / var(--base-size) * var(--base-percent));
  top: max(751px * var(--base-ratio), 751 / var(--base-size) * var(--base-percent));
  align-items: center;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
}

.steel_process_dot {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  position: relative;
  box-sizing: border-box;
}
.steel_process_dot::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #00A3F1;
  opacity: 0.3;
  animation: dotpulse 1.5s ease-out infinite;
}
.steel_process_dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #00A3F1;
  border: 2px solid #FFFFFF;
  box-sizing: border-box;
}

.steel_process_spot_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_process_spot_label {
    font-size: 16px;
  }
}
.steel_process_spot_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  display: inline-flex;
  align-items: center;
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: rgba(0, 0, 0, 0.8);
  border-radius: 999px;
  color: #FFFFFF;
}

.steel_process_spot.is_marker {
  display: inline-flex;
  position: static;
  left: auto;
  top: auto;
  pointer-events: auto;
  white-space: nowrap;
}

.steel_process_tooltip.is_marker {
  display: flex;
  position: static;
  left: auto;
  top: auto;
}

.steel_process_marker {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  pointer-events: auto;
}

.fm_process_marker_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
}
.fm_process_marker_overlay .steel_process_marker.is_marker {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.fm_process_marker_overlay .steel_process_marker.is_marker.is_visible {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
@media screen and (max-width: 1024px) {
  .fm_process_marker_overlay {
    display: none;
  }
}

.steel_process.is_intro .fm_process_marker_overlay .steel_process_marker.is_marker.is_visible {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.steel_process_overlay,
.steel_process_select,
.steel_process_overlay_panel,
.steel_process_note,
.steel_process_info,
.steel_process_bar,
.steel_process_menu {
  display: none;
}

@media screen and (max-width: 1024px) {
  .steel_process_txt {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: max-content;
    max-width: 100%;
    align-items: center;
    text-align: center;
    gap: 20px;
    z-index: 6;
  }
  .steel_process_bg {
    height: calc(100% - 220px);
  }
  .steel_process_panel {
    display: none;
  }
  .steel_process_spot {
    left: 50%;
    transform: translateX(-50%);
    top: 41%;
  }
  .steel_process_overlay {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #F3F3F3;
    z-index: 5;
  }
  .steel_process_select {
    display: block;
    position: absolute;
    top: 20px;
    left: 40px;
    width: 140px;
    z-index: 10;
    opacity: 0;
  }
  .steel_process_overlay_panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 60px;
    z-index: 10;
  }
  .steel_process_note {
    display: block;
    align-self: flex-end;
    width: 728px;
    margin-right: 20px;
    text-align: right;
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
    color: #6D6E72;
    opacity: 0;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_note {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    min-height: 160px;
    padding: 24px 40px;
    background: #FFFFFF;
    opacity: 0;
  }
  .steel_process_info_head {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .steel_process_info_num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #025997;
    color: #FFFFFF;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 600;
    flex-shrink: 0;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_info_num {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_info_name {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    color: #161D27;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_info_name {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_info_desc {
    padding-left: 36px;
    max-width: 612px;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
    color: #6D6E72;
    white-space: pre-line;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_info_desc {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_bar {
    display: flex;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    padding: 0 20px 0 20px;
    background: #025997;
    z-index: 10;
    opacity: 0;
  }
  .steel_process_bar_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    padding-left: 48px;
  }
  .steel_process_bar_arrow {
    width: 48px;
    height: 48px;
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
  }
  .steel_process_bar_arrow.is_prev {
    transform: rotate(180deg);
  }
  .steel_process_bar_arrow.is_disabled {
    opacity: 0.2;
    pointer-events: none;
  }
  .steel_process_bar_arrow img {
    width: 100%;
    height: 100%;
  }
  .steel_process_bar_name {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    color: #FFFFFF;
    text-align: center;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_bar_name {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_bar_menu {
    width: 48px;
    height: 48px;
    border: none;
    background: none;
    border-radius: 999px;
    padding: 0;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
  }
  .steel_process_bar_menu span {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #FFFFFF;
    opacity: 0.8;
  }
  .steel_process_menu {
    display: none;
    position: absolute;
    bottom: 60px;
    left: 0;
    width: 100%;
    background: #FFFFFF;
    z-index: 11;
    padding: 24px 0 24px 40px;
    flex-direction: column;
    gap: 16px;
  }
  .steel_process_menu.is_open {
    display: flex;
  }
  .steel_process_menu_close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
  }
  .steel_process_menu_list {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .steel_process_menu_list.is_hidden {
    display: none;
  }
  .steel_process_menu_item {
    display: flex;
    align-items: center;
    gap: 16px;
    cursor: pointer;
  }
  .steel_process_menu_num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F3F3F3;
    color: #999999;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 600;
    flex-shrink: 0;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_menu_num {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_menu_label {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 600;
    line-height: 1.3;
    color: #BCBDC1;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_process_menu_label {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .steel_process_menu_item.is_active .steel_process_menu_num {
    background: #025997;
    color: #FFFFFF;
  }
  .steel_process_menu_item.is_active .steel_process_menu_label {
    font-weight: 700;
    color: #161D27;
  }
}
@media screen and (max-width: 767px) {
  .steel_process_select {
    left: 20px;
  }
  .steel_process_overlay_panel {
    gap: 12px;
  }
  .steel_process_note {
    align-self: stretch;
    width: auto;
    margin-right: 0;
    padding: 0 16px;
  }
  .steel_process_info {
    padding: 24px 20px 20px;
  }
  .steel_process_info_desc {
    max-width: none;
  }
  .steel_process_bar {
    padding: 0;
  }
  .steel_process_bar_inner {
    padding-left: 32px;
  }
  .steel_process_menu {
    padding-left: 32px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .steel_raw .steel_cap_card--03 .steel_cap_card_title {
    font-size: 22px;
  }
}

@media screen and (max-width: 767px) {
  html[lang=en] .cts .steel_cap_card--01 .steel_cap_card_title {
    font-size: 22px;
  }
  html[lang=en] .cts .steel_cap_card--01 .steel_cap_card_desc {
    font-size: 15px;
  }
}

.steel_capability {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.steel_capability .steel_capability_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_capability .steel_capability_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_capability .steel_capability_title {
    font-size: var(--fs-h2-mob);
  }
}
.steel_capability .steel_capability_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  width: max(1600px * var(--base-ratio), 1600 / var(--base-size) * var(--base-percent));
  color: #000000;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .steel_capability {
    gap: 70px;
    margin-top: 120px;
  }
  .steel_capability .steel_capability_title {
    width: calc(100vw - 80px);
  }
}
@media screen and (max-width: 767px) {
  .steel_capability {
    gap: 56px;
  }
  .steel_capability .steel_capability_title {
    width: calc(100vw - 40px);
  }
}

.steel_capability_cards {
  display: grid;
  width: 100%;
}
.steel_capability_cards > .steel_cap_card {
  grid-row: 1;
  grid-column: 1;
}

.steel_cap_card {
  position: relative;
  width: 100%;
  height: max(520px * var(--base-ratio), 520 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.steel_cap_card .steel_cap_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.steel_cap_card .steel_cap_card_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.steel_cap_card .steel_cap_card_conts {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.steel_cap_card .steel_cap_card_inner {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.steel_cap_card .steel_cap_card_icon {
  width: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  height: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
}
.steel_cap_card .steel_cap_card_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_cap_card .steel_cap_card_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_cap_card .steel_cap_card_title {
    font-size: var(--fs-h3-mob);
  }
}
.steel_cap_card .steel_cap_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.steel_cap_card .steel_cap_card_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_cap_card .steel_cap_card_desc {
    font-size: 16px;
  }
}
.steel_cap_card .steel_cap_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .steel_cap_card {
    height: 520px;
    border-radius: 12px;
  }
  .steel_cap_card .steel_cap_card_conts {
    padding: 0 24px 30px;
  }
  .steel_cap_card .steel_cap_card_inner {
    gap: 16px;
  }
  .steel_cap_card .steel_cap_card_icon {
    width: 56px;
    height: 56px;
  }
}

.steel_map {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.steel_map .steel_map_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.steel_map .steel_map_bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.steel_map .steel_map_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.steel_map .steel_map_bg .steel_map_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.steel_map .steel_map_bg .steel_map_line svg {
  width: 100%;
  height: 100%;
}
.steel_map .steel_map_spots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.steel_map .steel_map_spot {
  position: absolute;
  opacity: 0;
}
.steel_map .steel_map_spot.spot_europe {
  left: max(244px * var(--base-ratio), 244 / var(--base-size) * var(--base-percent));
  top: max(367px * var(--base-ratio), 367 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.steel_map .steel_map_spot.spot_middle_east {
  left: max(409px * var(--base-ratio), 409 / var(--base-size) * var(--base-percent));
  top: max(453px * var(--base-ratio), 453 / var(--base-size) * var(--base-percent));
  width: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
  height: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
}
.steel_map .steel_map_spot.spot_china {
  left: max(609px * var(--base-ratio), 609 / var(--base-size) * var(--base-percent));
  top: max(487px * var(--base-ratio), 487 / var(--base-size) * var(--base-percent));
  width: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
  height: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
}
.steel_map .steel_map_spot.spot_australia {
  left: max(714px * var(--base-ratio), 714 / var(--base-size) * var(--base-percent));
  top: max(802px * var(--base-ratio), 802 / var(--base-size) * var(--base-percent));
  width: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
  height: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
}
.steel_map .steel_map_spot.spot_japan {
  left: max(854px * var(--base-ratio), 854 / var(--base-size) * var(--base-percent));
  top: max(481px * var(--base-ratio), 481 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.steel_map .steel_map_spot.spot_americas {
  left: max(1284px * var(--base-ratio), 1284 / var(--base-size) * var(--base-percent));
  top: max(429px * var(--base-ratio), 429 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_map {
    height: auto;
    padding-top: 238px;
    padding-bottom: 80px;
    margin-top: 160px;
    background-color: #1F3B79;
  }
  .steel_map .steel_map_bg {
    position: relative;
    display: block;
    width: calc(100% - 80px);
    left: auto;
    top: auto;
    margin-left: 40px;
    height: auto;
  }
  .steel_map .steel_map_bg .steel_map_line {
    display: none;
  }
  .steel_map .steel_map_bg {
    aspect-ratio: 688/440;
  }
  .steel_map .steel_map_spots {
    left: 40px;
    top: 238px;
    width: calc(100% - 80px);
    height: auto;
    aspect-ratio: 688/440;
  }
  .steel_map .steel_map_spot.spot_europe {
    left: 2.4404069767%;
    top: 29.0045454545%;
    width: 8.5072674419%;
    height: 13.3022727273%;
  }
  .steel_map .steel_map_spot.spot_middle_east {
    left: 13.238372093%;
    top: 37.8045454545%;
    width: 11.2572674419%;
    height: 17.6022727273%;
  }
  .steel_map .steel_map_spot.spot_china {
    left: 26.3284883721%;
    top: 41.2840909091%;
    width: 10.3401162791%;
    height: 16.1681818182%;
  }
  .steel_map .steel_map_spot.spot_australia {
    left: 32.8531976744%;
    top: 73.9295454545%;
    width: 9.9534883721%;
    height: 15.5636363636%;
  }
  .steel_map .steel_map_spot.spot_japan {
    left: 42.3619186047%;
    top: 40.6704545455%;
    width: 8.5072674419%;
    height: 13.3022727273%;
  }
  .steel_map .steel_map_spot.spot_americas {
    left: 70.5029069767%;
    top: 35.35%;
    width: 10.863372093%;
    height: 16.9863636364%;
  }
}
@media screen and (max-width: 767px) {
  .steel_map {
    height: auto;
    padding-top: 266px;
    padding-bottom: 60px;
  }
  .steel_map .steel_map_bg {
    width: 100%;
    left: auto;
    top: auto;
    margin-left: 0;
    aspect-ratio: 375/277;
  }
  .steel_map .steel_map_spots {
    left: 0;
    top: 266px;
    width: 100%;
    height: auto;
    aspect-ratio: 375/277;
  }
  .steel_map .steel_map_spot.spot_europe {
    left: 3.5733333333%;
    top: 29.7870036101%;
    width: 10.0133333333%;
    height: 13.5559566787%;
  }
  .steel_map .steel_map_spot.spot_middle_east {
    left: 16.2853333333%;
    top: 38.7545126354%;
    width: 13.2506666667%;
    height: 17.9386281588%;
  }
  .steel_map .steel_map_spot.spot_china {
    left: 31.6906666667%;
    top: 42.2996389892%;
    width: 12.1706666667%;
    height: 16.476534296%;
  }
  .steel_map .steel_map_spot.spot_australia {
    left: 37.9466666667%;
    top: 73.9277978339%;
    width: 11.496%;
    height: 15.5631768953%;
  }
  .steel_map .steel_map_spot.spot_japan {
    left: 50.5653333333%;
    top: 41.6750902527%;
    width: 10.0133333333%;
    height: 13.5559566787%;
  }
  .steel_map .steel_map_spot.spot_americas {
    left: 83.688%;
    top: 36.2527075812%;
    width: 12.7866666667%;
    height: 17.3104693141%;
  }
}

.steel_map_txt {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.steel_map_txt .steel_map_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_map_txt .steel_map_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_map_txt .steel_map_heading {
    font-size: var(--fs-h2-mob);
  }
}
.steel_map_txt .steel_map_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.steel_map_txt .steel_map_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_map_txt .steel_map_desc {
    font-size: var(--fs-p1-tab);
  }
}
.steel_map_txt .steel_map_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (min-width: 1025px) {
  .steel_map_txt {
    width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .steel_map_txt {
    top: 80px;
    gap: 20px;
    width: calc(100vw - 80px);
    white-space: nowrap;
  }
  .steel_map_txt .steel_map_heading {
    font-size: 34px;
  }
}
@media screen and (max-width: 767px) {
  .steel_map_txt {
    width: calc(100vw - 40px);
    white-space: normal;
  }
}

.future_materials {
  position: relative;
}

.future_materials .steel_intro_txt {
  width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
}

.future_materials .steel_intro_marquee_track {
  left: 0;
}
.future_materials .steel_intro_card_set {
  aspect-ratio: 3900/1080;
}
.future_materials .fmi_card_01 {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 8.0512820513%;
  height: 31.9444444444%;
}
.future_materials .fmi_card_02 {
  position: absolute;
  left: 4.4358974359%;
  top: 72.8703703704%;
  width: 7.6666666667%;
  height: 18.7962962963%;
}
.future_materials .fmi_card_03 {
  position: absolute;
  left: 21.9743589744%;
  top: 0%;
  width: 8.7435897436%;
  height: 21.2962962963%;
}
.future_materials .fmi_card_04 {
  position: absolute;
  left: 27.6923076923%;
  top: 76.8518518519%;
  width: 11.2564102564%;
  height: 23.1481481481%;
}
.future_materials .fmi_card_05 {
  position: absolute;
  left: 40.5384615385%;
  top: 18.4259259259%;
  width: 10.5128205128%;
  height: 24.1666666667%;
}
.future_materials .fmi_card_06 {
  position: absolute;
  left: 53.4102564103%;
  top: 75.0925925926%;
  width: 7.5641025641%;
  height: 24.9074074074%;
}
.future_materials .fmi_card_07 {
  position: absolute;
  left: 62.3333333333%;
  top: 0%;
  width: 12.3846153846%;
  height: 25.6481481481%;
}
.future_materials .fmi_card_08 {
  position: absolute;
  left: 73.4871794872%;
  top: 71.0185185185%;
  width: 9.0512820513%;
  height: 22.2222222222%;
}
.future_materials .fmi_card_09 {
  position: absolute;
  left: 87.7435897436%;
  top: 19.6296296296%;
  width: 8.7692307692%;
  height: 20.6481481481%;
}
@media screen and (max-width: 1024px) {
  .future_materials .steel_intro_card_set {
    aspect-ratio: 1940/1024;
  }
  .future_materials .fmi_card_01 {
    left: 0%;
    top: 0%;
    width: 11.1340206186%;
    height: 23.92578125%;
  }
  .future_materials .fmi_card_02 {
    left: 4.5360824742%;
    top: 77.9296875%;
    width: 10.9278350515%;
    height: 15.52734375%;
  }
  .future_materials .fmi_card_03 {
    left: 19.175257732%;
    top: 0%;
    width: 11.1340206186%;
    height: 17.08984375%;
  }
  .future_materials .fmi_card_04 {
    left: 24.8969072165%;
    top: 84.765625%;
    width: 16.0309278351%;
    height: 15.234375%;
  }
  .future_materials .fmi_card_05 {
    left: 35.412371134%;
    top: 20.41015625%;
    width: 12.4742268041%;
    height: 18.06640625%;
  }
  .future_materials .fmi_card_06 {
    left: 50.824742268%;
    top: 79.8828125%;
    width: 10.7731958763%;
    height: 20.1171875%;
  }
  .future_materials .fmi_card_07 {
    left: 56.9587628866%;
    top: 9.9609375%;
    width: 17.6804123711%;
    height: 15.72265625%;
  }
  .future_materials .fmi_card_08 {
    left: 71.2886597938%;
    top: 70.1171875%;
    width: 10%;
    height: 16.6015625%;
  }
  .future_materials .fmi_card_09 {
    left: 85.3092783505%;
    top: 16.11328125%;
    width: 12.5257731959%;
    height: 15.52734375%;
  }
}

.fm_safety {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  min-height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.fm_safety .fm_safety_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_safety .fm_safety_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .fm_safety .fm_safety_title {
    font-size: var(--fs-h2-mob);
  }
}
.fm_safety .fm_safety_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  letter-spacing: -0.02em;
}
.fm_safety .fm_safety_cards {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fm_safety {
    flex-direction: column;
    height: auto;
    gap: 60px;
    margin-top: 120px;
  }
  .fm_safety .fm_safety_cards {
    position: static;
    width: 100%;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .fm_safety {
    gap: 18px;
    margin-top: 80px;
  }
  .fm_safety .fm_safety_cards {
    flex-direction: column;
  }
}

.fm_safety_card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(276px * var(--base-ratio), 276 / var(--base-size) * var(--base-percent));
  min-height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fm_safety_card {
    flex: 1;
    width: auto;
    min-height: 228px;
    padding: 24px 20px 22px 20px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .fm_safety_card {
    flex: none;
    width: 100%;
    height: auto;
    min-height: 0;
    justify-content: flex-start;
    gap: 16px;
  }
}

.fm_safety_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fm_safety_icon {
    width: 36px;
    height: 36px;
  }
}

.fm_safety_txt {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fm_safety_txt {
    gap: 6px;
  }
}

.fm_safety_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_safety_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fm_safety_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.fm_safety_card_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #025997;
  letter-spacing: -0.02em;
}

.fm_safety_card_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_safety_card_desc {
    font-size: 16px;
  }
}
.fm_safety_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
  letter-spacing: -0.02em;
  word-break: break-all;
}
:lang(en) .fm_safety_card_desc {
  word-break: keep-all;
}

.fm_divider {
  height: 0;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  border-top: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .fm_divider {
    margin-top: 120px;
  }
}

.future_materials .steel_process_txt {
  width: max(427px * var(--base-ratio), 427 / var(--base-size) * var(--base-percent));
}
.future_materials .steel_process_tab {
  padding: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.future_materials .steel_process_tab_item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(11px * var(--base-ratio), 11 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
}
.future_materials .steel_process_bg {
  background: #FFFFFF;
}
.future_materials .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.future_materials .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.future_materials .steel_cap_card_dimmed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.future_materials .steel_cap_card--01 .steel_cap_card_dimmed {
  background: linear-gradient(90deg, #060606 0%, rgba(108, 108, 108, 0) 100%);
  opacity: 0.78;
}
.future_materials .steel_cap_card--02 .steel_cap_card_dimmed {
  background: linear-gradient(90deg, #095E6F 0%, rgba(9, 94, 111, 0) 68.82%);
  opacity: 0.78;
}
.future_materials .steel_cap_card--03 .steel_cap_card_dimmed {
  background: linear-gradient(90deg, #09436F 0%, rgba(9, 58, 111, 0) 100%);
  opacity: 0.78;
}

.fm_value {
  margin-top: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  margin-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.fm_value .fm_value_txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.fm_value .fm_value_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value .fm_value_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .fm_value .fm_value_title {
    font-size: var(--fs-h2-mob);
  }
}
.fm_value .fm_value_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
}
.fm_value .fm_value_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value .fm_value_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fm_value .fm_value_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}

.fm_value_content {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}

.fm_value_progress_zone {
  position: relative;
  width: 100%;
  height: max(216px * var(--base-ratio), 216 / var(--base-size) * var(--base-percent));
}

.fm_value_tooltip {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: left 0.4s ease;
  pointer-events: none;
}

.fm_value_tooltip_box {
  align-self: stretch;
  background: rgba(0, 0, 0, 0.8);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.fm_value_tooltip_box p {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value_tooltip_box p {
    font-size: 14px;
  }
}
.fm_value_tooltip_box p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
}

.fm_value_tooltip_scroll {
  flex: 1;
  min-width: 0;
  max-height: calc(max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) * 1.3 * 2);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  pointer-events: auto;
}
.fm_value_tooltip_scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
@media screen and (max-width: 1024px) {
  .fm_value_tooltip_scroll {
    max-height: calc(14px * 1.3 * 2);
  }
}

.fm_value_tooltip_scrollbar {
  position: relative;
  flex-shrink: 0;
  align-self: stretch;
  width: 2px;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  visibility: hidden;
  pointer-events: auto;
}

.fm_value_tooltip_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  cursor: grab;
  touch-action: none;
}
.fm_value_tooltip_scrollbar_thumb:active {
  cursor: grabbing;
}

.fm_value_tooltip_arrow {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.8);
}

.fm_value_progress_icon {
  position: absolute;
  transform: translateX(-50%);
  pointer-events: none;
}
.fm_value_progress_icon[data-icon=ship] {
  top: max(86px * var(--base-ratio), 86 / var(--base-size) * var(--base-percent));
}
.fm_value_progress_icon[data-icon=ship] .fm_value_icon_ship {
  display: block;
}
.fm_value_progress_icon[data-icon=ship] .fm_value_icon_truck {
  display: none;
}
.fm_value_progress_icon[data-icon=truck] {
  top: max(117px * var(--base-ratio), 117 / var(--base-size) * var(--base-percent));
}
.fm_value_progress_icon[data-icon=truck] .fm_value_icon_ship {
  display: none;
}
.fm_value_progress_icon[data-icon=truck] .fm_value_icon_truck {
  display: block;
}
.fm_value_progress_icon .fm_value_icon_ship {
  width: max(193px * var(--base-ratio), 193 / var(--base-size) * var(--base-percent));
  height: max(87px * var(--base-ratio), 87 / var(--base-size) * var(--base-percent));
}
.fm_value_progress_icon .fm_value_icon_truck {
  width: max(203px * var(--base-ratio), 203 / var(--base-size) * var(--base-percent));
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
}

.fm_value_bar {
  position: absolute;
  top: max(170px * var(--base-ratio), 170 / var(--base-size) * var(--base-percent));
  left: 0;
  width: 100%;
  height: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent));
}

.fm_value_bar_bg {
  position: absolute;
  inset: 0;
  background: #D1D2D4;
  border-radius: 999px;
}

.fm_value_bar_fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: #00A3F1;
  border-radius: 999px;
  width: 0;
}

.fm_value_dots {
  position: absolute;
  top: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.fm_value_dot {
  width: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #D1D2D4;
}
.fm_value_dot.is_active {
  background: #00A3F1;
}

.fm_value_dot_active {
  position: absolute;
  top: max(157px * var(--base-ratio), 157 / var(--base-size) * var(--base-percent));
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  pointer-events: none;
}

.fm_value_dot_outer {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(0, 163, 241, 0.3);
}

.fm_value_dot_inner {
  position: absolute;
  top: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  left: max(7px * var(--base-ratio), 7 / var(--base-size) * var(--base-percent));
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #00A3F1;
  border: 2px solid #FFFFFF;
}

.fm_value_labels {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value_labels {
    font-size: 16px;
  }
}
.fm_value_labels {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
}
.fm_value_labels .fm_value_label {
  color: #6D6E72;
  text-align: center;
  transition: color 0.4s ease;
}
.fm_value_labels .fm_value_label:first-child {
  text-align: left;
}
.fm_value_labels .fm_value_label:last-child {
  text-align: right;
}
.fm_value_labels .fm_value_label.is_accent {
  color: #00A3F1;
}

.fm_value_visual {
  position: relative;
  width: 100%;
  aspect-ratio: 1464/480;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.fm_value_bg {
  position: absolute;
  inset: 0;
}
.fm_value_bg picture {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.4s ease;
}
.fm_value_bg picture.is_active {
  opacity: 1;
}
.fm_value_bg picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.fm_value_divider {
  position: absolute;
  top: 0;
  width: 1px;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
}
.fm_value_divider:nth-child(2) {
  left: 0;
}
.fm_value_divider:nth-child(3) {
  left: 33.3333333333%;
}
.fm_value_divider:nth-child(4) {
  left: 66.6666666667%;
}
.fm_value_divider:nth-child(5) {
  right: 0;
}

.fm_value_stage {
  position: absolute;
  cursor: pointer;
  transition: left 0.4s ease, top 0.4s ease, width 0.4s ease, height 0.4s ease;
}
.fm_value_stage[data-stage=raw] {
  left: 6.9672131148%;
  top: 22.7083333333%;
  width: 19.3989071038%;
  height: 59.1666666667%;
}
.fm_value_stage[data-stage=mid] {
  left: 40.3005464481%;
  top: 22.5%;
  width: 19.3989071038%;
  height: 55%;
}
.fm_value_stage[data-stage=final] {
  left: 73.6338797814%;
  top: 22.5%;
  width: 19.3989071038%;
  height: 55%;
}
.fm_value_stage[data-stage=raw].is_active {
  left: 5.1912568306%;
  top: 17.2916666667%;
  width: 22.9508196721%;
  height: 70%;
}
.fm_value_stage[data-stage=mid].is_active {
  left: 38.5245901639%;
  top: 17.3958333333%;
  width: 22.9508196721%;
  height: 65.2083333333%;
}
.fm_value_stage[data-stage=final].is_active {
  left: 71.8579234973%;
  top: 17.3958333333%;
  width: 22.9508196721%;
  height: 65.2083333333%;
}

.fm_value_zones {
  position: absolute;
  inset: 0;
  display: flex;
  z-index: 2;
}

.fm_value_zone {
  flex: 1;
  cursor: pointer;
}

.fm_value_stage_labels {
  position: absolute;
  top: 11.6666666667%;
  left: 0;
  width: 100%;
  display: flex;
  pointer-events: none;
  z-index: 1;
}
.fm_value_stage_labels .fm_value_stage_label {
  flex: 1;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value_stage_labels .fm_value_stage_label {
    font-size: var(--fs-p1-tab);
  }
}
.fm_value_stage_labels .fm_value_stage_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
  white-space: nowrap;
}

.fm_value_chips {
  position: relative;
  width: 100%;
  height: 100%;
}

.fm_value_chip {
  position: absolute;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fm_value_chip {
    font-size: var(--fs-p1-tab);
  }
}
.fm_value_chip {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  transition: width 0.4s ease, height 0.4s ease, left 0.4s ease, top 0.4s ease, background 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
  background: rgba(255, 255, 255, 0.21);
  border: 1px solid rgba(209, 210, 212, 0.2);
}

.fm_value_stage.is_active .fm_value_chip {
  background: #00A3F1;
  border: 1px solid #3BB7F3;
  box-shadow: 0 0 0 max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) rgba(0, 163, 241, 0.4);
}

[data-stage=raw] .fm_value_chip {
  width: 49.2957746479%;
  height: 49.2957746479%;
}
[data-stage=raw] .fm_value_chip:nth-child(1) {
  left: 0;
  top: 0;
}
[data-stage=raw] .fm_value_chip:nth-child(2) {
  left: 50.7042253521%;
  top: 0;
}
[data-stage=raw] .fm_value_chip:nth-child(3) {
  left: 0;
  top: 50.7042253521%;
}
[data-stage=raw] .fm_value_chip:nth-child(4) {
  left: 50.7042253521%;
  top: 50.7042253521%;
}

[data-stage=raw].is_active .fm_value_chip {
  width: 41.6666666667%;
  height: 41.6666666667%;
}
[data-stage=raw].is_active .fm_value_chip:nth-child(1) {
  left: 4.1666666667%;
  top: 4.1666666667%;
}
[data-stage=raw].is_active .fm_value_chip:nth-child(2) {
  left: 54.1666666667%;
  top: 4.1666666667%;
}
[data-stage=raw].is_active .fm_value_chip:nth-child(3) {
  left: 4.1666666667%;
  top: 54.1666666667%;
}
[data-stage=raw].is_active .fm_value_chip:nth-child(4) {
  left: 54.1666666667%;
  top: 54.1666666667%;
}

[data-stage=mid] .fm_value_chip,
[data-stage=final] .fm_value_chip {
  width: 49.2957746479%;
  height: 53.0303030303%;
}
[data-stage=mid] .fm_value_chip:nth-child(1),
[data-stage=final] .fm_value_chip:nth-child(1) {
  left: 25.3521126761%;
  top: 0;
}
[data-stage=mid] .fm_value_chip:nth-child(2),
[data-stage=final] .fm_value_chip:nth-child(2) {
  left: 0;
  top: 46.9696969697%;
}
[data-stage=mid] .fm_value_chip:nth-child(3),
[data-stage=final] .fm_value_chip:nth-child(3) {
  left: 50.7042253521%;
  top: 46.9696969697%;
}

[data-stage=mid].is_active .fm_value_chip,
[data-stage=final].is_active .fm_value_chip {
  width: 41.6666666667%;
  height: 44.7284345048%;
}
[data-stage=mid].is_active .fm_value_chip:nth-child(1),
[data-stage=final].is_active .fm_value_chip:nth-child(1) {
  left: 29.4642857143%;
  top: 4.4728434505%;
}
[data-stage=mid].is_active .fm_value_chip:nth-child(2),
[data-stage=final].is_active .fm_value_chip:nth-child(2) {
  left: 4.1666666667%;
  top: 50.7987220447%;
}
[data-stage=mid].is_active .fm_value_chip:nth-child(3),
[data-stage=final].is_active .fm_value_chip:nth-child(3) {
  left: 54.1666666667%;
  top: 50.7987220447%;
}

@media screen and (max-width: 1024px) {
  .fm_value {
    margin-top: 240px;
    margin-bottom: 160px;
    gap: 8px;
  }
  .fm_value_content {
    gap: 36px;
  }
  .fm_value_progress_zone {
    height: 131px;
  }
  .fm_value_tooltip_box {
    border-radius: 12px;
    padding: 16px 8px;
  }
  .fm_value_tooltip_box p {
    font-size: 14px;
  }
  .fm_value_progress_icon {
    display: none;
  }
  .fm_value_bar {
    top: 87px;
    height: 3px;
  }
  .fm_value_dots {
    top: 83px;
  }
  .fm_value_dot {
    width: 10px;
    height: 10px;
  }
  .fm_value_dot_active {
    top: 74px;
    width: 28px;
    height: 28px;
  }
  .fm_value_dot_inner {
    top: 7px;
    left: 7px;
    width: 14px;
    height: 14px;
  }
  .fm_value_labels {
    font-size: 16px;
  }
  .fm_value_visual {
    aspect-ratio: 688/780;
    border-radius: 10px;
  }
  .fm_value_zones {
    flex-direction: column;
  }
  .fm_value_divider {
    width: 100%;
    height: 1px;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
  }
  .fm_value_divider:nth-child(2) {
    top: 0;
  }
  .fm_value_divider:nth-child(3) {
    top: 33.3333333333%;
  }
  .fm_value_divider:nth-child(4) {
    top: 66.6666666667%;
  }
  .fm_value_divider:nth-child(5) {
    top: auto;
    bottom: 0;
  }
  .fm_value_stage_labels {
    top: 0;
    height: 100%;
    flex-direction: column;
  }
  .fm_value_stage_labels .fm_value_stage_label {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 18px;
    flex: none;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(1) {
    top: 6.6666666667%;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(2) {
    top: 40.3846153846%;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(3) {
    top: 73.7179487179%;
  }
  .fm_value_stage[data-stage=raw] {
    left: 17.4418604651%;
    top: 11.4102564103%;
    width: 65.1162790698%;
    height: 14.358974359%;
  }
  .fm_value_stage[data-stage=mid] {
    left: 25.2906976744%;
    top: 45.3846153846%;
    width: 48.8372093023%;
    height: 14.358974359%;
  }
  .fm_value_stage[data-stage=final] {
    left: 25.2906976744%;
    top: 78.7179487179%;
    width: 48.8372093023%;
    height: 14.358974359%;
  }
  .fm_value_stage[data-stage=raw].is_active {
    left: 10.4651162791%;
    top: 9.8717948718%;
    width: 79.0697674419%;
    height: 17.4358974359%;
  }
  .fm_value_stage[data-stage=mid].is_active {
    left: 20.0581395349%;
    top: 43.8461538462%;
    width: 59.3023255814%;
    height: 17.4358974359%;
  }
  .fm_value_stage[data-stage=final].is_active {
    left: 20.0581395349%;
    top: 77.1794871795%;
    width: 59.3023255814%;
    height: 17.4358974359%;
  }
  [data-stage=raw] .fm_value_chip {
    width: 25%;
    height: 100%;
  }
  [data-stage=raw] .fm_value_chip:nth-child(1) {
    left: 0;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(2) {
    left: 25%;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(3) {
    left: 50%;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(4) {
    left: 75%;
    top: 0;
  }
  [data-stage=raw].is_active .fm_value_chip {
    width: 20.5882352941%;
    height: 82.3529411765%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(1) {
    left: 2.2058823529%;
    top: 8.8235294118%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(2) {
    left: 27.2058823529%;
    top: 8.8235294118%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(3) {
    left: 52.2058823529%;
    top: 8.8235294118%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(4) {
    left: 77.2058823529%;
    top: 8.8235294118%;
  }
  [data-stage=mid] .fm_value_chip,
  [data-stage=final] .fm_value_chip {
    width: 33.3333333333%;
    height: 100%;
  }
  [data-stage=mid] .fm_value_chip:nth-child(1),
  [data-stage=final] .fm_value_chip:nth-child(1) {
    left: 0;
    top: 0;
  }
  [data-stage=mid] .fm_value_chip:nth-child(2),
  [data-stage=final] .fm_value_chip:nth-child(2) {
    left: 33.3333333333%;
    top: 0;
  }
  [data-stage=mid] .fm_value_chip:nth-child(3),
  [data-stage=final] .fm_value_chip:nth-child(3) {
    left: 66.6666666667%;
    top: 0;
  }
  [data-stage=mid].is_active .fm_value_chip,
  [data-stage=final].is_active .fm_value_chip {
    width: 27.4509803922%;
    height: 82.3529411765%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(1),
  [data-stage=final].is_active .fm_value_chip:nth-child(1) {
    left: 2.9411764706%;
    top: 8.8235294118%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(2),
  [data-stage=final].is_active .fm_value_chip:nth-child(2) {
    left: 36.2745098039%;
    top: 8.8235294118%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(3),
  [data-stage=final].is_active .fm_value_chip:nth-child(3) {
    left: 69.6078431373%;
    top: 8.8235294118%;
  }
  .fm_value_stage.is_active .fm_value_chip {
    box-shadow: 0 0 0 12px rgba(0, 163, 241, 0.4);
  }
}
@media screen and (max-width: 767px) {
  .fm_value {
    margin-top: 120px;
    margin-bottom: 120px;
    gap: 24px;
  }
  .fm_value_txt {
    gap: 20px;
  }
  .fm_value_content {
    gap: 15px;
  }
  .fm_value_progress_zone {
    height: 152px;
  }
  .fm_value_labels {
    align-items: flex-start;
  }
  .fm_value_visual {
    aspect-ratio: 335/500;
  }
  .fm_value_divider:nth-child(3) {
    top: 34.8%;
  }
  .fm_value_divider:nth-child(4) {
    top: 66%;
  }
  .fm_value_stage_labels .fm_value_stage_label {
    font-size: 14px;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(1) {
    top: 8%;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(2) {
    top: 40.4%;
  }
  .fm_value_stage_labels .fm_value_stage_label:nth-child(3) {
    top: 71.6%;
  }
  .fm_value_zones .fm_value_zone:nth-child(1) {
    flex: 174;
  }
  .fm_value_zones .fm_value_zone:nth-child(2) {
    flex: 156;
  }
  .fm_value_zones .fm_value_zone:nth-child(3) {
    flex: 170;
  }
  .fm_value_chip {
    font-size: 11px;
  }
  .fm_value_tooltip_arrow {
    position: absolute;
    top: 100%;
    margin-left: -8px;
  }
  .fm_value_stage[data-stage=raw] {
    left: 9.2537313433%;
    top: 14.2%;
    width: 82.3880597015%;
    height: 13.8%;
  }
  .fm_value_stage[data-stage=mid] {
    left: 19.4029850746%;
    top: 46.6%;
    width: 61.7910447761%;
    height: 13.8%;
  }
  .fm_value_stage[data-stage=final] {
    left: 19.4029850746%;
    top: 77.8%;
    width: 61.7910447761%;
    height: 13.8%;
  }
  .fm_value_stage[data-stage=raw].is_active {
    left: 1.9402985075%;
    top: 13%;
    width: 96.7164179104%;
    height: 16.2%;
  }
  .fm_value_stage[data-stage=mid].is_active {
    left: 13.7313432836%;
    top: 45%;
    width: 72.5373134328%;
    height: 16.2%;
  }
  .fm_value_stage[data-stage=final].is_active {
    left: 13.7313432836%;
    top: 76.6%;
    width: 72.5373134328%;
    height: 16.2%;
  }
  [data-stage=raw] .fm_value_chip {
    width: 25%;
    height: 100%;
  }
  [data-stage=raw] .fm_value_chip:nth-child(1) {
    left: 0;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(2) {
    left: 25%;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(3) {
    left: 50%;
    top: 0;
  }
  [data-stage=raw] .fm_value_chip:nth-child(4) {
    left: 75%;
    top: 0;
  }
  [data-stage=raw].is_active .fm_value_chip {
    width: 21.2962962963%;
    height: 85.1851851852%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(1) {
    left: 1.8518518519%;
    top: 7.4074074074%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(2) {
    left: 26.8518518519%;
    top: 7.4074074074%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(3) {
    left: 51.8518518519%;
    top: 7.4074074074%;
  }
  [data-stage=raw].is_active .fm_value_chip:nth-child(4) {
    left: 76.8518518519%;
    top: 7.4074074074%;
  }
  [data-stage=mid] .fm_value_chip,
  [data-stage=final] .fm_value_chip {
    width: 33.3333333333%;
    height: 100%;
  }
  [data-stage=mid] .fm_value_chip:nth-child(1),
  [data-stage=final] .fm_value_chip:nth-child(1) {
    left: 0;
    top: 0;
  }
  [data-stage=mid] .fm_value_chip:nth-child(2),
  [data-stage=final] .fm_value_chip:nth-child(2) {
    left: 33.3333333333%;
    top: 0;
  }
  [data-stage=mid] .fm_value_chip:nth-child(3),
  [data-stage=final] .fm_value_chip:nth-child(3) {
    left: 66.6666666667%;
    top: 0;
  }
  [data-stage=mid].is_active .fm_value_chip,
  [data-stage=final].is_active .fm_value_chip {
    width: 28.3950617284%;
    height: 85.1851851852%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(1),
  [data-stage=final].is_active .fm_value_chip:nth-child(1) {
    left: 2.4691358025%;
    top: 7.4074074074%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(2),
  [data-stage=final].is_active .fm_value_chip:nth-child(2) {
    left: 35.8024691358%;
    top: 7.4074074074%;
  }
  [data-stage=mid].is_active .fm_value_chip:nth-child(3),
  [data-stage=final].is_active .fm_value_chip:nth-child(3) {
    left: 69.1358024691%;
    top: 7.4074074074%;
  }
  .fm_value_stage.is_active .fm_value_chip {
    box-shadow: 0 0 0 6px rgba(0, 163, 241, 0.4);
  }
}
:lang(en) .steel_hero .intro_page_tab .intro_tab {
  width: auto;
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  white-space: nowrap;
}

.steel_raw {
  position: relative;
}
.steel_raw .steel_hero .intro_page_title {
  z-index: 5;
}
.steel_raw .steel_intro_txt {
  width: max(1042px * var(--base-ratio), 1042 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_intro_marquee_track {
  left: 0;
}
.steel_raw .steel_intro_card_set {
  aspect-ratio: 4082/1237;
}
.steel_raw .sri_card_01 {
  position: absolute;
  left: 4.1891229789%;
  top: 0%;
  width: 8.3537481627%;
  height: 33.3872271625%;
}
.steel_raw .sri_card_02 {
  position: absolute;
  left: 9.0886820186%;
  top: 67.4211802749%;
  width: 7.3248407643%;
  height: 18.1083265966%;
}
.steel_raw .sri_card_03 {
  position: absolute;
  left: 25.8451739343%;
  top: 0%;
  width: 8.3537481627%;
  height: 24.2522231205%;
}
.steel_raw .sri_card_04 {
  position: absolute;
  left: 31.3081822636%;
  top: 74.7776879547%;
  width: 10.7545320921%;
  height: 21.4227970897%;
}
.steel_raw .sri_card_05 {
  position: absolute;
  left: 43.581577658%;
  top: 21.5844785772%;
  width: 8.3537481627%;
  height: 21.0994341148%;
}
.steel_raw .sri_card_06 {
  position: absolute;
  left: 64.4047035767%;
  top: 9.9434114794%;
  width: 11.8324350808%;
  height: 18.4316895715%;
}
.steel_raw .sri_card_07 {
  position: absolute;
  left: 88.7065164135%;
  top: 22.6354082458%;
  width: 8.3782459579%;
  height: 18.0274858529%;
}
.steel_raw .sri_card_08 {
  position: absolute;
  left: 75.061244488%;
  top: 68.1487469685%;
  width: 6.6878980892%;
  height: 19.4017784964%;
}
.steel_raw .sri_card_09 {
  position: absolute;
  left: 55.8794708476%;
  top: 71.0590137429%;
  width: 7.2268495835%;
  height: 28.9409862571%;
}
.steel_raw .steel_raw_numbers {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_numbers {
    display: block;
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_numbers {
    margin-top: 80px;
  }
}
.steel_raw .steel_raw_numbers_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_numbers_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_numbers_title {
    font-size: var(--fs-h2-mob);
  }
}
.steel_raw .steel_raw_numbers_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(427px * var(--base-ratio), 427 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_numbers_title {
    width: 685px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_numbers_title {
    width: 100%;
  }
}
.steel_raw .steel_raw_numbers_cards {
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_numbers_cards {
    width: 100%;
    margin-top: 60px;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_numbers_cards {
    grid-template-columns: 1fr;
    margin-top: 40px;
  }
}
.steel_raw .steel_raw_num_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card {
    height: 160px;
    padding: 24px 20px 28px 20px;
    border-radius: 12px;
  }
}
.steel_raw .steel_raw_num_card_head {
  display: flex;
  flex-direction: column;
}
.steel_raw .steel_raw_num_card_top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_top {
    padding-left: 0;
  }
}
.steel_raw .steel_raw_num_card_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_num_card_label {
    font-size: var(--fs-h5-mob);
  }
}
.steel_raw .steel_raw_num_card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.steel_raw .steel_raw_num_card_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_icon {
    width: 36px;
    height: 36px;
  }
}
.steel_raw .steel_raw_num_card_sub {
  margin-top: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
  padding-left: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_sub {
    font-size: 12px;
  }
}
.steel_raw .steel_raw_num_card_sub {
  letter-spacing: -0.02em;
  font-weight: 500;
  line-height: 1.3;
  color: rgba(0, 0, 0, 0.6);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_sub {
    margin-top: 2px;
    padding-left: 0;
    font-weight: 400;
    color: #818286;
  }
}
.steel_raw .steel_raw_num_card_bottom {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_bottom {
    gap: 4px;
  }
}
.steel_raw .steel_raw_num_card_value {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_value {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_num_card_value {
    font-size: var(--fs-d3-mob);
  }
}
.steel_raw .steel_raw_num_card_value {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #025997;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.steel_raw .steel_raw_num_card_unit {
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_unit {
    font-size: 16px;
  }
}
.steel_raw .steel_raw_num_card_unit {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_num_card_unit {
    padding-bottom: 5px;
  }
}
.steel_raw .steel_raw_contract_card {
  grid-column: 1/-1;
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_card {
    padding: 24px 20px 28px 20px;
    border-radius: 12px;
  }
}
.steel_raw .steel_raw_contract_head {
  display: flex;
  align-items: center;
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_head {
    padding-left: 0;
  }
}
.steel_raw .steel_raw_contract_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_contract_title {
    font-size: var(--fs-h5-mob);
  }
}
.steel_raw .steel_raw_contract_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.steel_raw .steel_raw_contract_items {
  display: flex;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  margin-top: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_items {
    gap: 16px;
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_contract_items {
    flex-direction: column;
  }
}
.steel_raw .steel_raw_contract_item {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(230px * var(--base-ratio), 230 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_item {
    height: 200px;
    padding: 20px 18px 24px 18px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_contract_item {
    flex: none;
    width: 100%;
  }
}
.steel_raw .steel_raw_contract_item_icon {
  position: absolute;
  top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  right: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_item_icon {
    top: 20px;
    right: 24px;
    width: 36px;
    height: 36px;
  }
}
.steel_raw .steel_raw_contract_item_labels {
  display: flex;
  flex-direction: column;
}
.steel_raw .steel_raw_contract_item_key {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_item_key {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_contract_item_key {
    font-size: var(--fs-h5-mob);
  }
}
.steel_raw .steel_raw_contract_item_key {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #025997;
}
.steel_raw .steel_raw_contract_item_name {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_item_name {
    font-size: var(--fs-p1-tab);
  }
}
.steel_raw .steel_raw_contract_item_name {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.steel_raw .steel_raw_contract_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_contract_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.steel_raw .steel_raw_contract_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
@media screen and (min-width: 1025px) {
  :lang(en) .steel_raw .steel_raw_contract_item {
    height: auto;
    justify-content: flex-start;
    gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  :lang(en) .steel_raw .steel_raw_contract_item {
    height: auto;
    justify-content: flex-start;
    gap: 8px;
  }
}
.steel_raw .steel_process_txt {
  width: max(518px * var(--base-ratio), 518 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_process_bg {
  background: #FFFFFF;
}
.steel_raw .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.steel_raw .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.steel_raw .steel_raw_cap_card_desc_wrap {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_cap_card_note {
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_cap_card_note {
    font-size: 12px;
  }
}
.steel_raw .steel_raw_cap_card_note {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #BCBDC1;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_cap_card_note {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_cap_card {
    height: 520px;
  }
  .steel_raw .steel_cap_card_conts {
    padding: 0 24px 30px 24px;
  }
  .steel_raw .steel_cap_card_inner {
    gap: 16px;
  }
  .steel_raw .steel_cap_card_icon {
    width: 56px;
    height: 56px;
  }
}
.steel_raw .steel_raw_map {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background-color: #102864;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map {
    height: auto;
    aspect-ratio: 768/756;
    margin-top: 160px;
    background-color: #1F3B79;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_map {
    aspect-ratio: 375/640;
    margin-top: 160px;
  }
}
.steel_raw .steel_raw_map_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.steel_raw .steel_raw_map_bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.steel_raw .steel_raw_map_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.steel_raw .steel_raw_map_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.steel_raw .steel_raw_map_line svg {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_line {
    display: none;
  }
}
.steel_raw .steel_raw_map_spots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.steel_raw .steel_raw_map_spot {
  position: absolute;
  opacity: 0;
}
.steel_raw .steel_raw_map_spot.spot_raw_canada {
  left: max(1284px * var(--base-ratio), 1284 / var(--base-size) * var(--base-percent));
  top: max(363px * var(--base-ratio), 363 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_brazil {
  left: max(1531px * var(--base-ratio), 1531 / var(--base-size) * var(--base-percent));
  top: max(726px * var(--base-ratio), 726 / var(--base-size) * var(--base-percent));
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  height: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_chile {
  left: max(1398px * var(--base-ratio), 1398 / var(--base-size) * var(--base-percent));
  top: max(846px * var(--base-ratio), 846 / var(--base-size) * var(--base-percent));
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  height: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_china {
  left: max(604px * var(--base-ratio), 604 / var(--base-size) * var(--base-percent));
  top: max(534px * var(--base-ratio), 534 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_australia {
  left: max(725px * var(--base-ratio), 725 / var(--base-size) * var(--base-percent));
  top: max(818px * var(--base-ratio), 818 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_new_caledonia {
  left: max(832px * var(--base-ratio), 832 / var(--base-size) * var(--base-percent));
  top: max(689px * var(--base-ratio), 689 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_south_africa {
  left: max(257px * var(--base-ratio), 257 / var(--base-size) * var(--base-percent));
  top: max(769px * var(--base-ratio), 769 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_mozambique {
  left: max(441px * var(--base-ratio), 441 / var(--base-size) * var(--base-percent));
  top: max(721px * var(--base-ratio), 721 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_russia {
  left: max(582px * var(--base-ratio), 582 / var(--base-size) * var(--base-percent));
  top: max(329px * var(--base-ratio), 329 / var(--base-size) * var(--base-percent));
  width: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
  height: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
}
.steel_raw .steel_raw_map_spot.spot_raw_east_sea {
  left: max(847px * var(--base-ratio), 847 / var(--base-size) * var(--base-percent));
  top: max(499px * var(--base-ratio), 499 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_spot.spot_raw_canada {
    left: 68.8971354167%;
    top: 49.9616402116%;
    width: 9.6809895833%;
    height: 9.8346560847%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_brazil {
    left: 83.3020833333%;
    top: 71.4695767196%;
    width: 6.9986979167%;
    height: 7.1097883598%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_chile {
    left: 75.5455729167%;
    top: 78.5793650794%;
    width: 6.9986979167%;
    height: 7.1097883598%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_china {
    left: 29.2369791667%;
    top: 60.0939153439%;
    width: 8.8645833333%;
    height: 9.0052910053%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_australia {
    left: 36.2942708333%;
    top: 76.9206349206%;
    width: 8.8645833333%;
    height: 9.0052910053%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_new_caledonia {
    left: 42.53515625%;
    top: 69.2777777778%;
    width: 8.8645833333%;
    height: 9.0052910053%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_south_africa {
    left: 8.9986979167%;
    top: 74.0171957672%;
    width: 8.8645833333%;
    height: 9.0052910053%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_mozambique {
    left: 19.73046875%;
    top: 71.1732804233%;
    width: 8.8645833333%;
    height: 9.0052910053%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_russia {
    left: 27.9544270833%;
    top: 47.9484126984%;
    width: 10.03125%;
    height: 10.1904761905%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_east_sea {
    left: 43.41015625%;
    top: 58.0198412698%;
    width: 7.58203125%;
    height: 7.7023809524%;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_map_spot.spot_raw_canada {
    left: 72.6186666667%;
    top: 64.234375%;
    width: 11.3546666667%;
    height: 6.653125%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_brazil {
    left: 89.512%;
    top: 78.7828125%;
    width: 8.208%;
    height: 4.809375%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_chile {
    left: 80.416%;
    top: 83.590625%;
    width: 8.208%;
    height: 4.809375%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_china {
    left: 26.1093333333%;
    top: 71.0875%;
    width: 10.3973333333%;
    height: 6.0921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_australia {
    left: 34.3866666667%;
    top: 82.46875%;
    width: 10.3973333333%;
    height: 6.0921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_new_caledonia {
    left: 41.704%;
    top: 77.3%;
    width: 10.3973333333%;
    height: 6.0921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_south_africa {
    left: 2.3786666667%;
    top: 80.5046875%;
    width: 10.3973333333%;
    height: 6.0921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_mozambique {
    left: 14.9626666667%;
    top: 78.58125%;
    width: 10.3973333333%;
    height: 6.0921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_russia {
    left: 24.6053333333%;
    top: 62.871875%;
    width: 11.7626666667%;
    height: 6.8921875%;
  }
  .steel_raw .steel_raw_map_spot.spot_raw_east_sea {
    left: 42.7306666667%;
    top: 69.684375%;
    width: 8.8906666667%;
    height: 5.209375%;
  }
}
.steel_raw .steel_raw_map_korea {
  position: absolute;
  left: max(805px * var(--base-ratio), 805 / var(--base-size) * var(--base-percent));
  top: max(598px * var(--base-ratio), 598 / var(--base-size) * var(--base-percent));
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_korea {
    left: 40.9596354167%;
    top: 63.8862433862%;
    width: 0.81640625%;
    height: 0.8293650794%;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_map_korea {
    left: 39.8586666667%;
    top: 73.653125%;
    width: 0.9573333333%;
    height: 0.5609375%;
  }
}
.steel_raw .steel_raw_map_txt {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_txt {
    top: 10.582010582%;
    width: 67.4479166667%;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_map_txt {
    top: 9.0625%;
    width: 84.8%;
    gap: 20px;
  }
}
.steel_raw .steel_raw_map_txt .steel_raw_map_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_heading {
    font-size: var(--fs-h2-mob);
  }
}
.steel_raw .steel_raw_map_txt .steel_raw_map_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_heading {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_heading {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_heading {
    font-size: var(--fs-h1-mob);
  }
}
.steel_raw .steel_raw_map_txt .steel_raw_map_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .steel_raw .steel_raw_map_txt .steel_raw_map_desc {
    font-size: var(--fs-p1-tab);
  }
}
.steel_raw .steel_raw_map_txt .steel_raw_map_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}

.container_air {
  position: relative;
}
.container_air .steel_intro_txt {
  width: max(1042px * var(--base-ratio), 1042 / var(--base-size) * var(--base-percent));
}
.container_air .steel_intro_marquee_track {
  left: 0;
}
.container_air .steel_intro_card_set {
  aspect-ratio: 4142/1237;
}
.container_air .cai_card_01 {
  position: absolute;
  left: 6.2047320135%;
  top: 0%;
  width: 8.2327378078%;
  height: 33.3872271625%;
}
.container_air .cai_card_02 {
  position: absolute;
  left: 11.033317238%;
  top: 67.4211802749%;
  width: 7.2187349107%;
  height: 18.1083265966%;
}
.container_air .cai_card_03 {
  position: absolute;
  left: 27.5470787059%;
  top: 0%;
  width: 8.2327378078%;
  height: 24.2522231205%;
}
.container_air .cai_card_04 {
  position: absolute;
  left: 32.9309512313%;
  top: 74.7776879547%;
  width: 10.5987445678%;
  height: 21.4227970897%;
}
.container_air .cai_card_05 {
  position: absolute;
  left: 45.0265572187%;
  top: 21.5844785772%;
  width: 8.2327378078%;
  height: 21.0994341148%;
}
.container_air .cai_card_06 {
  position: absolute;
  left: 65.548044423%;
  top: 9.9434114794%;
  width: 11.6610333172%;
  height: 18.4316895715%;
}
.container_air .cai_card_07 {
  position: absolute;
  left: 89.4978271366%;
  top: 22.6354082458%;
  width: 8.2568807339%;
  height: 18.0274858529%;
}
.container_air .cai_card_08 {
  position: absolute;
  left: 76.0502172863%;
  top: 68.1487469685%;
  width: 6.5910188315%;
  height: 19.4017784964%;
}
.container_air .cai_card_09 {
  position: absolute;
  left: 57.1463061323%;
  top: 71.0590137429%;
  width: 7.1221632062%;
  height: 28.9409862571%;
}
.container_air .container_air_numbers {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_numbers_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_numbers_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_numbers_title {
    font-size: var(--fs-h2-mob);
  }
}
.container_air .container_air_numbers_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(521px * var(--base-ratio), 521 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.container_air .container_air_numbers_cards {
  display: flex;
  gap: max(21px * var(--base-ratio), 21 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_num_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: max(276px * var(--base-ratio), 276 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_num_card_head {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_num_card_top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_num_card_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_num_card_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_num_card_label {
    font-size: var(--fs-h5-mob);
  }
}
.container_air .container_air_num_card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.container_air .container_air_num_card_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.container_air .container_air_num_card_sub {
  font-family: "Pretendard", sans-serif;
  font-size: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  line-height: 1.4;
  color: #818286;
}
.container_air .container_air_num_card_bottom {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_num_card_value {
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_num_card_value {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_num_card_value {
    font-size: var(--fs-d3-mob);
  }
}
.container_air .container_air_num_card_value {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  font-family: "Bai Jamjuree", sans-serif;
  color: #025997;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.container_air .container_air_num_card_unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_num_card_unit {
    font-size: 16px;
  }
}
.container_air .container_air_num_card_unit {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6d6e72;
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_contact {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact {
    flex-direction: column;
    gap: 60px;
    padding: 120px 0;
  }
}
.container_air .container_air_contact_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_contact_title {
    font-size: var(--fs-h3-mob);
  }
}
.container_air .container_air_contact_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(451px * var(--base-ratio), 451 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_title {
    width: auto;
  }
}
.container_air .container_air_contact_card {
  width: max(722px * var(--base-ratio), 722 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  background-color: #F3F3F3;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_card {
    width: 100%;
    padding: 32px 20px;
    border-radius: 12px;
  }
}
.container_air .container_air_contact_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_contact_label {
    font-size: var(--fs-h5-mob);
  }
}
.container_air .container_air_contact_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  margin-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_label {
    margin-bottom: 16px;
  }
}
.container_air .container_air_contact_rows {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_rows {
    gap: 12px;
  }
}
.container_air .container_air_contact_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: 53px;
    padding: 16px;
    border-radius: 8px;
  }
}
.container_air .container_air_contact_cell {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  flex: 1;
  padding-left: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_cell {
    flex: initial;
    justify-self: center;
    justify-content: flex-start;
    gap: 6px;
    min-width: 240px;
    padding-left: 0;
  }
}
.container_air .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
  padding-left: max(76px * var(--base-ratio), 76 / var(--base-size) * var(--base-percent));
  flex: 0 0 auto;
  width: max(270px * var(--base-ratio), 270 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
    flex: initial;
    justify-self: center;
    justify-content: center;
    min-width: 150px;
    padding-left: 0;
    width: auto;
  }
}
.container_air .container_air_contact_icon {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_icon {
    width: 20px;
    height: 20px;
  }
}
.container_air .container_air_contact_text {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_text {
    font-size: 14px;
  }
}
.container_air .container_air_contact_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
.container_air .container_air_contact_divider {
  display: block;
  width: 1px;
  height: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  background-color: #d1d2d4;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_contact_divider {
    height: 18px;
  }
}
.container_air .steel_process_txt {
  width: max(622px * var(--base-ratio), 622 / var(--base-size) * var(--base-percent));
}
.container_air .steel_process_bg {
  background: #FFFFFF;
}
.container_air .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.container_air .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.container_air .steel_process_tab {
  padding: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.container_air .steel_process_tab_item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(11px * var(--base-ratio), 11 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
}
.container_air .container_air_map {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background-color: #1f3b79;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_map {
    height: auto;
    aspect-ratio: 768/758;
    margin-top: 160px;
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_map {
    aspect-ratio: 375/580;
    margin-top: 160px;
  }
}
.container_air .container_air_map_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.container_air .container_air_map_bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.container_air .container_air_map_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.container_air .container_air_map_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.container_air .container_air_map_line svg {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_map_line {
    display: none;
  }
}
.container_air .container_air_map_dots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_map_dots {
    display: none;
  }
}
.container_air .ca_map_dot {
  position: absolute;
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  background-color: #3bb7f3;
  border: 3px solid #FFFFFF;
  border-radius: 50%;
}
.container_air .ca_map_dot.ca_map_dot--korea {
  left: max(1057px * var(--base-ratio), 1057 / var(--base-size) * var(--base-percent));
  top: max(786px * var(--base-ratio), 786 / var(--base-size) * var(--base-percent));
  background: none;
  border: none;
  border-radius: 0;
}
.container_air .ca_map_dot.cai_dot_01 {
  left: max(455px * var(--base-ratio), 455 / var(--base-size) * var(--base-percent));
  top: max(637px * var(--base-ratio), 637 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_02 {
  left: max(332px * var(--base-ratio), 332 / var(--base-size) * var(--base-percent));
  top: max(757px * var(--base-ratio), 757 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_03 {
  left: max(577px * var(--base-ratio), 577 / var(--base-size) * var(--base-percent));
  top: max(752px * var(--base-ratio), 752 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_04 {
  left: max(399px * var(--base-ratio), 399 / var(--base-size) * var(--base-percent));
  top: max(960px * var(--base-ratio), 960 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_05 {
  left: max(666px * var(--base-ratio), 666 / var(--base-size) * var(--base-percent));
  top: max(808px * var(--base-ratio), 808 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_06 {
  left: max(968px * var(--base-ratio), 968 / var(--base-size) * var(--base-percent));
  top: max(644px * var(--base-ratio), 644 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_07 {
  left: max(1237px * var(--base-ratio), 1237 / var(--base-size) * var(--base-percent));
  top: max(627px * var(--base-ratio), 627 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_08 {
  left: max(1146px * var(--base-ratio), 1146 / var(--base-size) * var(--base-percent));
  top: max(574px * var(--base-ratio), 574 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_09 {
  left: max(962px * var(--base-ratio), 962 / var(--base-size) * var(--base-percent));
  top: max(518px * var(--base-ratio), 518 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_10 {
  left: max(1328px * var(--base-ratio), 1328 / var(--base-size) * var(--base-percent));
  top: max(488px * var(--base-ratio), 488 / var(--base-size) * var(--base-percent));
}
.container_air .ca_map_dot.cai_dot_11 {
  left: max(1589px * var(--base-ratio), 1589 / var(--base-size) * var(--base-percent));
  top: max(648px * var(--base-ratio), 648 / var(--base-size) * var(--base-percent));
}
.container_air .container_air_map_txt {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 767px) {
  .container_air .container_air_map_txt {
    width: 100%;
  }
}
.container_air .container_air_map_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_map_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_map_heading {
    font-size: var(--fs-h2-mob);
  }
}
.container_air .container_air_map_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.container_air .container_air_map_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_map_desc {
    font-size: var(--fs-p1-tab);
  }
}
.container_air .container_air_map_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_numbers {
    flex-direction: column;
    gap: 60px;
  }
  .container_air .container_air_numbers_title {
    width: auto;
  }
  .container_air .container_air_numbers_cards {
    gap: 20px;
  }
  .container_air .container_air_num_card {
    width: 216px;
    height: 180px;
    padding: 24px 20px 28px 20px;
    border-radius: 12px;
  }
  .container_air .container_air_num_card_head {
    gap: 0;
  }
  .container_air .container_air_num_card_top {
    align-items: flex-start;
    padding-left: 0;
  }
  .container_air .container_air_num_card_icon {
    width: 36px;
    height: 36px;
  }
  .container_air .container_air_num_card_sub {
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .container_air .container_air_num_card_sub {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .container_air .container_air_num_card_unit {
    padding-bottom: 5px;
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_contact {
    padding: 120px 0;
  }
  .container_air .container_air_contact_card {
    padding: 32px 20px;
  }
  .container_air .container_air_contact_label {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 16px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .container_air .container_air_contact_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .container_air .container_air_contact_label {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_contact_rows {
    gap: 12px;
  }
  .container_air .container_air_contact_row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    grid-template-columns: none;
    height: auto;
    gap: 8px;
    padding: 16px 20px;
  }
  .container_air .container_air_contact_cell {
    flex: 0 0 auto;
    justify-self: auto;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
  }
  .container_air .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
    flex: 0 0 auto;
    justify-self: auto;
    justify-content: flex-start;
    gap: 4px;
    min-width: 0;
    width: auto;
  }
  .container_air .container_air_contact_divider {
    display: none;
  }
  .container_air .container_air_contact_icon {
    width: 16px;
    height: 16px;
  }
  .container_air .container_air_contact_text {
    font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .container_air .container_air_contact_text {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .container_air .container_air_numbers {
    margin-top: 80px;
  }
  .container_air .container_air_numbers_cards {
    flex-direction: column;
    width: 100%;
  }
  .container_air .container_air_num_card {
    width: 100%;
    height: 160px;
  }
  .container_air .container_air_num_card_top {
    align-items: center;
  }
  .container_air .container_air_num_card_label br {
    display: none;
  }
}

.energy_grain {
  position: relative;
}
.energy_grain .steel_hero .intro_page_title {
  z-index: 5;
}
.energy_grain .steel_intro_txt {
  width: max(711px * var(--base-ratio), 711 / var(--base-size) * var(--base-percent));
}
.energy_grain .steel_intro_marquee_track {
  left: 0;
}
.energy_grain .steel_intro_card_set {
  aspect-ratio: 3900/1080;
}
.energy_grain .egi_card_01 {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 8.0512820513%;
  height: 31.9444444444%;
}
.energy_grain .egi_card_02 {
  position: absolute;
  left: 21.9743589744%;
  top: 0%;
  width: 8.7435897436%;
  height: 21.2962962963%;
}
.energy_grain .egi_card_03 {
  position: absolute;
  left: 40.5384615385%;
  top: 18.4259259259%;
  width: 10.5128205128%;
  height: 24.1666666667%;
}
.energy_grain .egi_card_04 {
  position: absolute;
  left: 4.4358974359%;
  top: 72.8703703704%;
  width: 7.6666666667%;
  height: 18.7962962963%;
}
.energy_grain .egi_card_05 {
  position: absolute;
  left: 27.6923076923%;
  top: 76.8518518519%;
  width: 11.2564102564%;
  height: 23.1481481481%;
}
.energy_grain .egi_card_06 {
  position: absolute;
  left: 53.4102564103%;
  top: 75.0925925926%;
  width: 7.5641025641%;
  height: 24.9074074074%;
}
.energy_grain .egi_card_07 {
  position: absolute;
  left: 62.3333333333%;
  top: 0%;
  width: 12.3846153846%;
  height: 25.6481481481%;
}
.energy_grain .egi_card_08 {
  position: absolute;
  left: 73.4871794872%;
  top: 71.0185185185%;
  width: 9.0512820513%;
  height: 22.2222222222%;
}
.energy_grain .egi_card_09 {
  position: absolute;
  left: 87.7571794872%;
  top: 19.6296296296%;
  width: 8.7692307692%;
  height: 20.6481481481%;
}
.energy_grain .energy_grain_numbers {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_numbers {
    display: block;
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_numbers {
    margin-top: 80px;
  }
}
.energy_grain .energy_grain_numbers_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_numbers_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_numbers_title {
    font-size: var(--fs-h2-mob);
  }
}
.energy_grain .energy_grain_numbers_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(348px * var(--base-ratio), 348 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_numbers_title {
    width: 100%;
  }
}
.energy_grain .energy_grain_numbers_cards {
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_numbers_cards {
    width: 100%;
    margin-top: 60px;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_numbers_cards {
    grid-template-columns: 1fr;
    margin-top: 40px;
  }
}
.energy_grain .energy_grain_num_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card {
    min-height: 180px;
    height: auto;
    padding: 24px 20px 24px 20px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_num_card {
    height: 160px;
    padding: 24px 20px 28px 20px;
  }
}
.energy_grain .energy_grain_num_card_head {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_head {
    gap: 4px;
  }
}
.energy_grain .energy_grain_num_card_top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_top {
    padding-left: 0;
    gap: 20px;
  }
}
.energy_grain .energy_grain_num_card_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_num_card_label {
    font-size: var(--fs-h5-mob);
  }
}
.energy_grain .energy_grain_num_card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.energy_grain .energy_grain_num_card_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_icon {
    width: 36px;
    height: 36px;
  }
}
.energy_grain .energy_grain_num_card_sub {
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_sub {
    font-size: 12px;
  }
}
.energy_grain .energy_grain_num_card_sub {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #818286;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_sub {
    padding-left: 0;
  }
}
.energy_grain .energy_grain_num_card_bottom {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_bottom {
    gap: 4px;
  }
}
.energy_grain .energy_grain_num_card_value {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_value {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_num_card_value {
    font-size: var(--fs-d3-mob);
  }
}
.energy_grain .energy_grain_num_card_value {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #025997;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.energy_grain .energy_grain_num_card_unit {
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_unit {
    font-size: 16px;
  }
}
.energy_grain .energy_grain_num_card_unit {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_num_card_unit {
    padding-bottom: 5px;
  }
}
.energy_grain .energy_grain_flow {
  position: relative;
  width: 100%;
  padding: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent)) 0;
  background-color: #e8f3fe;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow {
    padding: 120px 0;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_flow {
    padding: 120px 0 100px;
  }
}
.energy_grain .energy_grain_flow_txt {
  width: max(997px * var(--base-ratio), 997 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_txt {
    width: 665px;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_flow_txt {
    width: calc(100% - 40px);
  }
}
.energy_grain .energy_grain_flow_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_flow_title {
    font-size: var(--fs-h2-mob);
  }
}
.energy_grain .energy_grain_flow_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
}
.energy_grain .energy_grain_flow_desc {
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_desc {
    font-size: var(--fs-p1-tab);
  }
}
.energy_grain .energy_grain_flow_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_desc {
    margin-top: 20px;
  }
}
.energy_grain .energy_grain_flow_diagram_image {
  display: none;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_diagram_image {
    display: block;
    width: 688px;
    margin: 48px auto 0;
  }
  .energy_grain .energy_grain_flow_diagram_image picture,
  .energy_grain .energy_grain_flow_diagram_image picture img {
    width: 100%;
    height: auto;
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_flow_diagram_image {
    width: 335px;
    margin: 40px auto 0;
  }
}
.energy_grain .energy_grain_flow_diagram {
  position: relative;
  width: max(1220px * var(--base-ratio), 1220 / var(--base-size) * var(--base-percent));
  height: max(598px * var(--base-ratio), 598 / var(--base-size) * var(--base-percent));
  margin: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) auto 0;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_flow_diagram {
    display: none;
  }
}
.energy_grain .energy_grain_flow_arrows {
  position: absolute;
  top: max(261px * var(--base-ratio), 261 / var(--base-size) * var(--base-percent));
  left: max(173px * var(--base-ratio), 173 / var(--base-size) * var(--base-percent));
  width: max(874px * var(--base-ratio), 874 / var(--base-size) * var(--base-percent));
  height: max(254px * var(--base-ratio), 254 / var(--base-size) * var(--base-percent));
  pointer-events: none;
  z-index: 3;
}
.energy_grain .energy_grain_flow_card {
  position: absolute;
  background-color: #FFFFFF;
  box-shadow: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) 0 #d1e8fe;
  z-index: 1;
}
.energy_grain .eg_flow_card--left {
  top: max(63px * var(--base-ratio), 63 / var(--base-size) * var(--base-percent));
  left: max(1px * var(--base-ratio), 1 / var(--base-size) * var(--base-percent));
  width: max(380px * var(--base-ratio), 380 / var(--base-size) * var(--base-percent));
  height: max(535px * var(--base-ratio), 535 / var(--base-size) * var(--base-percent));
  border-radius: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) 0 0 max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--center {
  top: 0;
  left: max(358px * var(--base-ratio), 358 / var(--base-size) * var(--base-percent));
  width: max(500px * var(--base-ratio), 500 / var(--base-size) * var(--base-percent));
  height: max(598px * var(--base-ratio), 598 / var(--base-size) * var(--base-percent));
  border: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent)) solid #016cae;
  border-radius: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
.energy_grain .eg_flow_card--right {
  top: max(63px * var(--base-ratio), 63 / var(--base-size) * var(--base-percent));
  left: max(838px * var(--base-ratio), 838 / var(--base-size) * var(--base-percent));
  width: max(380px * var(--base-ratio), 380 / var(--base-size) * var(--base-percent));
  height: max(535px * var(--base-ratio), 535 / var(--base-size) * var(--base-percent));
  border-radius: 0 max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) 0;
}
.energy_grain .eg_flow_card_icon {
  position: absolute;
  top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card_icon img,
.energy_grain .eg_flow_card_icon svg {
  width: 100%;
  height: 100%;
}
.energy_grain .eg_flow_card--left .eg_flow_card_icon {
  left: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--right .eg_flow_card_icon {
  left: max(170px * var(--base-ratio), 170 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card_title {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .eg_flow_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .eg_flow_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.energy_grain .eg_flow_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  text-align: center;
}
.energy_grain .eg_flow_card--left .eg_flow_card_title {
  left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  right: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--right .eg_flow_card_title {
  left: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  right: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card_logo {
  position: absolute;
  top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card_badge {
  position: absolute;
  top: max(146px * var(--base-ratio), 146 / var(--base-size) * var(--base-percent));
  left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(420px * var(--base-ratio), 420 / var(--base-size) * var(--base-percent));
  height: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .eg_flow_card_badge {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .eg_flow_card_badge {
    font-size: var(--fs-h5-mob);
  }
}
.energy_grain .eg_flow_card_badge {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  background-color: #025997;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card_steps {
  position: absolute;
  top: max(175px * var(--base-ratio), 175 / var(--base-size) * var(--base-percent));
  width: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  height: max(300px * var(--base-ratio), 300 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--left .eg_flow_card_steps {
  left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--right .eg_flow_card_steps {
  left: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_card--center .eg_flow_card_steps {
  top: max(238px * var(--base-ratio), 238 / var(--base-size) * var(--base-percent));
  left: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(420px * var(--base-ratio), 420 / var(--base-size) * var(--base-percent));
  height: max(300px * var(--base-ratio), 300 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_step {
  position: absolute;
  left: 0;
  width: 100%;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .eg_flow_step {
    font-size: 16px;
  }
}
.energy_grain .eg_flow_step {
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-align: center;
}
.energy_grain .eg_flow_step--r0 {
  top: 0;
}
.energy_grain .eg_flow_step--r1 {
  top: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_step--r2 {
  top: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_step--r4 {
  top: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
}
.energy_grain .eg_flow_step--outline-gray {
  background-color: #FFFFFF;
  border: 1px solid #d1d2d4;
  color: #6d6e72;
  font-weight: 400;
}
.energy_grain .eg_flow_step--outline-blue {
  background-color: #FFFFFF;
  border: 1px solid #00A3F1;
  color: #00A3F1;
  font-weight: 400;
}
.energy_grain .eg_flow_step--light {
  background-color: #e8f3fe;
  border: 1px solid #d1e8fe;
  color: #025997;
  font-weight: 600;
}
.energy_grain .eg_flow_step--filled {
  background-color: #00A3F1;
  color: #FFFFFF;
  font-weight: 700;
}
.energy_grain .energy_grain_map {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background-color: #102864;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map {
    height: auto;
    aspect-ratio: 768/756;
    margin-top: 160px;
    background-color: #1F3B79;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_map {
    aspect-ratio: 375/589;
    margin-top: 160px;
  }
}
.energy_grain .energy_grain_map_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.energy_grain .energy_grain_map_bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.energy_grain .energy_grain_map_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.energy_grain .energy_grain_map_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.energy_grain .energy_grain_map_line svg {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_line {
    display: none;
  }
}
.energy_grain .energy_grain_map_spots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.energy_grain .energy_grain_map_spot {
  position: absolute;
  opacity: 0;
}
.energy_grain .energy_grain_map_spot.spot_eg_usa {
  left: max(1294px * var(--base-ratio), 1294 / var(--base-size) * var(--base-percent));
  top: max(466px * var(--base-ratio), 466 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_south_america {
  left: max(1446px * var(--base-ratio), 1446 / var(--base-size) * var(--base-percent));
  top: max(748px * var(--base-ratio), 748 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_asia {
  left: max(696px * var(--base-ratio), 696 / var(--base-size) * var(--base-percent));
  top: max(511px * var(--base-ratio), 511 / var(--base-size) * var(--base-percent));
  width: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
  height: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_romania_ukraine {
  left: max(300px * var(--base-ratio), 300 / var(--base-size) * var(--base-percent));
  top: max(470px * var(--base-ratio), 470 / var(--base-size) * var(--base-percent));
  width: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
  height: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_australia {
  left: max(775px * var(--base-ratio), 775 / var(--base-size) * var(--base-percent));
  top: max(828px * var(--base-ratio), 828 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_vietnam {
  left: max(641px * var(--base-ratio), 641 / var(--base-size) * var(--base-percent));
  top: max(654px * var(--base-ratio), 654 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_north_africa {
  left: max(233px * var(--base-ratio), 233 / var(--base-size) * var(--base-percent));
  top: max(618px * var(--base-ratio), 618 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_middle_east {
  left: max(439px * var(--base-ratio), 439 / var(--base-size) * var(--base-percent));
  top: max(579px * var(--base-ratio), 579 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_south_africa {
  left: max(352px * var(--base-ratio), 352 / var(--base-size) * var(--base-percent));
  top: max(744px * var(--base-ratio), 744 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
.energy_grain .energy_grain_map_spot.spot_eg_mexico {
  left: max(1267px * var(--base-ratio), 1267 / var(--base-size) * var(--base-percent));
  top: max(608px * var(--base-ratio), 608 / var(--base-size) * var(--base-percent));
  width: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
  height: max(130px * var(--base-ratio), 130 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_spot.spot_eg_usa {
    left: 69.078125%;
    top: 54.2328042328%;
    width: 9.8307291667%;
    height: 9.9867724868%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_south_america {
    left: 78.0833333333%;
    top: 71.2063492063%;
    width: 9.8307291667%;
    height: 9.9867724868%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_asia {
    left: 33.6471354167%;
    top: 56.9417989418%;
    width: 9.3619791667%;
    height: 9.5105820106%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_romania_ukraine {
    left: 10.1848958333%;
    top: 54.4735449735%;
    width: 9.3619791667%;
    height: 9.5105820106%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_australia {
    left: 38.328125%;
    top: 76.0211640212%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_vietnam {
    left: 30.3893229167%;
    top: 65.5476190476%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_north_africa {
    left: 6.2161458333%;
    top: 63.380952381%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_middle_east {
    left: 18.4205729167%;
    top: 61.0343915344%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_south_africa {
    left: 13.265625%;
    top: 70.9656084656%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_mexico {
    left: 67.4778645833%;
    top: 62.7791005291%;
    width: 7.7018229167%;
    height: 7.8240740741%;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_map_spot.spot_eg_usa {
    left: 76.6186666667%;
    top: 66.8505942275%;
    width: 11.7973333333%;
    height: 7.5110356537%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_south_america {
    left: 87.424%;
    top: 79.6112054329%;
    width: 11.7973333333%;
    height: 7.5110356537%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_asia {
    left: 34.1173333333%;
    top: 68.8862478778%;
    width: 11.2293333333%;
    height: 7.1494057725%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_romania_ukraine {
    left: 5.9706666667%;
    top: 67.0322580645%;
    width: 11.2293333333%;
    height: 7.1494057725%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_australia {
    left: 39.7306666667%;
    top: 83.2308998302%;
    width: 9.24%;
    height: 5.882852292%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_vietnam {
    left: 30.208%;
    top: 75.3582342954%;
    width: 9.24%;
    height: 5.882852292%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_north_africa {
    left: 1.208%;
    top: 73.7283531409%;
    width: 9.24%;
    height: 5.882852292%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_middle_east {
    left: 15.8506666667%;
    top: 71.9643463497%;
    width: 9.24%;
    height: 5.882852292%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_south_africa {
    left: 9.6666666667%;
    top: 79.4312393888%;
    width: 9.24%;
    height: 5.882852292%;
  }
  .energy_grain .energy_grain_map_spot.spot_eg_mexico {
    left: 74.7013333333%;
    top: 73.2767402377%;
    width: 9.24%;
    height: 5.882852292%;
  }
}
.energy_grain .energy_grain_map_txt {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_txt {
    top: 10.582010582%;
    width: 67.4479166667%;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_map_txt {
    top: 9.8471986418%;
    width: 84.8%;
    gap: 20px;
  }
}
.energy_grain .energy_grain_map_txt .energy_grain_map_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_heading {
    font-size: var(--fs-h2-mob);
  }
}
.energy_grain .energy_grain_map_txt .energy_grain_map_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_heading {
    font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_heading {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_heading {
    font-size: var(--fs-h1-mob);
  }
}
.energy_grain .energy_grain_map_txt .energy_grain_map_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .energy_grain .energy_grain_map_txt .energy_grain_map_desc {
    font-size: var(--fs-p1-tab);
  }
}
.energy_grain .energy_grain_map_txt .energy_grain_map_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}

.cts {
  position: relative;
}
.cts .steel_intro_txt {
  width: max(956px * var(--base-ratio), 956 / var(--base-size) * var(--base-percent));
}
.cts .steel_intro_marquee_track {
  left: 0;
}
.cts .steel_intro_card_set {
  aspect-ratio: 4381/1237;
}
.cts .cts_card_01 {
  position: absolute;
  left: 5.5238530016%;
  top: 0%;
  width: 7.7836110477%;
  height: 33.3872271625%;
}
.cts .cts_card_02 {
  position: absolute;
  left: 10.0890207715%;
  top: 67.4211802749%;
  width: 6.824925816%;
  height: 18.1083265966%;
}
.cts .cts_card_03 {
  position: absolute;
  left: 25.7018945446%;
  top: 0%;
  width: 7.7836110477%;
  height: 24.2522231205%;
}
.cts .cts_card_04 {
  position: absolute;
  left: 30.7920566081%;
  top: 74.7776879547%;
  width: 10.020543255%;
  height: 21.4227970897%;
}
.cts .cts_card_05 {
  position: absolute;
  left: 42.2278018717%;
  top: 21.5844785772%;
  width: 7.7836110477%;
  height: 21.0994341148%;
}
.cts .cts_card_06 {
  position: absolute;
  left: 61.6297648939%;
  top: 9.9434114794%;
  width: 11.0248801643%;
  height: 18.4316895715%;
}
.cts .cts_card_07 {
  position: absolute;
  left: 53.6863729742%;
  top: 71.0590137429%;
  width: 6.7336224606%;
  height: 28.9409862571%;
}
.cts .cts_card_08 {
  position: absolute;
  left: 71.5590047934%;
  top: 68.1487469685%;
  width: 6.2314540059%;
  height: 19.4017784964%;
}
.cts .cts_card_09 {
  position: absolute;
  left: 84.2729970326%;
  top: 22.6354082458%;
  width: 7.8064368866%;
  height: 18.0274858529%;
}
.cts .cts_numbers {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_numbers {
    flex-direction: column;
    gap: 60px;
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_numbers {
    gap: 60px;
    margin-top: 80px;
  }
}
.cts .cts_numbers_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_numbers_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_numbers_title {
    font-size: var(--fs-h2-mob);
  }
}
.cts .cts_numbers_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(500px * var(--base-ratio), 500 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .cts .cts_numbers_title {
    width: auto;
  }
}
.cts .cts_numbers_cards {
  display: flex;
  gap: max(21px * var(--base-ratio), 21 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_numbers_cards {
    width: 100%;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_numbers_cards {
    flex-direction: column;
    width: 100%;
    gap: 20px;
  }
}
.cts .cts_num_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: max(276px * var(--base-ratio), 276 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card {
    flex: 1;
    width: auto;
    height: 180px;
    padding: 24px 20px 28px 20px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_num_card {
    flex: none;
    width: 100%;
    height: 180px;
    padding: 24px 20px 28px 20px;
  }
}
.cts .cts_num_card_top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_top {
    padding-left: 0;
    gap: 20px;
  }
}
.cts .cts_num_card_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_num_card_label {
    font-size: var(--fs-h5-mob);
  }
}
.cts .cts_num_card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.cts .cts_num_card_icon {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_icon {
    width: 36px;
    height: 36px;
  }
}
.cts .cts_num_card_bottom {
  display: flex;
  flex-direction: column;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
  min-height: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_bottom {
    gap: 4px;
    min-height: 60px;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_num_card_bottom {
    gap: 8px;
    min-height: 0;
  }
}
.cts .cts_num_card_numbers {
  display: flex;
  align-items: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_numbers {
    gap: 4px;
  }
}
.cts .cts_num_card_value {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-d3-pc) * 1px * var(--base-ratio), var(--fs-d3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_value {
    font-size: var(--fs-d3-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_num_card_value {
    font-size: var(--fs-d3-mob);
  }
}
.cts .cts_num_card_value {
  letter-spacing: -0.03em;
  font-weight: 500;
  line-height: 1;
  color: #025997;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.cts .cts_num_card_unit {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_unit {
    font-size: 16px;
  }
}
.cts .cts_num_card_unit {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6d6e72;
  padding-bottom: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_unit {
    padding-bottom: 5px;
  }
}
.cts .cts_num_card_sub {
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_num_card_sub {
    font-size: 12px;
  }
}
.cts .cts_num_card_sub {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #818286;
}
.cts .steel_process_bg {
  background: #FFFFFF;
}
.cts .cts_process_bg_img {
  position: absolute;
  inset: 0;
}
.cts .cts_process_bg_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cts .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.cts .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.cts .cts_process_note {
  display: none;
}
@media screen and (min-width: 1025px) {
  .cts .steel_process_txt {
    width: max(455px * var(--base-ratio), 455 / var(--base-size) * var(--base-percent));
  }
  .cts .steel_process_panel {
    top: 50%;
    right: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
    transform: translateY(-50%);
    width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  }
  .cts .steel_process_ui {
    gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  }
  .cts .steel_process_conts {
    gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
    padding-left: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  }
  .cts .steel_process_steps {
    width: max(197px * var(--base-ratio), 197 / var(--base-size) * var(--base-percent));
    gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  }
  .cts .cts_process_note {
    display: flex;
    align-self: stretch;
    gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
    padding: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
    background: #F3F3F3;
    border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  }
  .cts .cts_process_note_mark {
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
    color: #818286;
    flex-shrink: 0;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1024px) {
  .cts .cts_process_note_mark {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .cts .cts_process_note_text {
    font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
    color: #818286;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1024px) {
  .cts .cts_process_note_text {
    font-size: 14px;
  }
}
.cts .cts_map {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background-color: #102864;
}
@media screen and (max-width: 1024px) {
  .cts .cts_map {
    height: auto;
    aspect-ratio: 768/758;
    margin-top: 160px;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_map {
    aspect-ratio: 375/580;
    margin-top: 160px;
  }
}
.cts .cts_map_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.cts .cts_map_bg picture {
  display: block;
  width: 100%;
  height: 100%;
}
.cts .cts_map_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cts .cts_map_line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.cts .cts_map_line svg {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .cts .cts_map_line {
    display: none;
  }
}
.cts .cts_map_spots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.cts .cts_map_spot {
  position: absolute;
  opacity: 0;
}
.cts .cts_map_spot.cts_spot_canada {
  left: max(1236px * var(--base-ratio), 1236 / var(--base-size) * var(--base-percent));
  top: max(358px * var(--base-ratio), 358 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_russia {
  left: max(582px * var(--base-ratio), 582 / var(--base-size) * var(--base-percent));
  top: max(329px * var(--base-ratio), 329 / var(--base-size) * var(--base-percent));
  width: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
  height: max(172px * var(--base-ratio), 172 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_usa {
  left: max(1330px * var(--base-ratio), 1330 / var(--base-size) * var(--base-percent));
  top: max(512px * var(--base-ratio), 512 / var(--base-size) * var(--base-percent));
  width: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
  height: max(166px * var(--base-ratio), 166 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_south_africa {
  left: max(257px * var(--base-ratio), 257 / var(--base-size) * var(--base-percent));
  top: max(769px * var(--base-ratio), 769 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_thailand {
  left: max(594px * var(--base-ratio), 594 / var(--base-size) * var(--base-percent));
  top: max(623px * var(--base-ratio), 623 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_indonesia {
  left: max(725px * var(--base-ratio), 725 / var(--base-size) * var(--base-percent));
  top: max(689px * var(--base-ratio), 689 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
.cts .cts_map_spot.cts_spot_australia {
  left: max(846px * var(--base-ratio), 846 / var(--base-size) * var(--base-percent));
  top: max(814px * var(--base-ratio), 814 / var(--base-size) * var(--base-percent));
  width: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
  height: max(152px * var(--base-ratio), 152 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_map_spot.cts_spot_canada {
    left: 66.1809895833%;
    top: 51.0910290237%;
    width: 10.0169270833%;
    height: 10.1490765172%;
  }
  .cts .cts_map_spot.cts_spot_russia {
    left: 26.7161458333%;
    top: 49.3179419525%;
    width: 10.37890625%;
    height: 10.5158311346%;
  }
  .cts .cts_map_spot.cts_spot_usa {
    left: 71.8528645833%;
    top: 60.5065963061%;
    width: 10.0169270833%;
    height: 10.1490765172%;
  }
  .cts .cts_map_spot.cts_spot_south_africa {
    left: 7.1041666667%;
    top: 76.2189973615%;
    width: 9.171875%;
    height: 9.2928759894%;
  }
  .cts .cts_map_spot.cts_spot_thailand {
    left: 27.4401041667%;
    top: 67.2928759894%;
    width: 9.171875%;
    height: 9.2928759894%;
  }
  .cts .cts_map_spot.cts_spot_indonesia {
    left: 35.3450520833%;
    top: 71.3284960422%;
    width: 9.171875%;
    height: 9.2928759894%;
  }
  .cts .cts_map_spot.cts_spot_australia {
    left: 42.6471354167%;
    top: 78.9709762533%;
    width: 9.171875%;
    height: 9.2928759894%;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_map_spot.cts_spot_canada {
    left: 67.6%;
    top: 67.9448275862%;
    width: 10.544%;
    height: 6.8172413793%;
  }
  .cts .cts_map_spot.cts_spot_russia {
    left: 26.056%;
    top: 66.7534482759%;
    width: 10.9253333333%;
    height: 7.0637931034%;
  }
  .cts .cts_map_spot.cts_spot_usa {
    left: 73.5733333333%;
    top: 74.2689655172%;
    width: 10.544%;
    height: 6.8172413793%;
  }
  .cts .cts_map_spot.cts_spot_south_africa {
    left: 5.4106666667%;
    top: 84.825862069%;
    width: 9.656%;
    height: 6.2431034483%;
  }
  .cts .cts_map_spot.cts_spot_thailand {
    left: 26.8186666667%;
    top: 78.8293103448%;
    width: 9.656%;
    height: 6.2431034483%;
  }
  .cts .cts_map_spot.cts_spot_indonesia {
    left: 35.1386666667%;
    top: 81.5396551724%;
    width: 9.656%;
    height: 6.2431034483%;
  }
  .cts .cts_map_spot.cts_spot_australia {
    left: 42.8266666667%;
    top: 86.674137931%;
    width: 9.656%;
    height: 6.2431034483%;
  }
}
.cts .cts_map_spot--korea {
  left: max(809px * var(--base-ratio), 809 / var(--base-size) * var(--base-percent));
  top: max(606px * var(--base-ratio), 606 / var(--base-size) * var(--base-percent));
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .cts_map_spot--korea {
    left: 40.4140625%;
    top: 66.253298153%;
    width: 0.8450520833%;
    height: 0.8562005277%;
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_map_spot--korea {
    left: 40.4746666667%;
    top: 78.1310344828%;
    width: 0.8906666667%;
    height: 0.575862069%;
  }
}
.cts .cts_map_txt {
  position: absolute;
  top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (min-width: 1025px) {
  .cts .cts_map_txt {
    width: max(1200px * var(--base-ratio), 1200 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_map_txt {
    width: calc(100% - 40px);
  }
}
.cts .cts_map_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_map_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .cts_map_heading {
    font-size: var(--fs-h2-mob);
  }
}
.cts .cts_map_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.cts .cts_map_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .cts_map_desc {
    font-size: var(--fs-p1-tab);
  }
}
.cts .cts_map_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.cts .container_air_contact {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact {
    flex-direction: column;
    gap: 60px;
    padding: 120px 0;
  }
}
.cts .container_air_contact_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .container_air_contact_title {
    font-size: var(--fs-h3-mob);
  }
}
.cts .container_air_contact_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  width: max(451px * var(--base-ratio), 451 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_title {
    width: auto;
  }
}
.cts .container_air_contact_card {
  width: max(722px * var(--base-ratio), 722 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  background-color: #F3F3F3;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_card {
    width: 100%;
    padding: 32px 20px;
    border-radius: 12px;
  }
}
.cts .container_air_contact_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .cts .container_air_contact_label {
    font-size: var(--fs-h5-mob);
  }
}
.cts .container_air_contact_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  margin-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_label {
    margin-bottom: 16px;
  }
}
.cts .container_air_contact_rows {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_rows {
    gap: 12px;
  }
}
.cts .container_air_contact_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background-color: #FFFFFF;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: 53px;
    padding: 16px;
    border-radius: 8px;
  }
}
.cts .container_air_contact_cell {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  flex: 1;
  padding-left: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_cell {
    flex: initial;
    justify-self: center;
    justify-content: flex-start;
    gap: 6px;
    min-width: 240px;
    padding-left: 0;
  }
}
.cts .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
  padding-left: max(76px * var(--base-ratio), 76 / var(--base-size) * var(--base-percent));
  flex: 0 0 auto;
  width: max(270px * var(--base-ratio), 270 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
    flex: initial;
    justify-self: center;
    justify-content: center;
    min-width: 150px;
    padding-left: 0;
    width: auto;
  }
}
.cts .container_air_contact_icon {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_icon {
    width: 20px;
    height: 20px;
  }
}
.cts .container_air_contact_text {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_text {
    font-size: 14px;
  }
}
.cts .container_air_contact_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
.cts .container_air_contact_divider {
  display: block;
  width: 1px;
  height: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  background-color: #d1d2d4;
}
@media screen and (max-width: 1024px) {
  .cts .container_air_contact_divider {
    height: 18px;
  }
}
@media screen and (max-width: 767px) {
  .cts .container_air_contact {
    padding: 120px 0;
  }
  .cts .container_air_contact_card {
    padding: 32px 20px;
  }
  .cts .container_air_contact_label {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 16px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .cts .container_air_contact_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cts .container_air_contact_label {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 767px) {
  .cts .container_air_contact_rows {
    gap: 12px;
  }
  .cts .container_air_contact_row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    grid-template-columns: none;
    height: auto;
    gap: 8px;
    padding: 16px 20px;
  }
  .cts .container_air_contact_cell {
    flex: 0 0 auto;
    justify-self: auto;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
  }
  .cts .container_air_contact_cell + .container_air_contact_divider + .container_air_contact_cell {
    flex: 0 0 auto;
    justify-self: auto;
    justify-content: flex-start;
    gap: 4px;
    min-width: 0;
    width: auto;
  }
  .cts .container_air_contact_divider {
    display: none;
  }
  .cts .container_air_contact_icon {
    width: 16px;
    height: 16px;
  }
  .cts .container_air_contact_text {
    font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .cts .container_air_contact_text {
    font-size: 14px;
  }
}

.project {
  position: relative;
}
.project .steel_intro_txt {
  width: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
}
.project .steel_process_bg {
  background: #FFFFFF;
}
.project .steel_process_txt {
  width: max(523px * var(--base-ratio), 523 / var(--base-size) * var(--base-percent));
}
.project .project_process_bg_img {
  position: absolute;
  inset: 0;
}
.project .project_process_bg_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.project .fm_process_webgl {
  position: absolute;
  inset: 0;
}
.project .fm_process_webgl canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.project .steel_intro_overlay .steel_intro_card_set {
  aspect-ratio: 4082/1237;
}
.project .steel_intro_overlay .pi_card_01 {
  position: absolute;
  left: 4.1891229789%;
  top: 0%;
  width: 8.3537481627%;
  height: 33.3872271625%;
}
.project .steel_intro_overlay .pi_card_02 {
  position: absolute;
  left: 9.0886820186%;
  top: 67.4211802749%;
  width: 7.3248407643%;
  height: 18.1083265966%;
}
.project .steel_intro_overlay .pi_card_03 {
  position: absolute;
  left: 25.8451739343%;
  top: 0%;
  width: 8.3537481627%;
  height: 24.2522231205%;
}
.project .steel_intro_overlay .pi_card_04 {
  position: absolute;
  left: 31.3081822636%;
  top: 74.7776879547%;
  width: 10.7545320921%;
  height: 21.4227970897%;
}
.project .steel_intro_overlay .pi_card_05 {
  position: absolute;
  left: 43.581577658%;
  top: 21.5844785772%;
  width: 8.3537481627%;
  height: 21.0994341148%;
}
.project .steel_intro_overlay .pi_card_06 {
  position: absolute;
  left: 55.8794708476%;
  top: 71.0590137429%;
  width: 7.2268495835%;
  height: 28.9409862571%;
}
.project .steel_intro_overlay .pi_card_07 {
  position: absolute;
  left: 64.4047035767%;
  top: 9.9434114794%;
  width: 11.8324350808%;
  height: 18.4316895715%;
}
.project .steel_intro_overlay .pi_card_08 {
  position: absolute;
  left: 75.061244488%;
  top: 68.1487469685%;
  width: 6.6878980892%;
  height: 19.4017784964%;
}
.project .steel_intro_overlay .pi_card_09 {
  position: absolute;
  left: 88.7065164135%;
  top: 22.6354082458%;
  width: 8.3782459579%;
  height: 18.0274858529%;
}

.project_process_note {
  display: flex;
  align-items: flex-start;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  padding: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  align-self: stretch;
}
.project_process_note .project_process_note_mark {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_process_note .project_process_note_mark {
    font-size: 16px;
  }
}
.project_process_note .project_process_note_mark {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #818286;
}
.project_process_note .project_process_note_text {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_process_note .project_process_note_text {
    font-size: 14px;
  }
}
.project_process_note .project_process_note_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #818286;
}

.project_portfolio {
  position: relative;
  width: 100%;
  margin-top: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  padding: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent)) 0 max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}

.project_portfolio_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.project_portfolio_head .project_portfolio_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_head .project_portfolio_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_head .project_portfolio_title {
    font-size: var(--fs-h2-mob);
  }
}
.project_portfolio_head .project_portfolio_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.project_portfolio_head .project_portfolio_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_head .project_portfolio_desc {
    font-size: var(--fs-p1-tab);
  }
}
.project_portfolio_head .project_portfolio_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_head .project_portfolio_desc {
    margin: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_head .project_portfolio_desc {
    margin: 0 20px;
  }
}

.project_portfolio_list {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: 100%;
  margin: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) 0 0;
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  cursor: grab;
  user-select: none;
}
.project_portfolio_list.is_dragging {
  cursor: grabbing;
}
.project_portfolio_list::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_list {
    flex-direction: column;
    width: 100%;
    max-width: 688px;
    height: auto;
    gap: 16px;
    margin: 60px auto 0;
    padding: 0;
    overflow: visible;
    cursor: default;
    user-select: auto;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_list {
    max-width: 100%;
    padding: 0 20px;
  }
}

.project_portfolio_scrollbar {
  position: relative;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  height: 4px;
  margin: max(21px * var(--base-ratio), 21 / var(--base-size) * var(--base-percent)) auto 0;
  background: #D1D2D4;
  border-radius: 8px;
  visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_scrollbar {
    display: none;
  }
}

.project_portfolio_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: #025997;
  border-radius: 8px;
  cursor: grab;
  touch-action: none;
  will-change: transform, width;
}
.project_portfolio_scrollbar_thumb:active {
  cursor: grabbing;
}

.project_portfolio_card {
  position: relative;
  width: max(243px * var(--base-ratio), 243 / var(--base-size) * var(--base-percent));
  height: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  box-shadow: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) #D1E8FE;
  flex-shrink: 0;
  cursor: pointer;
  overflow: hidden;
  transition: width 0.4s ease, transform 0.3s;
}
@media (hover: hover) {
  .project_portfolio_card:hover {
    transform: translateY(calc(max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) * -1));
  }
}
@media screen and (min-width: 1025px) {
  html[lang=en] .project_portfolio_card {
    height: max(560px * var(--base-ratio), 560 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card {
    width: 100%;
    height: auto;
    transition: none;
  }
}
@media screen and (max-width: 1024px) and (hover: hover) {
  .project_portfolio_card:hover {
    transform: none;
  }
}
.project_portfolio_card .project_portfolio_card_collapsed {
  position: absolute;
  top: 0;
  left: 0;
  width: max(243px * var(--base-ratio), 243 / var(--base-size) * var(--base-percent));
  height: 100%;
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 2;
  opacity: 1;
  transition: opacity 0.3s 0.2s;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_collapsed {
    position: static;
    width: 100%;
    height: auto;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 24px 30px;
    gap: 30px;
    transition: none;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_collapsed {
    padding: 24px;
  }
}
.project_portfolio_card .project_portfolio_card_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_label {
    font-size: var(--fs-p1-tab);
  }
}
.project_portfolio_card .project_portfolio_card_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_label {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 600;
    line-height: 1.5;
    max-width: 580px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_label {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_label br {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_label {
    max-width: 234px;
  }
}
.project_portfolio_card .project_portfolio_card_indicator {
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max(38px * var(--base-ratio), 38 / var(--base-size) * var(--base-percent));
  height: max(38px * var(--base-ratio), 38 / var(--base-size) * var(--base-percent));
  background: #949599;
  border-radius: 50%;
  flex-shrink: 0;
}
.project_portfolio_card .project_portfolio_card_indicator img {
  width: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  height: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_indicator img {
    width: 13px;
    height: 13px;
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_indicator {
    align-self: auto;
    width: 32px;
    height: 32px;
  }
}
.project_portfolio_card .project_portfolio_card_expanded {
  position: absolute;
  top: 0;
  left: 0;
  width: max(920px * var(--base-ratio), 920 / var(--base-size) * var(--base-percent));
  height: 100%;
  padding: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent)) max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0s 0.3s;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_expanded {
    position: static;
    width: 100%;
    height: auto;
    padding: 48px 40px 64px 40px;
    gap: 40px;
    display: none;
    opacity: 1;
    visibility: visible;
    transition: none;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_expanded {
    padding: 40px 26px 48px 26px;
  }
}
.project_portfolio_card .project_portfolio_card_top {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  html[lang=en] .project_portfolio_card .project_portfolio_card_top {
    gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_top {
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_top {
    gap: 32px;
  }
}
.project_portfolio_card .project_portfolio_card_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_head {
    gap: 30px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_head {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
}
.project_portfolio_card .project_portfolio_card_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_title {
    font-size: var(--fs-h4-mob);
  }
}
.project_portfolio_card .project_portfolio_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_title {
    font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    max-width: 580px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_title {
    font-size: var(--fs-h3-mob);
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_card .project_portfolio_card_title {
    max-width: 234px;
  }
}
.project_portfolio_card .project_portfolio_card_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  padding: 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 1px solid #D1D2D4;
  border-radius: 999px;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_btn {
    font-size: 14px;
  }
}
.project_portfolio_card .project_portfolio_card_btn {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #161D27;
  text-decoration: none;
  flex-shrink: 0;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_btn {
    height: 52px;
    padding: 0 20px;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_btn {
    font-size: 16px;
  }
}
.project_portfolio_card .project_portfolio_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.project_portfolio_card .project_portfolio_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_desc {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .project_portfolio_card .project_portfolio_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.project_portfolio_card.is_active {
  width: max(920px * var(--base-ratio), 920 / var(--base-size) * var(--base-percent));
  border: 3px solid #016CAE;
  cursor: default;
}
@media (hover: hover) {
  .project_portfolio_card.is_active:hover {
    transform: none;
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card.is_active {
    width: 100%;
    height: auto;
  }
}
@media screen and (max-width: 1024px) and (hover: hover) {
  .project_portfolio_card.is_active:hover {
    transform: none;
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_card.is_active .project_portfolio_card_collapsed {
    display: none;
  }
  .project_portfolio_card.is_active .project_portfolio_card_expanded {
    display: flex;
  }
}
.project_portfolio_card.is_active .project_portfolio_card_collapsed {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.project_portfolio_card.is_active .project_portfolio_card_expanded {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s 0.3s, visibility 0s 0s;
}

.project_portfolio_popup {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}
.project_portfolio_popup.is_open {
  display: flex;
}

.project_portfolio_popup_dim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.project_portfolio_popup_inner {
  position: relative;
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_inner {
    width: 688px;
    border-radius: 16px;
    padding: 28px 48px 36px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_inner {
    width: calc(100% - 40px);
    max-width: 335px;
    padding: 28px 20px 36px;
    gap: 24px;
  }
}

.project_portfolio_popup_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_head {
    gap: 20px;
  }
}

.project_portfolio_popup_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_title {
    font-size: var(--fs-h4-mob);
  }
}
.project_portfolio_popup_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
  }
}

.project_portfolio_popup_close {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.project_portfolio_popup_close img {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_close {
    width: 40px;
    height: 40px;
  }
  .project_portfolio_popup_close img {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_close {
    width: 40px;
    height: 40px;
  }
  .project_portfolio_popup_close img {
    width: 40px;
    height: 40px;
  }
}

.project_portfolio_popup_body {
  display: flex;
  flex-direction: column;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_body {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_body {
    gap: 24px;
  }
}

.project_portfolio_popup_main {
  width: 100%;
  aspect-ratio: 750/420;
  background: #d9d9d9;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_main {
    aspect-ratio: 592/330;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_main {
    aspect-ratio: 295/164;
  }
}

.project_portfolio_popup_main_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.project_portfolio_popup_thumbs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_thumbs {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_thumbs {
    gap: 8px;
  }
}

.project_portfolio_popup_nav {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 2px solid #d1d2d4;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  flex-shrink: 0;
}
.project_portfolio_popup_nav img {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.project_portfolio_popup_nav:disabled {
  opacity: 0.3;
  cursor: default;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_nav {
    width: 40px;
    height: 40px;
  }
  .project_portfolio_popup_nav img {
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_nav {
    width: 32px;
    height: 32px;
    border-width: 1px;
  }
  .project_portfolio_popup_nav img {
    width: 16px;
    height: 16px;
  }
}

.project_portfolio_popup_thumb_list {
  width: max(415px * var(--base-ratio), 415 / var(--base-size) * var(--base-percent));
  max-width: 100%;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_thumb_list {
    width: 415px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_thumb_list {
    width: 204px;
  }
}

.project_portfolio_popup_thumb_track {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  transition: transform 0.35s ease;
  will-change: transform;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_thumb_track {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_thumb_track {
    gap: 6px;
  }
}

.project_portfolio_popup_thumb {
  width: max(125px * var(--base-ratio), 125 / var(--base-size) * var(--base-percent));
  height: max(70px * var(--base-ratio), 70 / var(--base-size) * var(--base-percent));
  padding: 0;
  border: none;
  background: #d9d9d9;
  overflow: hidden;
  cursor: pointer;
  flex-shrink: 0;
}
.project_portfolio_popup_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.project_portfolio_popup_thumb.is_active {
  outline: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)) solid #00A3F1;
  outline-offset: calc(max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)) * -1);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_popup_thumb {
    width: 125px;
    height: 70px;
  }
  .project_portfolio_popup_thumb.is_active {
    outline-width: 6px;
    outline-offset: -6px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_popup_thumb {
    width: 64px;
    height: 36px;
  }
  .project_portfolio_popup_thumb.is_active {
    outline-width: 3px;
    outline-offset: -3px;
  }
}

.project_portfolio_meta {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta {
    padding: 16px 20px;
    border-radius: 8px;
    gap: 4px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_meta {
    padding: 16px;
    gap: 10px;
  }
}

.project_portfolio_meta_row {
  display: flex;
  align-items: center;
  gap: 0;
}
@media screen and (max-width: 767px) {
  .project_portfolio_meta_row {
    align-items: flex-start;
  }
}
.project_portfolio_meta_row .project_portfolio_meta_label {
  display: inline-flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  width: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta_row .project_portfolio_meta_label {
    font-size: 14px;
  }
}
.project_portfolio_meta_row .project_portfolio_meta_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6D6E72;
  flex-shrink: 0;
}
@media screen and (min-width: 1025px) {
  html[lang=en] .project_portfolio_meta_row .project_portfolio_meta_label {
    width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta_row .project_portfolio_meta_label {
    gap: 6px;
    width: 130px;
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .project_portfolio_meta_row .project_portfolio_meta_label {
    gap: 4px;
    width: 120px;
  }
}
.project_portfolio_meta_row .project_portfolio_meta_icon {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta_row .project_portfolio_meta_icon {
    width: 18px;
    height: 18px;
  }
}
.project_portfolio_meta_row .project_portfolio_meta_value {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta_row .project_portfolio_meta_value {
    font-size: 14px;
  }
}
.project_portfolio_meta_row .project_portfolio_meta_value {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .project_portfolio_meta_row .project_portfolio_meta_value {
    font-size: 14px;
  }
}

@media screen and (max-width: 1024px) {
  .steel_hero .steel_intro_txt {
    width: 100%;
    margin: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .steel_hero .steel_intro_txt {
    width: 100%;
    margin: 0 20px;
  }
}
@media screen and (min-width: 1025px) {
  html[lang=en] .steel_hero .steel_intro_txt {
    width: max(1180px * var(--base-ratio), 1180 / var(--base-size) * var(--base-percent));
  }
}
.dx {
  position: relative;
  background: #FFFFFF;
}

.dx_hero_wrap {
  height: 500vh;
}

.dx_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dx_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.dx_hero .dx_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.dx_hero .dx_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .dx_hero .dx_hero_bg {
    width: 90%;
  }
}
.dx_hero .dx_hero_bg video {
  width: calc(100% + 2px);
  height: 100%;
  margin-left: -1px;
  object-fit: cover;
  display: block;
}
.dx_hero .dx_intro_txt {
  position: relative;
  z-index: 4;
  width: max(785px * var(--base-ratio), 785 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
html[lang=en] .dx_hero .dx_intro_txt {
  width: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
}
.dx_hero .dx_hero_txt {
  position: relative;
  z-index: 2;
  opacity: 0;
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_hero .dx_hero_txt {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_hero .dx_hero_txt {
    font-size: var(--fs-h1-mob);
  }
}
.dx_hero .dx_hero_txt {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  text-align: center;
}
html[lang=en] .dx_hero .dx_hero_txt {
  white-space: nowrap;
}
.dx_hero .dx_intro_desc {
  opacity: 0;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_hero .dx_intro_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_hero .dx_intro_desc {
    font-size: var(--fs-h5-mob);
  }
}
.dx_hero .dx_intro_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: center;
}
.dx_hero .dx_intro_terms {
  opacity: 0;
  display: flex;
  gap: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.dx_hero .dx_intro_term {
  display: inline-flex;
  align-items: center;
  gap: max(5px * var(--base-ratio), 5 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_hero .dx_intro_term {
    font-size: var(--fs-p1-tab);
  }
}
.dx_hero .dx_intro_term {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #FFFFFF;
}
.dx_hero .dx_intro_term .dx_intro_term_key {
  font-weight: 600;
}

.dx_intro_overlay {
  position: absolute;
  inset: 0 0 -1px 0;
  z-index: 3;
  transform: translateY(100%);
  overflow: hidden;
  background-color: #000000;
}
.dx_intro_overlay .dx_intro_bg_color {
  position: absolute;
  inset: 0;
  background-color: #000000;
}
.dx_intro_overlay .dx_intro_marquee {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.dx_intro_overlay .dx_intro_marquee_track {
  position: absolute;
  top: 0;
  bottom: 0;
  left: max(-27px * var(--base-ratio), -27 / var(--base-size) * var(--base-percent));
  display: flex;
  animation: dxMarquee 40s linear infinite;
}
.dx_intro_overlay .dx_intro_card_set {
  position: relative;
  height: 100%;
  aspect-ratio: 3900/1080;
  flex-shrink: 0;
}
.dx_intro_overlay .dx_intro_card {
  position: absolute;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  overflow: hidden;
}
.dx_intro_overlay .dx_card_01 {
  left: 0%;
  top: 0%;
  width: 8.0513%;
  height: 31.944%;
}
.dx_intro_overlay .dx_card_02 {
  left: 4.4359%;
  top: 72.87%;
  width: 7.6667%;
  height: 18.796%;
}
.dx_intro_overlay .dx_card_03 {
  left: 21.974%;
  top: 0%;
  width: 8.7436%;
  height: 21.296%;
}
.dx_intro_overlay .dx_card_04 {
  left: 27.692%;
  top: 76.852%;
  width: 11.256%;
  height: 23.148%;
}
.dx_intro_overlay .dx_card_05 {
  left: 40.538%;
  top: 18.426%;
  width: 10.513%;
  height: 24.167%;
}
.dx_intro_overlay .dx_card_06 {
  left: 53.41%;
  top: 75.093%;
  width: 7.5641%;
  height: 24.907%;
}
.dx_intro_overlay .dx_card_07 {
  left: 62.333%;
  top: 0%;
  width: 12.385%;
  height: 25.648%;
}
.dx_intro_overlay .dx_card_08 {
  left: 73.487%;
  top: 71.019%;
  width: 9.0513%;
  height: 22.222%;
}
.dx_intro_overlay .dx_card_09 {
  left: 87.757%;
  top: 19.63%;
  width: 8.7692%;
  height: 20.648%;
}
@keyframes dxMarquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.dx_marquee_transition {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 50;
  pointer-events: none;
  transform: translateY(100%);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 15%, rgba(0, 0, 0, 0.15) 30%, rgba(0, 0, 0, 0.3) 45%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0.75) 80%, rgb(0, 0, 0) 100%);
}

.dx_stage_wrap {
  position: relative;
  width: 100%;
  height: 750vh;
  margin-top: -100vh;
}

.dx_stage {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  background: #000000;
  overflow: hidden;
  z-index: 5;
}
.dx_stage .dx_stage_bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.dx_stage .dx_stage_bg--core {
  background: radial-gradient(circle at center, #e8f3fe 0%, #ffffff 100%);
  opacity: 0;
}
.dx_stage .dx_vision_bg {
  position: absolute;
  inset: 0;
  opacity: 0.15;
  pointer-events: none;
}
.dx_stage .dx_vision_bg_color {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle closest-side, #000 0%, #000 90%, #666 100%);
  opacity: 0;
}
.dx_stage .dx_vision_bg_color--1 {
  width: max(2096px * var(--base-ratio), 2096 / var(--base-size) * var(--base-percent));
  height: max(2096px * var(--base-ratio), 2096 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_vision_bg_color--2 {
  width: max(1712px * var(--base-ratio), 1712 / var(--base-size) * var(--base-percent));
  height: max(1712px * var(--base-ratio), 1712 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_vision_bg_color--3 {
  width: max(1322px * var(--base-ratio), 1322 / var(--base-size) * var(--base-percent));
  height: max(1322px * var(--base-ratio), 1322 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_vision_bg_color--4 {
  width: max(982px * var(--base-ratio), 982 / var(--base-size) * var(--base-percent));
  height: max(982px * var(--base-ratio), 982 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_vision_blur {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(840px * var(--base-ratio), 840 / var(--base-size) * var(--base-percent));
  height: max(840px * var(--base-ratio), 840 / var(--base-size) * var(--base-percent));
  transform: translate(-50%, -50%) rotate(60deg);
  opacity: 0;
  border-radius: 50%;
  background: linear-gradient(180deg, #d1d2d4 0%, #00a3f1 25%, #025997 50%, #00a3f1 75.48%, #d1d2d4 100%);
  -webkit-mask: radial-gradient(circle closest-side at center, transparent 0%, transparent 80%, rgba(0, 0, 0, 0.85) 83%, #000 86%, rgba(0, 0, 0, 0.7) 89%, rgba(0, 0, 0, 0.45) 92%, rgba(0, 0, 0, 0.22) 95%, rgba(0, 0, 0, 0.08) 97%, rgba(0, 0, 0, 0.02) 99%, transparent 100%);
  mask: radial-gradient(circle closest-side at center, transparent 0%, transparent 80%, rgba(0, 0, 0, 0.85) 83%, #000 86%, rgba(0, 0, 0, 0.7) 89%, rgba(0, 0, 0, 0.45) 92%, rgba(0, 0, 0, 0.22) 95%, rgba(0, 0, 0, 0.08) 97%, rgba(0, 0, 0, 0.02) 99%, transparent 100%);
  filter: blur(max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)));
}
.dx_stage .dx_stage_circle {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  height: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_stage_circle_dash {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent)) dashed #d1d2d4;
  opacity: 0;
}
.dx_stage .dx_stage_circle_ring {
  --ring-size: 720;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(var(--ring-size) * 0.5px, var(--ring-size) * 100vw / 1920);
  height: max(var(--ring-size) * 0.5px, var(--ring-size) * 100vw / 1920);
  border-radius: 50%;
  -webkit-mask: radial-gradient(circle closest-side at center, transparent calc(100% - max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent))), #000 calc(100% - max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent))));
  mask: radial-gradient(circle closest-side at center, transparent calc(100% - max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent))), #000 calc(100% - max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent))));
  opacity: 0;
}
.dx_stage .dx_stage_circle_ring_spin {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(180deg, #d1d2d4 0%, #00a3f1 25%, #025997 50%, #00a3f1 75.48%, #d1d2d4 100%);
  animation: spin 4s linear infinite;
}
.dx_stage .dx_stage_circle_fill {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  height: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #000000;
}
.dx_stage .dx_stage_circle_column {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(463px * var(--base-ratio), 463 / var(--base-size) * var(--base-percent));
  height: max(463px * var(--base-ratio), 463 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  overflow: hidden;
  transform: translate(-50%, -50%);
  opacity: 0;
  pointer-events: none;
}
.dx_stage .dx_stage_circle_item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(434px * var(--base-ratio), 434 / var(--base-size) * var(--base-percent));
  height: max(434px * var(--base-ratio), 434 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  overflow: hidden;
}
.dx_stage .dx_stage_circle_img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx_stage .dx_vision_txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(426px * var(--base-ratio), 426 / var(--base-size) * var(--base-percent));
  text-align: center;
  mix-blend-mode: difference;
}
.dx_stage .dx_vision_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_vision_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_stage .dx_vision_title {
    font-size: var(--fs-h2-mob);
  }
}
.dx_stage .dx_vision_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
  opacity: 0;
}
.dx_stage .dx_vision_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_vision_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_stage .dx_vision_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #bcbdc1;
  opacity: 0;
}
.dx_stage .dx_core_txt_set {
  position: absolute;
  top: 50%;
  left: max(357px * var(--base-ratio), 357 / var(--base-size) * var(--base-percent));
  transform: translateY(-50%);
  width: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  height: max(296px * var(--base-ratio), 296 / var(--base-size) * var(--base-percent));
  opacity: 0;
}
@media screen and (min-width: 1025px) {
  html[lang=en] .dx_stage .dx_core_txt_set {
    left: max(257px * var(--base-ratio), 257 / var(--base-size) * var(--base-percent));
    width: max(600px * var(--base-ratio), 600 / var(--base-size) * var(--base-percent));
  }
}
.dx_stage .dx_core_txt {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  opacity: 0;
}
.dx_stage .dx_core_cat {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_core_cat_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_core_cat_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_stage .dx_core_cat_label {
    font-size: var(--fs-h5-mob);
  }
}
.dx_stage .dx_core_cat_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #00A3F1;
}
.dx_stage .dx_core_cat_dot {
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #abddfa;
}
.dx_stage .dx_core_title {
  font-size: round(down, max(var(--fs-h1-pc) * 1px * var(--base-ratio), var(--fs-h1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_core_title {
    font-size: var(--fs-h1-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_stage .dx_core_title {
    font-size: var(--fs-h1-mob);
  }
}
.dx_stage .dx_core_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.dx_stage .dx_core_desc {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_core_desc {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_stage .dx_core_desc {
    font-size: var(--fs-h4-mob);
  }
}
.dx_stage .dx_core_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
.dx_stage .dx_core_orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  height: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  pointer-events: none;
  opacity: 0;
}
.dx_stage .dx_core_orbit_item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
}
.dx_stage .dx_core_orbit_item--01 {
  transform: rotate(270deg) translateY(calc(max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent)) * -1));
}
.dx_stage .dx_core_orbit_item--02 {
  transform: rotate(150deg) translateY(calc(max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent)) * -1));
}
.dx_stage .dx_core_orbit_item--03 {
  transform: rotate(30deg) translateY(calc(max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent)) * -1));
}
.dx_stage .dx_core_marker {
  position: absolute;
  top: 0;
  left: 0;
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #949599;
  transform: translate(-50%, -50%);
  transition: width 0.25s ease, height 0.25s ease, background 0.25s ease;
}
.dx_stage .dx_core_orbit_item.is_active .dx_core_marker {
  width: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  height: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  background: transparent;
}
.dx_stage .dx_core_tag_wrap {
  position: absolute;
  top: 0;
  left: 0;
}
.dx_stage .dx_core_orbit_inner {
  position: absolute;
  top: 0;
  left: 0;
}
.dx_stage .dx_core_orbit_item--01 .dx_core_orbit_inner {
  transform: rotate(-270deg);
}
.dx_stage .dx_core_orbit_item--02 .dx_core_orbit_inner {
  transform: rotate(-150deg);
}
.dx_stage .dx_core_orbit_item--03 .dx_core_orbit_inner {
  transform: rotate(-30deg);
}
.dx_stage .dx_core_tag {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
  border: 1px solid #818286;
  color: #949599;
  background: transparent;
  white-space: nowrap;
  text-align: center;
  transform: translate(-50%, -50%);
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  min-width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
html[lang=en] .dx_stage .dx_core_tag {
  min-width: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
html[lang=en] .dx_stage .dx_core_tag span {
  font-size: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
}
.dx_stage .dx_core_tag span {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_stage .dx_core_tag span {
    font-size: var(--fs-p1-tab);
  }
}
.dx_stage .dx_core_tag span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
}
.dx_stage .dx_core_orbit_item.is_active .dx_core_tag {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
}
.dx_stage .dx_core_tag_layer {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
}
.dx_stage .dx_core_tag_pos {
  position: absolute;
  top: 0;
  left: 0;
}
.dx_stage .dx_core_tag_pos.is_active .dx_core_tag {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
}
.dx_stage .dx_core_orbit_item.is_active .dx_core_marker::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Ccircle cx='21' cy='21' r='20' fill='none' stroke='%23024781' stroke-width='2'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  -webkit-mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  animation: dx_marker_spin 2s linear infinite;
}
.dx_stage .dx_core_orbit_item.is_active .dx_core_marker::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: #025997;
}
@keyframes dx_marker_spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.dx_strategy_wrap {
  position: relative;
  width: 100%;
  height: 200vh;
  margin-top: -100vh;
  z-index: 10;
}

.dx_strategy {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  color: #FFFFFF;
  z-index: 10;
}
.dx_strategy .dx_strategy_bg {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.dx_strategy .dx_strategy_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx_strategy .dx_strategy_inner {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent)) 0 max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.dx_strategy .dx_strategy_txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.dx_strategy .dx_strategy_cat {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.dx_strategy .dx_strategy_cat_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_strategy .dx_strategy_cat_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_strategy .dx_strategy_cat_label {
    font-size: var(--fs-h5-mob);
  }
}
.dx_strategy .dx_strategy_cat_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #00A3F1;
}
.dx_strategy .dx_strategy_cat_dot {
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #016cae;
}
.dx_strategy .dx_strategy_title {
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_strategy .dx_strategy_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_strategy .dx_strategy_title {
    font-size: var(--fs-h2-mob);
  }
}
.dx_strategy .dx_strategy_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.dx_strategy .dx_strategy_desc {
  margin-top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_strategy .dx_strategy_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_strategy .dx_strategy_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.dx_strategy .dx_strategy_diagram {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(98px * var(--base-ratio), 98 / var(--base-size) * var(--base-percent));
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
}
.dx_strategy .dx_strategy_card {
  flex: 0 0 max(250px * var(--base-ratio), 250 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  border: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent)) dashed rgba(209, 210, 212, 0.5);
}
.dx_strategy .dx_strategy_chip {
  display: flex;
  align-items: center;
  justify-content: center;
  height: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  padding: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent)) 0;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_strategy .dx_strategy_chip {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_strategy .dx_strategy_chip {
    font-size: var(--fs-h5-mob);
  }
}
.dx_strategy .dx_strategy_chip {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}
.dx_strategy .dx_strategy_chip--blur {
  background: rgba(243, 243, 243, 0.2);
  backdrop-filter: blur(max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)));
  box-shadow: 0 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) rgba(1, 36, 64, 0.86);
  color: #FFFFFF;
}
.dx_strategy .dx_strategy_chip--solid {
  background: #FFFFFF;
  font-weight: 700;
  line-height: 1.3;
  color: #025997;
}
.dx_strategy .dx_strategy_circle_wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  padding: max(29px * var(--base-ratio), 29 / var(--base-size) * var(--base-percent)) max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
.dx_strategy .dx_strategy_circle_ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.dx_strategy .dx_strategy_circle_ring--tablet {
  display: none;
}
.dx_strategy .dx_strategy_circle_ring--mobile {
  display: none;
}
.dx_strategy .dx_strategy_circle {
  flex: 0 0 max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_strategy .dx_strategy_circle {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_strategy .dx_strategy_circle {
    font-size: var(--fs-h3-mob);
  }
}
.dx_strategy .dx_strategy_circle {
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #FFFFFF;
}
.dx_strategy .dx_strategy_circle.dx_strategy_circle--ai, .dx_strategy .dx_strategy_circle.dx_strategy_circle--person {
  background: #0091db;
  border: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) solid #7bcdf5;
  box-shadow: 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) rgba(209, 210, 212, 0.5);
}
.dx_strategy .dx_strategy_arrow {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(46px * var(--base-ratio), 46 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.dx_strategy .dx_strategy_arrow .dx_strategy_arrow_svg {
  width: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  display: block;
}
.dx_strategy .dx_strategy_arrow--top {
  top: calc(max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent)) * -1);
}
.dx_strategy .dx_strategy_arrow--bottom {
  bottom: calc(max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent)) * -1);
  transform: translateX(-50%) rotate(180deg);
}
.dx_strategy .dx_strategy_connector {
  position: absolute;
  top: 50%;
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
  height: max(17px * var(--base-ratio), 17 / var(--base-size) * var(--base-percent));
  transform: translateY(-50%);
  pointer-events: none;
}
.dx_strategy .dx_strategy_connector--left {
  right: calc(100% + max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)));
  flex-direction: row-reverse;
}
.dx_strategy .dx_strategy_connector--right {
  left: calc(100% + max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)));
  flex-direction: row;
}
.dx_strategy .dx_strategy_connector_dot {
  flex-shrink: 0;
  width: max(17px * var(--base-ratio), 17 / var(--base-size) * var(--base-percent));
  height: max(17px * var(--base-ratio), 17 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #818286;
  border: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent)) solid #d1d2d4;
}
.dx_strategy .dx_strategy_connector_line {
  flex: 1;
  height: 0;
  border-top: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent)) dashed rgba(209, 210, 212, 0.5);
}

.dx_process {
  position: relative;
  width: 100%;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  background: #e8f3fe;
}
.dx_process .dx_process_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
  margin-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.dx_process .dx_process_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_process .dx_process_title {
    font-size: var(--fs-h2-mob);
  }
}
.dx_process .dx_process_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.dx_process .dx_process_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_process .dx_process_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
.dx_process .dx_process_cards {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
.dx_process .dx_process_card {
  position: relative;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: max(540px * var(--base-ratio), 540 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  box-shadow: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) #d1e8fe;
  flex-shrink: 0;
  cursor: pointer;
  overflow: hidden;
  transition: width 0.4s ease, transform 0.3s;
}
@media (hover: hover) {
  .dx_process .dx_process_card:hover {
    transform: translateY(calc(max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) * -1));
  }
}
.dx_process .dx_process_card_collapsed {
  position: absolute;
  top: 0;
  left: 0;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: 100%;
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2;
  opacity: 1;
  transition: opacity 0.3s 0.2s;
}
.dx_process .dx_process_card_label {
  font-size: round(down, max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)), 1px);
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
  font-family: "Bai Jamjuree", "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-align: center;
}
.dx_process .dx_process_card_expanded {
  position: absolute;
  top: 0;
  left: 0;
  width: max(1064px * var(--base-ratio), 1064 / var(--base-size) * var(--base-percent));
  height: 100%;
  padding: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent)) max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0s 0.3s;
}
.dx_process .dx_process_card_left {
  flex: 0 0 max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.dx_process .dx_process_card_tag {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  justify-content: center;
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #025997;
  border: 1px solid #025997;
  color: #FFFFFF;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_tag {
    font-size: 14px;
  }
}
.dx_process .dx_process_card_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
}
.dx_process .dx_process_card_left_txt {
  display: flex;
  flex-direction: column;
  gap: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}
.dx_process .dx_process_card_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_process .dx_process_card_title {
    font-size: var(--fs-h3-mob);
  }
}
.dx_process .dx_process_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.dx_process .dx_process_card_subtitle {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_subtitle {
    font-size: var(--fs-p1-tab);
  }
}
.dx_process .dx_process_card_subtitle {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
}
.dx_process .dx_process_card_right {
  flex: 0 0 max(480px * var(--base-ratio), 480 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(46px * var(--base-ratio), 46 / var(--base-size) * var(--base-percent));
  padding-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.dx_process .dx_process_card_item {
  display: flex;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  align-items: flex-start;
}
.dx_process .dx_process_card_item_num {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #f3f3f3;
  color: #6d6e72;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_item_num {
    font-size: 16px;
  }
}
.dx_process .dx_process_card_item_num {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
}
.dx_process .dx_process_card_item_body {
  display: flex;
  flex-direction: column;
  gap: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent));
}
.dx_process .dx_process_card_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_process .dx_process_card_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.dx_process .dx_process_card_item_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
}
.dx_process .dx_process_card_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_process .dx_process_card_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6d6e72;
}
.dx_process .dx_process_card.is_active {
  width: max(1064px * var(--base-ratio), 1064 / var(--base-size) * var(--base-percent));
  border: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent)) solid #016cae;
  cursor: default;
}
@media (hover: hover) {
  .dx_process .dx_process_card.is_active:hover {
    transform: none;
  }
}
.dx_process .dx_process_card.is_active .dx_process_card_collapsed {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.dx_process .dx_process_card.is_active .dx_process_card_expanded {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s 0.3s, visibility 0s 0s;
}

.dx_workplace {
  position: relative;
  width: 100%;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  background: #0a1f3d;
  overflow: hidden;
}
.dx_workplace .dx_workplace_bg {
  position: absolute;
  inset: 0;
  background: #0a1f3d;
  z-index: 0;
  overflow: hidden;
}
.dx_workplace .dx_workplace_bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.dx_workplace .dx_workplace_bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.05);
  pointer-events: none;
}
.dx_workplace .dx_workplace_inner {
  position: relative;
  z-index: 1;
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
.dx_workplace .dx_workplace_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  text-align: center;
  margin-bottom: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_workplace .dx_workplace_title {
    font-size: var(--fs-h2-mob);
  }
}
.dx_workplace .dx_workplace_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.dx_workplace .dx_workplace_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_workplace .dx_workplace_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.dx_workplace .dx_workplace_cards {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  margin-bottom: max(82px * var(--base-ratio), 82 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_card {
  flex: 0 0 max(444px * var(--base-ratio), 444 / var(--base-size) * var(--base-percent));
  height: max(472px * var(--base-ratio), 472 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(22px * var(--base-ratio), 22 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_card_ico {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
}
.dx_workplace .dx_workplace_card_ico img {
  width: 100%;
  height: 100%;
}
.dx_workplace .dx_workplace_card_content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_card_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_workplace .dx_workplace_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.dx_workplace .dx_workplace_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.dx_workplace .dx_workplace_card_sub {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_card_sub_code {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_card_sub_code {
    font-size: 16px;
  }
}
.dx_workplace .dx_workplace_card_sub_code {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #6d6e72;
}
.dx_workplace .dx_workplace_card_sub_name {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_card_sub_name {
    font-size: 16px;
  }
}
.dx_workplace .dx_workplace_card_sub_name {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #818286;
}
.dx_workplace .dx_workplace_card_chips {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  list-style: none;
  padding: 0;
  margin: 0;
}
.dx_workplace .dx_workplace_chip {
  display: flex;
  align-items: center;
  justify-content: center;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent)) 0;
  background: #f3f3f3;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_chip {
    font-size: var(--fs-p1-tab);
  }
}
.dx_workplace .dx_workplace_chip {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  color: #6d6e72;
}
.dx_workplace .dx_workplace_arrow {
  align-self: center;
  display: flex;
  flex-direction: column;
  gap: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_arrow--single {
  flex-direction: row;
  gap: 0;
}
.dx_workplace .dx_workplace_arrow--double .dx_workplace_arrow_row {
  display: flex;
  gap: 0;
}
.dx_workplace .dx_workplace_arrow_row--reverse {
  transform: rotate(180deg);
}
.dx_workplace .dx_workplace_arrow_seg {
  width: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.dx_workplace .dx_workplace_arrow_seg:nth-child(1) {
  background: #00a3f1;
}
.dx_workplace .dx_workplace_arrow_seg:nth-child(2) {
  background: #017ec4;
}
.dx_workplace .dx_workplace_arrow_seg:nth-child(3) {
  background: #025997;
}
.dx_workplace .dx_workplace_list {
  width: 100%;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent)));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_list_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid rgba(209, 210, 212, 0.3);
}
.dx_workplace .dx_workplace_list_item--last {
  padding-bottom: 0;
  border-bottom: none;
}
.dx_workplace .dx_workplace_list_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_list_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_workplace .dx_workplace_list_title {
    font-size: var(--fs-h5-mob);
  }
}
.dx_workplace .dx_workplace_list_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.dx_workplace .dx_workplace_list_rows {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.dx_workplace .dx_workplace_list_row {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_workplace .dx_workplace_list_row {
    font-size: var(--fs-p1-tab);
  }
}
.dx_workplace .dx_workplace_list_row {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.dx_workplace .dx_workplace_list_dot {
  flex: 0 0 max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  margin-top: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: #FFFFFF;
}

.dx_roadmap {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  background: #025997;
  overflow: hidden;
}
.dx_roadmap .dx_roadmap_head {
  position: absolute;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  left: max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
.dx_roadmap .dx_roadmap_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_roadmap .dx_roadmap_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_roadmap .dx_roadmap_title {
    font-size: var(--fs-h2-mob);
  }
}
.dx_roadmap .dx_roadmap_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #FFFFFF;
}
.dx_roadmap .dx_roadmap_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_roadmap .dx_roadmap_desc {
    font-size: var(--fs-p1-tab);
  }
}
.dx_roadmap .dx_roadmap_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
}
.dx_roadmap .dx_roadmap_graph {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.dx_roadmap .dx_roadmap_graph_lottie {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.dx_roadmap .dx_roadmap_graph_lottie svg {
  width: 100% !important;
  height: 100% !important;
  display: block;
}
.dx_roadmap .dx_roadmap_phases {
  position: absolute;
  inset: 0;
  z-index: 3;
}
.dx_roadmap .dx_roadmap_phase {
  position: absolute;
  width: max(350px * var(--base-ratio), 350 / var(--base-size) * var(--base-percent));
}
.dx_roadmap .dx_roadmap_phase--01 {
  left: max(181px * var(--base-ratio), 181 / var(--base-size) * var(--base-percent));
  top: max(541px * var(--base-ratio), 541 / var(--base-size) * var(--base-percent));
}
.dx_roadmap .dx_roadmap_phase--02 {
  left: max(785px * var(--base-ratio), 785 / var(--base-size) * var(--base-percent));
  top: max(393px * var(--base-ratio), 393 / var(--base-size) * var(--base-percent));
}
.dx_roadmap .dx_roadmap_phase--03 {
  left: max(1390px * var(--base-ratio), 1390 / var(--base-size) * var(--base-percent));
  top: max(246px * var(--base-ratio), 246 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  html[lang=en] .dx_roadmap .dx_roadmap_phase {
    width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .dx_roadmap .dx_roadmap_phase--01 {
    left: max(126px * var(--base-ratio), 126 / var(--base-size) * var(--base-percent));
    top: max(521px * var(--base-ratio), 521 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .dx_roadmap .dx_roadmap_phase--02 {
    left: max(730px * var(--base-ratio), 730 / var(--base-size) * var(--base-percent));
    top: max(373px * var(--base-ratio), 373 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .dx_roadmap .dx_roadmap_phase--03 {
    left: max(1335px * var(--base-ratio), 1335 / var(--base-size) * var(--base-percent));
    top: max(226px * var(--base-ratio), 226 / var(--base-size) * var(--base-percent));
  }
}
.dx_roadmap .dx_roadmap_phase_card {
  position: relative;
  width: max(350px * var(--base-ratio), 350 / var(--base-size) * var(--base-percent));
  height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  background: #003264;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 1025px) {
  html[lang=en] .dx_roadmap .dx_roadmap_phase_card {
    width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
    height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
    padding-top: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
    padding-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
    padding-left: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
    padding-right: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
    margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  }
}
.dx_roadmap .dx_roadmap_phase_card::after {
  content: "";
  position: absolute;
  bottom: max(-26px * var(--base-ratio), -26 / var(--base-size) * var(--base-percent));
  left: 50%;
  transform: translateX(-50%);
  width: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  height: max(26px * var(--base-ratio), 26 / var(--base-size) * var(--base-percent));
  background: #003264;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.dx_roadmap .dx_roadmap_phase_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
  color: #FFFFFF;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_roadmap .dx_roadmap_phase_tag {
    font-size: 14px;
  }
}
.dx_roadmap .dx_roadmap_phase_tag {
  letter-spacing: -0.02em;
  line-height: 1;
  font-weight: 700;
}
.dx_roadmap .dx_roadmap_phase_tag--01 {
  background: #7bcdf5;
}
.dx_roadmap .dx_roadmap_phase_tag--02 {
  background: #3bb7f3;
}
.dx_roadmap .dx_roadmap_phase_tag--03 {
  background: #0091db;
}
.dx_roadmap .dx_roadmap_phase_title {
  margin-top: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_roadmap .dx_roadmap_phase_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_roadmap .dx_roadmap_phase_title {
    font-size: var(--fs-h5-mob);
  }
}
.dx_roadmap .dx_roadmap_phase_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: center;
}
.dx_roadmap .dx_roadmap_phase_desc {
  margin-top: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_roadmap .dx_roadmap_phase_desc {
    font-size: 16px;
  }
}
.dx_roadmap .dx_roadmap_phase_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  text-align: center;
}

.dx_pagenav {
  display: flex;
  width: 100%;
}
.dx_pagenav .dx_pagenav_item {
  flex: 1 1 50%;
  height: max(210px * var(--base-ratio), 210 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-top: 1px solid #d1d2d4;
  border-bottom: 1px solid #d1d2d4;
  text-decoration: none;
  color: #161D27;
  transition: background 0.3s ease;
}
.dx_pagenav .dx_pagenav_item:hover {
  background: #f8fbff;
}
.dx_pagenav .dx_pagenav_item--prev {
  border-right: 1px solid #d1d2d4;
}
.dx_pagenav .dx_pagenav_label {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .dx_pagenav .dx_pagenav_label {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .dx_pagenav .dx_pagenav_label {
    font-size: var(--fs-h4-mob);
  }
}
.dx_pagenav .dx_pagenav_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}
.dx_pagenav .dx_pagenav_arrow {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  border: max(2px * var(--base-ratio), 2 / var(--base-size) * var(--base-percent)) solid #d1d2d4;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dx_pagenav .dx_pagenav_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

@media screen and (max-width: 1024px) {
  .dx_hero .dx_intro_txt {
    gap: 20px;
  }
  .dx_hero .dx_intro_terms {
    flex-wrap: wrap;
    justify-content: center;
  }
  html[lang=en] .dx_hero .dx_intro_txt {
    width: 100%;
    padding: 0 40px;
  }
  html[lang=en] .dx_hero .dx_hero_txt {
    white-space: normal;
  }
  .dx_stage .dx_vision_bg_color--1 {
    width: 900px;
    height: 900px;
  }
  .dx_stage .dx_vision_bg_color--2 {
    width: 735px;
    height: 735px;
  }
  .dx_stage .dx_vision_bg_color--3 {
    width: 568px;
    height: 568px;
  }
  .dx_stage .dx_vision_bg_color--4 {
    width: 422px;
    height: 422px;
  }
  .dx_stage .dx_vision_blur {
    width: 560px;
    height: 560px;
  }
  .dx_stage .dx_stage_circle {
    width: 560px;
    height: 560px;
  }
  .dx_stage .dx_stage_circle_fill {
    width: 560px;
    height: 560px;
  }
  .dx_stage .dx_stage_circle_ring {
    width: calc(var(--ring-size) * 0.778px);
    height: calc(var(--ring-size) * 0.778px);
    z-index: 1;
    -webkit-mask: radial-gradient(circle closest-side at center, transparent calc(100% - 8px), #000 calc(100% - 8px));
    mask: radial-gradient(circle closest-side at center, transparent calc(100% - 8px), #000 calc(100% - 8px));
  }
  .dx_stage .dx_vision_txt {
    width: 384px;
  }
  .dx_stage .dx_stage_circle_dash {
    inset: auto;
    top: 50%;
    left: 50%;
    width: 500px;
    height: 500px;
    transform: translate(-50%, -50%);
  }
  .dx_stage .dx_stage_circle_column {
    width: 326px;
    height: 326px;
  }
  .dx_stage .dx_stage_circle_item {
    width: 300px;
    height: 300px;
  }
  .dx_stage .dx_core_orbit_item--01 {
    transform: rotate(0deg) translateY(-250px);
  }
  .dx_stage .dx_core_orbit_item--02 {
    transform: rotate(240deg) translateY(-250px);
  }
  .dx_stage .dx_core_orbit_item--03 {
    transform: rotate(120deg) translateY(-250px);
  }
  .dx_stage .dx_core_orbit_item--01 .dx_core_orbit_inner {
    transform: rotate(0deg);
  }
  .dx_stage .dx_core_orbit_item--02 .dx_core_orbit_inner {
    transform: rotate(-240deg);
  }
  .dx_stage .dx_core_orbit_item--03 .dx_core_orbit_inner {
    transform: rotate(-120deg);
  }
  .dx_stage .dx_core_marker {
    width: 8px;
    height: 8px;
  }
  .dx_stage .dx_core_orbit_item.is_active .dx_core_marker {
    width: 24px;
    height: 24px;
  }
  .dx_stage .dx_core_orbit_item.is_active .dx_core_marker::after {
    width: 8px;
    height: 8px;
  }
  html[lang=en] .dx_stage .dx_core_tag {
    min-width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .dx_stage .dx_core_tag span {
    font-size: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  }
  .dx_stage .dx_core_txt_set {
    top: 120px;
    left: 50%;
    width: calc(100% - 80px);
    height: auto;
    transform: translateX(-50%);
  }
  .dx_stage .dx_core_txt {
    top: auto;
    bottom: 0;
    align-items: center;
    text-align: center;
    gap: 12px;
  }
  .dx_stage .dx_core_cat {
    justify-content: center;
  }
  .dx_stage .dx_core_desc br {
    content: "";
  }
  .dx_stage .dx_core_desc br::after {
    content: " ";
  }
  .dx_strategy .dx_strategy_inner {
    gap: 42px;
    padding: 120px 0 60px;
  }
  .dx_strategy .dx_strategy_txt {
    width: 600px;
  }
  .dx_strategy .dx_strategy_title,
  .dx_strategy .dx_strategy_desc {
    margin-top: 12px;
  }
  .dx_strategy .dx_strategy_diagram {
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    width: 544px;
    gap: 0 30px;
  }
  .dx_strategy .dx_strategy_circle_wrap {
    order: -1;
    width: 100%;
    height: 264px;
    justify-content: center;
    gap: 60px;
    padding: 0;
    margin-bottom: 32px;
  }
  .dx_strategy .dx_strategy_circle_ring--pc {
    display: none;
  }
  .dx_strategy .dx_strategy_circle_ring--tablet {
    display: block;
  }
  .dx_strategy .dx_strategy_circle {
    flex: 0 0 220px;
    width: 220px;
    height: 220px;
  }
  .dx_strategy .dx_strategy_circle.dx_strategy_circle--ai, .dx_strategy .dx_strategy_circle.dx_strategy_circle--person {
    border-width: 4px;
  }
  .dx_strategy .dx_strategy_card {
    flex: 0 0 250px;
    gap: 10px;
    padding: 20px;
    border-radius: 8px;
    border-width: 2px;
  }
  .dx_strategy .dx_strategy_chip {
    height: 64px;
    padding: 15px 0;
    border-radius: 6px;
  }
  .dx_strategy .dx_strategy_connector {
    top: calc(50% + 123px);
    bottom: -32px;
    height: auto;
    transform: translateX(-50%);
    flex-direction: column;
    align-items: center;
    width: 14px;
    gap: 0;
  }
  .dx_strategy .dx_strategy_connector--left {
    right: auto;
    left: 132px;
    flex-direction: column;
  }
  .dx_strategy .dx_strategy_connector--right {
    left: 412px;
  }
  .dx_strategy .dx_strategy_connector_dot {
    width: 14px;
    height: 14px;
    border-width: 3px;
  }
  .dx_strategy .dx_strategy_connector_line {
    flex: 1;
    width: 0;
    height: auto;
    border-top: none;
    border-left: 2px dashed rgba(209, 210, 212, 0.5);
  }
  .dx_process {
    padding: 100px 0 144px;
  }
  .dx_process .dx_process_head {
    gap: 16px;
    margin-bottom: 58px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
  .dx_process .dx_process_cards {
    flex-direction: column;
    gap: 16px;
    width: 688px;
  }
  .dx_process .dx_process_card {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 10px 32px #d1e8fe;
    transition: none;
  }
}
@media screen and (max-width: 1024px) and (hover: hover) {
  .dx_process .dx_process_card:hover {
    transform: none;
  }
}
@media screen and (max-width: 1024px) {
  .dx_process .dx_process_card_collapsed {
    position: static;
    width: 100%;
    height: auto;
    padding: 24px 30px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  .dx_process .dx_process_card_label {
    font-size: 24px;
  }
  .dx_process .dx_process_card_expanded {
    display: none;
  }
  .dx_process .dx_process_card.is_active {
    width: 100%;
    border: 3px solid #016cae;
  }
  .dx_process .dx_process_card.is_active .dx_process_card_collapsed {
    display: none;
  }
  .dx_process .dx_process_card.is_active .dx_process_card_expanded {
    display: flex;
    position: static;
    width: 100%;
    opacity: 1;
    visibility: visible;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    padding: 48px 40px 64px;
  }
  .dx_process .dx_process_card_left {
    flex: 0 0 206px;
    gap: 20px;
  }
  .dx_process .dx_process_card_tag {
    height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
  .dx_process .dx_process_card_left_txt {
    gap: 10px;
  }
  .dx_process .dx_process_card_right {
    flex: 1 1 auto;
    gap: 32px;
    padding-top: 48px;
  }
  .dx_process .dx_process_card_item {
    gap: 16px;
  }
  .dx_process .dx_process_card_item_num {
    width: 32px;
    height: 32px;
    font-size: 18px;
  }
  .dx_process .dx_process_card_item_body {
    gap: 2px;
  }
  .dx_workplace {
    padding: 120px 0 128px;
  }
  .dx_workplace .dx_workplace_inner {
    width: 688px;
  }
  .dx_workplace .dx_workplace_head {
    gap: 20px;
    margin-bottom: 60px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
  .dx_workplace .dx_workplace_cards {
    gap: 6px;
    width: 688px;
    margin-bottom: 60px;
  }
  .dx_workplace .dx_workplace_card {
    flex: 1 1 0;
    min-width: 0;
    height: 362px;
    border-radius: 8px;
    padding: 16px 8px 8px;
    gap: 16px;
  }
  .dx_workplace .dx_workplace_card_ico {
    width: 40px;
    height: 40px;
  }
  .dx_workplace .dx_workplace_card_content {
    gap: 16px;
  }
  .dx_workplace .dx_workplace_card_head {
    gap: 4px;
  }
  .dx_workplace .dx_workplace_card_sub {
    flex-direction: column;
    gap: 0;
    align-items: center;
    text-align: center;
    min-height: 63px;
  }
  .dx_workplace .dx_workplace_card_sub_name {
    line-height: 1.3;
  }
  .dx_workplace .dx_workplace_card_chips {
    gap: 10px;
  }
  .dx_workplace .dx_workplace_chip {
    height: 51px;
    padding: 12px 0;
    border-radius: 8px;
  }
  .dx_workplace .dx_workplace_arrow {
    gap: 6px;
  }
  .dx_workplace .dx_workplace_arrow--single {
    gap: 0;
  }
  .dx_workplace .dx_workplace_arrow_seg {
    width: 6px;
    height: 8px;
  }
  .dx_workplace .dx_workplace_list {
    border-radius: 8px;
    padding: 30px;
    gap: 22px;
    backdrop-filter: blur(100px);
  }
  .dx_workplace .dx_workplace_list_item {
    padding-bottom: 22px;
  }
  .dx_workplace .dx_workplace_list_item--last {
    padding-bottom: 0;
  }
  .dx_workplace .dx_workplace_list_dot {
    margin-top: 11px;
  }
  .dx_roadmap {
    height: 829px;
    padding: 120px 40px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .dx_roadmap .dx_roadmap_head {
    position: static;
    top: auto;
    left: auto;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    gap: 20px;
    align-items: center;
    text-align: center;
    z-index: 2;
  }
  .dx_roadmap .dx_roadmap_graph {
    top: auto;
    bottom: 0;
    height: 432px;
    z-index: 1;
  }
  .dx_roadmap .dx_roadmap_phases {
    position: static;
    inset: auto;
    display: flex;
    gap: 16px;
    width: 688px;
    margin-top: 60px;
    z-index: 3;
  }
  .dx_roadmap .dx_roadmap_phase {
    position: static;
    width: auto;
    flex: 1 1 0;
    min-width: 0;
  }
  .dx_roadmap .dx_roadmap_phase--01,
  .dx_roadmap .dx_roadmap_phase--02,
  .dx_roadmap .dx_roadmap_phase--03 {
    position: static;
    left: auto;
    top: auto;
  }
  .dx_roadmap .dx_roadmap_phase_card {
    width: 100%;
    height: auto;
    min-height: 262px;
    padding: 24px 8px 28px;
    gap: 4px;
    border-radius: 16px;
  }
  .dx_roadmap .dx_roadmap_phase_card::after {
    bottom: -26px;
    width: 40px;
    height: 26px;
  }
  .dx_roadmap .dx_roadmap_phase_tag {
    flex-shrink: 0;
    height: 30px;
    padding: 0 16px;
  }
  .dx_roadmap .dx_roadmap_phase_title {
    margin-top: 8px;
  }
  .dx_roadmap .dx_roadmap_phase_desc {
    margin-top: 0;
    line-height: 1.4;
  }
  html[lang=en] .dx_roadmap {
    height: 920px;
  }
  html[lang=en] .dx_roadmap .dx_roadmap_phase_card {
    height: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .dx_hero .dx_intro_txt {
    padding: 0 20px;
  }
  .dx_strategy_wrap {
    height: auto;
    margin-top: 0;
  }
  .dx_strategy {
    position: relative;
    top: auto;
    height: auto;
    overflow: visible;
  }
  .dx_strategy .dx_strategy_inner {
    justify-content: flex-start;
    gap: 43px;
    padding: 120px 0 90px;
  }
  .dx_strategy .dx_strategy_txt {
    width: 100%;
    padding: 0 20px;
  }
  .dx_strategy .dx_strategy_cat {
    gap: 6px;
  }
  .dx_strategy .dx_strategy_cat_dot {
    width: 4px;
    height: 4px;
    background: #abddfa;
  }
  .dx_strategy .dx_strategy_diagram {
    width: 335px;
    gap: 0 15px;
  }
  .dx_strategy .dx_strategy_circle_ring--tablet {
    display: none;
  }
  .dx_strategy .dx_strategy_circle_ring--mobile {
    display: block;
    overflow: visible;
  }
  .dx_strategy .dx_strategy_circle_wrap {
    height: 168px;
    gap: 37px;
    margin-bottom: 30px;
  }
  .dx_strategy .dx_strategy_circle {
    flex: 0 0 135px;
    width: 135px;
    height: 135px;
  }
  .dx_strategy .dx_strategy_card {
    flex: 0 0 160px;
    padding: 6px;
  }
  .dx_strategy .dx_strategy_chip--blur {
    backdrop-filter: blur(20px);
  }
  .dx_strategy .dx_strategy_arrow {
    width: 20px;
    height: 8px;
    padding: 0;
  }
  .dx_strategy .dx_strategy_arrow .dx_strategy_arrow_svg {
    width: 20px;
    height: 8px;
  }
  .dx_strategy .dx_strategy_arrow--top {
    top: 0;
  }
  .dx_strategy .dx_strategy_arrow--bottom {
    bottom: 0;
  }
  .dx_strategy .dx_strategy_connector {
    top: 158px;
    bottom: -30px;
  }
  .dx_strategy .dx_strategy_connector--left {
    left: 80px;
  }
  .dx_strategy .dx_strategy_connector--right {
    left: 255px;
  }
  .dx_roadmap {
    height: 1202px;
    padding: 120px 0 0;
  }
  .dx_roadmap .dx_roadmap_head {
    width: 100%;
    padding: 0 20px;
  }
  .dx_roadmap .dx_roadmap_phases {
    flex-direction: column;
    gap: 50px;
    width: 350px;
    margin-top: 40px;
  }
  .dx_roadmap .dx_roadmap_phase {
    flex: 0 0 auto;
    width: 100%;
  }
  .dx_roadmap .dx_roadmap_phase_card {
    padding: 28px 32px 32px;
    gap: 4px;
    min-height: 208px;
  }
  .dx_roadmap .dx_roadmap_phase_title {
    margin-top: 8px;
  }
  .dx_roadmap .dx_roadmap_phase_desc {
    margin-top: 0;
    line-height: 1.5;
  }
  .dx_roadmap .dx_roadmap_graph {
    height: 211px;
  }
  html[lang=en] .dx_roadmap {
    height: 1350px;
  }
  .dx_process .dx_process_head {
    width: 100%;
    padding: 0 20px;
  }
  .dx_process .dx_process_cards {
    width: 335px;
  }
  .dx_process .dx_process_card.is_active .dx_process_card_expanded {
    flex-direction: column;
    gap: 40px;
    padding: 40px 28px 48px;
  }
  .dx_process .dx_process_card_left {
    flex: 0 0 auto;
    width: 100%;
  }
  .dx_process .dx_process_card_right {
    flex: 0 0 auto;
    width: 100%;
    gap: 24px;
    padding-top: 0;
  }
  .dx_process .dx_process_card_item_body {
    flex: 1;
    min-width: 0;
  }
  .dx_workplace {
    padding: 120px 20px 128px;
  }
  .dx_workplace .dx_workplace_inner {
    width: 335px;
  }
  .dx_workplace .dx_workplace_head {
    width: 100%;
    padding: 0 20px;
  }
  .dx_workplace .dx_workplace_cards {
    flex-direction: column;
    gap: 18px;
    width: 335px;
  }
  .dx_workplace .dx_workplace_card {
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    padding: 40px 32px 32px;
    gap: 16px;
  }
  .dx_workplace .dx_workplace_card_ico {
    width: 60px;
    height: 60px;
  }
  .dx_workplace .dx_workplace_card_content {
    gap: 22px;
  }
  .dx_workplace .dx_workplace_card_sub {
    flex-direction: row;
    justify-content: center;
    gap: 6px;
    min-height: 0;
  }
  .dx_workplace .dx_workplace_arrow {
    transform: rotate(90deg);
  }
  .dx_workplace .dx_workplace_arrow--single {
    height: 30px;
    align-items: center;
  }
  .dx_workplace .dx_workplace_arrow_seg {
    width: 10px;
    height: 12px;
  }
  .dx_workplace .dx_workplace_list {
    width: 335px;
  }
  .dx_stage .dx_vision_bg_color--1 {
    width: 540px;
    height: 540px;
  }
  .dx_stage .dx_vision_bg_color--2 {
    width: 441px;
    height: 441px;
  }
  .dx_stage .dx_vision_bg_color--3 {
    width: 340px;
    height: 340px;
  }
  .dx_stage .dx_vision_bg_color--4 {
    width: 253px;
    height: 253px;
  }
  .dx_stage .dx_vision_blur {
    width: 336px;
    height: 336px;
  }
  .dx_stage .dx_stage_circle {
    width: 335px;
    height: 335px;
  }
  .dx_stage .dx_stage_circle_fill {
    width: 335px;
    height: 335px;
  }
  .dx_stage .dx_stage_circle_ring {
    width: calc(var(--ring-size) * 0.465px);
    height: calc(var(--ring-size) * 0.465px);
    -webkit-mask: radial-gradient(circle closest-side at center, transparent calc(100% - 4.6px), #000 calc(100% - 4.6px));
    mask: radial-gradient(circle closest-side at center, transparent calc(100% - 4.6px), #000 calc(100% - 4.6px));
  }
  .dx_stage .dx_vision_txt {
    width: 215px;
  }
  .dx_stage .dx_stage_circle_dash {
    width: 268px;
    height: 268px;
  }
  .dx_stage .dx_stage_circle_column {
    width: 180px;
    height: 180px;
  }
  .dx_stage .dx_stage_circle_item {
    width: 166px;
    height: 166px;
  }
  .dx_stage .dx_core_orbit_item--01 {
    transform: rotate(0deg) translateY(-134px);
  }
  .dx_stage .dx_core_orbit_item--02 {
    transform: rotate(240deg) translateY(-134px);
  }
  .dx_stage .dx_core_orbit_item--03 {
    transform: rotate(120deg) translateY(-134px);
  }
  .dx_stage .dx_core_marker {
    width: 5px;
    height: 5px;
  }
  .dx_stage .dx_core_orbit_item.is_active .dx_core_marker {
    width: 14px;
    height: 14px;
  }
  .dx_stage .dx_core_orbit_item.is_active .dx_core_marker::after {
    width: 5px;
    height: 5px;
  }
  .dx_stage .dx_core_txt_set {
    width: calc(100% - 40px);
  }
  .dx_stage .dx_core_tag span {
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .dx_stage .dx_core_tag span {
    font-size: 16px;
  }
}
.csr {
  position: relative;
}

.csr_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.csr_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.csr_hero .csr_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.csr_hero .csr_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .csr_hero .csr_hero_bg {
    width: 90%;
  }
}
.csr_hero .csr_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.csr_hero .csr_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_hero .csr_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_hero .csr_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.csr_hero .csr_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.csr_hero .csr_hero_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_hero .csr_hero_desc {
    font-size: var(--fs-p1-tab);
  }
}
.csr_hero .csr_hero_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .csr_hero .csr_hero_content {
    gap: 26px;
  }
}
@media screen and (max-width: 767px) {
  .csr_hero .csr_hero_content {
    gap: 26px;
    padding: 0 20px;
  }
}

@media screen and (max-width: 1024px) {
  .csr_global_wrap {
    overflow: hidden;
  }
}

.csr_global {
  position: relative;
  width: 100%;
  background: url("/images/esg/csr_global_bg.png") no-repeat top center/100% auto, linear-gradient(180deg, #000C35 0%, #002850 14%, #0F3E6D 32%, #EFF2F5 88%, #FFFFFF 94%);
  padding-bottom: max(245px * var(--base-ratio), 245 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_map {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  pointer-events: none;
}
.csr_global .csr_global_inner {
  position: relative;
  z-index: 1;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_txt {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  width: max(900px * var(--base-ratio), 900 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_global .csr_global_title {
    font-size: var(--fs-h2-mob);
  }
}
.csr_global .csr_global_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.csr_global .csr_global_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_desc {
    font-size: var(--fs-p1-tab);
  }
}
.csr_global .csr_global_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.csr_global .csr_global_nav {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}
.csr_global .csr_global_btn img {
  width: max(15px * var(--base-ratio), 15 / var(--base-size) * var(--base-percent));
  height: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .csr_global .csr_global_btn:hover {
    background: rgba(255, 255, 255, 0.35);
  }
}
.csr_global .csr_global_scroll_wrap {
  position: relative;
  margin-top: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_scroll {
  display: flex;
  gap: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  overflow: visible;
}
.csr_global .csr_global_year_group {
  flex-shrink: 0;
}
.csr_global .csr_global_year_cards {
  display: flex;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_year_pill {
  position: relative;
  z-index: 1;
  width: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  margin-top: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_year_pill {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_global .csr_global_year_pill {
    font-size: var(--fs-h5-mob);
  }
}
.csr_global .csr_global_year_pill {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}
.csr_global .csr_global_card {
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  height: max(440px * var(--base-ratio), 440 / var(--base-size) * var(--base-percent));
  perspective: 1000px;
  flex-shrink: 0;
  cursor: pointer;
}
.csr_global .csr_global_card_front,
.csr_global .csr_global_card_back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: transform 0.5s ease-in-out;
}
.csr_global .csr_global_card_front {
  background: #FFFFFF;
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.csr_global .csr_global_card_more {
  display: none;
  position: absolute;
  width: 28px;
  height: 28px;
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_card_more {
    display: block;
    top: 12px;
    right: 12px;
  }
}
.csr_global .csr_global_card_back {
  background: #00A3F1;
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  transform: rotateY(180deg);
}
.csr_global .csr_global_card_desc_box {
  flex: 1;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}
.csr_global .csr_global_card_desc_box::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.csr_global .csr_global_card_scrollbar {
  position: relative;
  flex-shrink: 0;
  align-self: stretch;
  width: 2px;
  background: #3bb7f3;
  border-radius: 999px;
}
.csr_global .csr_global_card_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #7bcdf5;
  border-radius: 999px;
  cursor: grab;
  touch-action: none;
}
.csr_global .csr_global_card_scrollbar_thumb:active {
  cursor: grabbing;
}
.csr_global .csr_global_card_close {
  display: none;
  position: absolute;
  width: 28px;
  height: 28px;
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_card_close {
    display: block;
    top: 12px;
    right: 12px;
  }
}
.csr_global .csr_global_card.is_flipped .csr_global_card_front {
  transform: rotateY(-180deg);
}
.csr_global .csr_global_card.is_flipped .csr_global_card_back {
  transform: rotateY(0deg);
}
@media screen and (min-width: 1025px) and (hover: hover) {
  .csr_global .csr_global_card:hover .csr_global_card_front {
    transform: rotateY(-180deg);
  }
  .csr_global .csr_global_card:hover .csr_global_card_back {
    transform: rotateY(0deg);
  }
}
.csr_global .csr_global_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.csr_global .csr_global_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  white-space: pre-line;
}
.csr_global .csr_global_card_txt {
  display: flex;
  flex-direction: column;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.csr_global .csr_global_card_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_card_date {
    font-size: 16px;
  }
}
.csr_global .csr_global_card_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}
.csr_global .csr_global_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_global .csr_global_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_global .csr_global_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.csr_global .csr_global_card_title {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.csr_global .csr_global_card_img {
  width: 100%;
  height: max(203px * var(--base-ratio), 203 / var(--base-size) * var(--base-percent));
  border-radius: 6px;
  overflow: hidden;
}
.csr_global .csr_global_card_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.csr_global .csr_global_timeline_line {
  position: absolute;
  z-index: -1;
  top: max(912px * var(--base-ratio), 912 / var(--base-size) * var(--base-percent));
  left: calc(max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) * -1);
  right: calc(max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) * -1);
  height: 2px;
  background: #FFFFFF;
  opacity: 0.5;
  pointer-events: none;
}
@media screen and (min-width: 1025px) {
  :lang(en) .csr_global .csr_global_timeline_line {
    top: max(900px * var(--base-ratio), 900 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .csr_global {
    background: none;
    padding-bottom: 120px;
  }
  .csr_global::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1152px;
    height: 100%;
    background: url("/images/esg/csr_global_bg_tb.png") no-repeat top center/100% auto, linear-gradient(180deg, #000C35 0%, #002850 14%, #0F3E6D 32%, #EFF2F5 88%, #FFFFFF 94%);
    z-index: 0;
  }
  .csr_global .csr_global_map {
    top: 0;
    right: 0;
    left: auto;
    width: 1152px;
    height: auto;
  }
  .csr_global .csr_global_inner {
    padding: 120px 40px 0;
  }
  .csr_global .csr_global_txt {
    gap: 18px;
    width: 335px;
  }
  .csr_global .csr_global_nav {
    margin-top: 60px;
  }
  .csr_global .csr_global_btn {
    width: 42px;
    height: 42px;
  }
  .csr_global .csr_global_btn img {
    width: 13px;
    height: 11px;
  }
  .csr_global .csr_global_scroll_wrap {
    margin-top: 30px;
  }
  .csr_global .csr_global_scroll {
    gap: 20px;
  }
  .csr_global .csr_global_year_cards {
    gap: 20px;
  }
  .csr_global .csr_global_year_pill {
    width: 80px;
    margin-top: 28px;
    padding: 6px;
  }
  .csr_global .csr_global_card {
    width: 300px;
    height: 360px;
  }
  .csr_global .csr_global_card_front {
    padding: 30px 24px 20px;
  }
  .csr_global .csr_global_card_back {
    padding: 30px 24px 24px;
    gap: 16px;
  }
  .csr_global .csr_global_card_scrollbar {
    margin-top: 10px;
  }
  .csr_global .csr_global_card_txt {
    gap: 12px;
  }
  .csr_global .csr_global_card_img {
    height: 142px;
  }
  .csr_global .csr_global_timeline_line {
    top: auto;
    bottom: 18px;
    left: -40px;
    right: -40px;
  }
}
@media screen and (max-width: 767px) {
  .csr_global {
    background: url("/images/esg/csr_global_bg_mo.png") no-repeat top center/100% auto, linear-gradient(180deg, #000C35 0%, #002850 14%, #0F3E6D 32%, #EFF2F5 88%, #FFFFFF 94%);
    padding-bottom: 120px;
  }
  .csr_global::before {
    display: none;
  }
  .csr_global .csr_global_map {
    display: none;
    left: 0;
    right: auto;
    width: 100%;
  }
  .csr_global .csr_global_inner {
    padding: 120px 20px 0;
  }
  .csr_global .csr_global_txt {
    gap: 18px;
    width: 335px;
  }
  .csr_global .csr_global_nav {
    margin-top: 40px;
  }
  .csr_global .csr_global_btn {
    width: 42px;
    height: 42px;
  }
  .csr_global .csr_global_btn img {
    width: 13px;
    height: 11px;
  }
  .csr_global .csr_global_scroll_wrap {
    margin-top: 30px;
  }
  .csr_global .csr_global_scroll {
    gap: 20px;
  }
  .csr_global .csr_global_year_cards {
    gap: 20px;
  }
  .csr_global .csr_global_year_pill {
    width: 80px;
    margin-top: 28px;
    padding: 6px;
  }
  .csr_global .csr_global_card {
    width: 300px;
    height: 360px;
  }
  .csr_global .csr_global_card_front {
    padding: 30px 24px 20px;
  }
  .csr_global .csr_global_card_back {
    padding: 30px 24px 24px;
    gap: 16px;
  }
  .csr_global .csr_global_card_scrollbar {
    margin-top: 10px;
  }
  .csr_global .csr_global_card_txt {
    gap: 12px;
  }
  .csr_global .csr_global_card_img {
    height: 142px;
  }
  .csr_global .csr_global_timeline_line {
    top: auto;
    bottom: 18px;
    left: -20px;
    right: -20px;
  }
}

.csr_journey {
  display: flex;
  gap: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_left {
  position: sticky;
  top: 0;
  width: max(468px * var(--base-ratio), 468 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  align-self: flex-start;
}
.csr_journey .csr_journey_txt {
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_journey .csr_journey_title {
    font-size: var(--fs-h2-mob);
  }
}
.csr_journey .csr_journey_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.csr_journey .csr_journey_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_desc {
    font-size: var(--fs-p1-tab);
  }
}
.csr_journey .csr_journey_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.csr_journey .csr_journey_tabs {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_tab {
  width: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  text-align: center;
  cursor: pointer;
  border: 1px solid #D1D2D4;
  background: #FFFFFF;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_tab {
    font-size: 16px;
  }
}
.csr_journey .csr_journey_tab {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  transition: all 0.2s;
}
.csr_journey .csr_journey_tab.is_active {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
  font-weight: 700;
}
.csr_journey .csr_journey_tab + .csr_journey_tab {
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_right {
  flex: 1;
  position: relative;
}
.csr_journey .csr_journey_line {
  position: absolute;
  left: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent));
  top: 0;
  width: 2px;
  background-color: #D1D2D4;
}
.csr_journey .csr_journey_line .csr_journey_line_active {
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 0;
  background: linear-gradient(180deg, #FFFFFF 0%, #025997 57%);
}
@keyframes csr_circle_spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.csr_journey .csr_journey_circle {
  position: absolute;
  left: calc(max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent)) + 1px - max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent)) / 2);
  top: 0;
  width: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  height: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  z-index: 2;
}
.csr_journey .csr_journey_circle::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Ccircle cx='21' cy='21' r='20' fill='none' stroke='%23024781' stroke-width='2'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  -webkit-mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  mask-image: conic-gradient(from 0deg, transparent 0deg, #000 90deg, transparent 180deg, #000 270deg, transparent 360deg);
  animation: csr_circle_spin 2s linear infinite;
}
.csr_journey .csr_journey_circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  height: max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #025997;
}
.csr_journey .csr_journey_cards {
  display: flex;
  flex-direction: column;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_card {
  display: flex;
  align-items: center;
}
.csr_journey .csr_journey_card_dot {
  position: relative;
  z-index: 1;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 2px solid #BCBDC1;
  background: #FFFFFF;
  flex-shrink: 0;
}
.csr_journey .csr_journey_card_dot.is_active {
  border-color: #025997;
}
.csr_journey .csr_journey_card_line {
  width: max(154px * var(--base-ratio), 154 / var(--base-size) * var(--base-percent));
  height: 0;
  border-top: 1px dashed #D1D2D4;
  flex-shrink: 0;
}
.csr_journey .csr_journey_card_body {
  width: max(445px * var(--base-ratio), 445 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  background: #FFFFFF;
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_card_content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_card_top {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.csr_journey .csr_journey_card_tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  border: 1px solid #025997;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_card_tag {
    font-size: 14px;
  }
}
.csr_journey .csr_journey_card_tag {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}
.csr_journey .csr_journey_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .csr_journey .csr_journey_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.csr_journey .csr_journey_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.csr_journey .csr_journey_card_bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.csr_journey .csr_journey_card_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_card_date {
    font-size: 16px;
  }
}
.csr_journey .csr_journey_card_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.csr_journey .csr_journey_card_outlink {
  width: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  cursor: pointer;
  flex-shrink: 0;
}
.csr_journey .csr_journey_card_outlink .outlink_default {
  display: block;
  width: 100%;
  height: 100%;
}
.csr_journey .csr_journey_card_outlink .outlink_hover {
  display: none;
  width: 100%;
  height: 100%;
}
.csr_journey .csr_journey_card_outlink .outlink_tb {
  display: none;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 1025px) and (hover: hover) {
  .csr_journey .csr_journey_card_outlink:hover .outlink_default {
    display: none;
  }
  .csr_journey .csr_journey_card_outlink:hover .outlink_hover {
    display: block;
  }
}
@media screen and (max-width: 1024px) {
  .csr_journey .csr_journey_card_outlink {
    width: 28px;
    height: 28px;
  }
  .csr_journey .csr_journey_card_outlink .outlink_default {
    display: none;
  }
  .csr_journey .csr_journey_card_outlink .outlink_hover {
    display: none;
  }
  .csr_journey .csr_journey_card_outlink .outlink_tb {
    display: block;
  }
}
.csr_journey .csr_journey_card_img {
  height: max(212px * var(--base-ratio), 212 / var(--base-size) * var(--base-percent));
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.csr_journey .csr_journey_card_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .csr_journey {
    width: 688px;
    gap: 0;
    padding-bottom: 160px;
  }
  .csr_journey .csr_journey_left {
    width: 335px;
    top: 80px;
  }
  .csr_journey .csr_journey_txt {
    gap: 18px;
    padding-top: 0;
  }
  .csr_journey .csr_journey_tabs {
    flex-direction: row;
    gap: 8px;
    margin-top: 48px;
  }
  .csr_journey .csr_journey_tab {
    width: auto;
    height: 52px;
    padding: 0 20px;
  }
  .csr_journey .csr_journey_tab + .csr_journey_tab {
    margin-top: 0;
  }
  .csr_journey .csr_journey_line {
    left: 9.5px;
    width: 1px;
  }
  .csr_journey .csr_journey_line_active {
    width: 1px;
  }
  .csr_journey .csr_journey_cards {
    padding-left: 7px;
    padding-top: 60px;
  }
  .csr_journey .csr_journey_circle {
    left: 0px;
    width: 20px;
    height: 20px;
  }
  .csr_journey .csr_journey_circle::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='none' stroke='%23024781' stroke-width='1'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  }
  .csr_journey .csr_journey_circle::after {
    width: 7px;
    height: 7px;
  }
  .csr_journey .csr_journey_cards {
    gap: 60px;
  }
  .csr_journey .csr_journey_card_dot {
    width: 6px;
    height: 6px;
    border-width: 1px;
  }
  .csr_journey .csr_journey_card_line {
    width: 28px;
  }
  .csr_journey .csr_journey_card_body {
    width: 312px;
    min-height: 191px;
    padding: 24px 18px;
  }
  .csr_journey .csr_journey_card_content {
    height: auto;
    flex: 1;
  }
  .csr_journey .csr_journey_card_img {
    height: auto;
    margin-top: 20px;
  }
  .csr_journey .csr_journey_card_tag {
    height: 28px;
    padding: 0 8px;
  }
  .csr_journey .csr_journey_card_outlink {
    width: 28px;
    height: 28px;
  }
}
@media screen and (max-width: 767px) {
  .csr_journey {
    flex-direction: column;
    width: calc(100% - 40px);
    gap: 0;
    padding-bottom: 160px;
  }
  .csr_journey .csr_journey_left {
    position: static;
    width: 100%;
    align-self: auto;
    margin-bottom: 60px;
  }
  .csr_journey .csr_journey_txt {
    gap: 18px;
    padding-top: 0;
  }
  .csr_journey .csr_journey_tabs {
    flex-direction: row;
    gap: 8px;
    margin-top: 48px;
  }
  .csr_journey .csr_journey_tab {
    width: auto;
    height: 52px;
    padding: 0 20px;
  }
  .csr_journey .csr_journey_tab + .csr_journey_tab {
    margin-top: 0;
  }
  .csr_journey .csr_journey_right {
    margin-top: 0;
  }
  .csr_journey .csr_journey_line {
    left: 0;
    width: 1px;
  }
  .csr_journey .csr_journey_line_active {
    width: 1px;
  }
  .csr_journey .csr_journey_cards {
    padding-left: 0;
    padding-top: 0;
    gap: 60px;
  }
  .csr_journey .csr_journey_card_line {
    width: 20px;
  }
  .csr_journey .csr_journey_card_dot {
    margin-left: -2.5px;
  }
  .csr_journey .csr_journey_card_content {
    height: auto;
    justify-content: flex-start;
    gap: 56px;
  }
  .csr_journey .csr_journey_card_tag {
    height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
  .csr_journey .csr_journey_circle {
    left: -9.5px;
    width: 20px;
    height: 20px;
  }
  .csr_journey .csr_journey_circle::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='none' stroke='%23024781' stroke-width='1'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  }
  .csr_journey .csr_journey_circle::after {
    width: 7px;
    height: 7px;
  }
  .csr_journey .csr_journey_card_dot {
    width: 6px;
    height: 6px;
    border-width: 1px;
  }
  .csr_journey .csr_journey_card_body {
    width: auto;
    flex: 1;
    padding: 24px 18px;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .csr_journey .csr_journey_card_img {
    height: auto;
    aspect-ratio: 276/148;
    margin-top: 0;
  }
  .csr_journey .csr_journey_card_outlink {
    width: 28px;
    height: 28px;
  }
}

html[lang=en] .csr_journey .csr_journey_card_tag {
  display: block;
  align-self: stretch;
  width: 100%;
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
}
@media screen and (min-width: 1025px) {
  html[lang=en] .csr_journey .csr_journey_card_content {
    height: auto;
    justify-content: flex-start;
    gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  }
}

.csr_journey_tabs_fixed {
  display: none;
}

@media screen and (max-width: 767px) {
  .csr_journey_tabs_fixed {
    display: none;
    width: 100%;
    height: 60px;
  }
  .csr_journey_tabs_fixed .csr_journey_tab {
    flex: 1;
    width: auto;
    height: 60px;
    padding: 0;
    border-radius: 0;
    border: none;
    border-top: 1px solid #D1D2D4;
    border-bottom: 1px solid #D1D2D4;
    background: #FFFFFF;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #161D27;
    cursor: pointer;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .csr_journey_tabs_fixed .csr_journey_tab {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  .csr_journey_tabs_fixed .csr_journey_tab + .csr_journey_tab {
    border-left: 1px solid #D1D2D4;
  }
  .csr_journey_tabs_fixed .csr_journey_tab.is_active {
    background: #025997;
    color: #FFFFFF;
    font-weight: 700;
    border-color: #025997;
  }
  .csr_journey_tabs_fixed.is_visible {
    display: flex;
  }
}
.safety {
  position: relative;
}

.safety_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.safety_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.safety_hero .safety_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.safety_hero .safety_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .safety_hero .safety_hero_bg {
    width: 90%;
  }
}
.safety_hero .safety_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.safety_hero .safety_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_hero .safety_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_hero .safety_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.safety_hero .safety_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.safety_hero .safety_hero_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_hero .safety_hero_desc {
    font-size: var(--fs-p1-tab);
  }
}
.safety_hero .safety_hero_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

.safety_section_inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}

.safety_section_title {
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.safety_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}

.safety_policy {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}

.safety_policy_card {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  outline: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}

.safety_policy_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.safety_policy_item.has_no_border {
  border-bottom: none;
}

.safety_policy_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_policy_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_policy_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.safety_policy_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.safety_policy_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_policy_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.safety_policy_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.safety_policy_sign {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}

.safety_policy_sign_txt {
  display: flex;
  flex-direction: column;
  text-align: right;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_policy_sign_txt {
    font-size: var(--fs-p1-tab);
  }
}
.safety_policy_sign_txt {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.safety_policy_sign_stamp {
  width: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
  height: max(90px * var(--base-ratio), 90 / var(--base-size) * var(--base-percent));
}

.safety_strategy {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding-bottom: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}

.safety_strategy_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}

.safety_strategy_txt {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  margin-bottom: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}

.safety_strategy_txt_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_txt_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_strategy_txt_title {
    font-size: var(--fs-h5-mob);
  }
}
.safety_strategy_txt_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.safety_strategy_txt_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_txt_desc {
    font-size: var(--fs-p1-tab);
  }
}
.safety_strategy_txt_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

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

.safety_strategy_vision {
  position: relative;
  width: 100%;
  height: max(197px * var(--base-ratio), 197 / var(--base-size) * var(--base-percent));
}
.safety_strategy_vision .safety_strategy_vision_shape {
  width: 100%;
  height: 100%;
  display: block;
}
.safety_strategy_vision .safety_strategy_vision_inner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  padding-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.safety_strategy_vision .safety_strategy_vision_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_vision .safety_strategy_vision_label {
    font-size: 16px;
  }
}
.safety_strategy_vision .safety_strategy_vision_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.safety_strategy_vision .safety_strategy_vision_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_vision .safety_strategy_vision_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_strategy_vision .safety_strategy_vision_title {
    font-size: var(--fs-h4-mob);
  }
}
.safety_strategy_vision .safety_strategy_vision_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

.safety_strategy_goal {
  width: 100%;
  height: max(125px * var(--base-ratio), 125 / var(--base-size) * var(--base-percent));
  background: #025997;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.safety_strategy_goal_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_goal_label {
    font-size: 16px;
  }
}
.safety_strategy_goal_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.safety_strategy_goal_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_goal_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_strategy_goal_title {
    font-size: var(--fs-h4-mob);
  }
}
.safety_strategy_goal_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.safety_strategy_list {
  display: flex;
  width: 100%;
  margin-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}

.safety_strategy_item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: max(33px * var(--base-ratio), 33 / var(--base-size) * var(--base-percent)) 0;
  border-right: 1px solid #D1D2D4;
}
.safety_strategy_item:first-child {
  border-left: 1px solid #D1D2D4;
}
.safety_strategy_item .safety_strategy_item_ico {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.safety_strategy_item .safety_strategy_item_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_item .safety_strategy_item_label {
    font-size: 16px;
  }
}
.safety_strategy_item .safety_strategy_item_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.safety_strategy_item .safety_strategy_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_item .safety_strategy_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_strategy_item .safety_strategy_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.safety_strategy_item .safety_strategy_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: 0 max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}

.safety_strategy_slogan {
  margin-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  width: 100%;
  height: max(87px * var(--base-ratio), 87 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
}
.safety_strategy_slogan strong {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_strategy_slogan strong {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .safety_strategy_slogan strong {
    font-size: var(--fs-h5-mob);
  }
}
.safety_strategy_slogan strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

.safety_cert {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.safety_cert .safety_section_title {
  position: static;
}

.safety_cert_bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: max(392px * var(--base-ratio), 392 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
}

.safety_cert_content {
  display: flex;
  flex-direction: column;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}

.safety_cert_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_cert_desc {
    font-size: var(--fs-p1-tab);
  }
}
.safety_cert_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.safety_cert_list {
  display: flex;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}

.safety_cert_item {
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}

.safety_cert_cover {
  width: 100%;
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.safety_cert_cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.safety_cert_download {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
}
.safety_cert_download span {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .safety_cert_download span {
    font-size: 16px;
  }
}
.safety_cert_download span {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.safety_cert_download img {
  width: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.safety_cert_download .ico_hover {
  display: none;
}
@media (hover: hover) {
  .safety_cert_download:hover .ico_default {
    display: none;
  }
  .safety_cert_download:hover .ico_hover {
    display: block;
  }
}

@media screen and (max-width: 1024px) {
  .safety_hero .safety_hero_content {
    gap: 26px;
    padding: 0 40px;
  }
  .safety_section_inner {
    flex-direction: column;
    gap: 16px;
    padding: 0 40px;
  }
  .safety_section_title {
    position: static;
    width: auto;
  }
  .safety_policy {
    padding: 128px 0;
  }
  .safety_policy_card {
    width: 100%;
    border-radius: 12px;
    padding: 32px 40px;
    gap: 24px;
  }
  .safety_policy_item {
    gap: 6px;
    padding-bottom: 24px;
  }
  .safety_policy_item.has_no_border {
    border-bottom: 1px solid #D1D2D4;
  }
  .safety_policy_sign {
    gap: 12px;
  }
  .safety_policy_sign_stamp {
    width: 81px;
    height: 81px;
  }
  .safety_strategy {
    padding-bottom: 128px;
  }
  .safety_strategy_content {
    width: 100%;
  }
  .safety_strategy_txt {
    gap: 16px;
    margin-bottom: 64px;
  }
  .safety_strategy_vision {
    height: auto;
  }
  .safety_strategy_vision .safety_strategy_vision_inner {
    padding-bottom: 16px;
  }
  .safety_strategy_vision .safety_strategy_vision_label {
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_vision .safety_strategy_vision_label {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_vision .safety_strategy_vision_title {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_vision .safety_strategy_vision_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .safety_strategy_vision .safety_strategy_vision_title {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_goal {
    height: 84px;
    border-radius: 4px;
    margin-top: 13px;
  }
  .safety_strategy_goal_label {
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_goal_label {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_goal_title {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_goal_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .safety_strategy_goal_title {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_list {
    margin-top: 19px;
  }
  .safety_strategy_item {
    padding: 22px 0;
  }
  .safety_strategy_item .safety_strategy_item_ico {
    width: 40px;
    height: 40px;
  }
  .safety_strategy_item .safety_strategy_item_label {
    font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 14px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_item .safety_strategy_item_label {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_item .safety_strategy_item_title {
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    margin-top: 5px;
    padding: 0;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_item .safety_strategy_item_title {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .safety_strategy_slogan {
    height: 59px;
    border-radius: 4px;
    margin-top: 19px;
  }
  .safety_strategy_slogan strong {
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .safety_strategy_slogan strong {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .safety_cert {
    padding: 128px 0 160px;
  }
  .safety_cert_bg {
    height: 380px;
  }
  .safety_cert_content {
    gap: 48px;
  }
  .safety_cert_list {
    gap: 20px;
  }
  .safety_cert_item {
    flex: 1;
    width: auto;
    gap: 12px;
  }
  .safety_cert_cover {
    height: auto;
    aspect-ratio: 334/220;
  }
  .safety_cert_download img {
    width: 32px;
    height: 32px;
  }
}
@media screen and (max-width: 767px) {
  .safety_hero .safety_hero_content {
    padding: 0 20px;
  }
  .safety_section_inner {
    padding: 0 20px;
  }
  .safety_policy_card {
    padding: 28px 20px;
  }
  .safety_strategy_diagram_img img {
    width: 100%;
    height: auto;
  }
  .safety_strategy_diagram .safety_strategy_vision,
  .safety_strategy_diagram .safety_strategy_goal,
  .safety_strategy_diagram .safety_strategy_list,
  .safety_strategy_diagram .safety_strategy_slogan {
    display: none;
  }
  .safety_cert_bg {
    height: 434px;
  }
  .safety_cert_list {
    flex-direction: column;
  }
  .safety_cert_item {
    flex: none;
    width: 100%;
  }
}
.ethics {
  position: relative;
}
.ethics .intro_tab {
  width: auto;
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .ethics .intro_tab {
    width: 163px;
    height: 52px;
    padding: 0;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .ethics .intro_page_tab {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }
}

.ethics_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ethics_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.ethics_hero .ethics_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.ethics_hero .ethics_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .ethics_hero .ethics_hero_bg {
    width: 90%;
  }
}
.ethics_hero .ethics_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.ethics_hero .ethics_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_hero .ethics_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_hero .ethics_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.ethics_hero .ethics_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .ethics_hero .ethics_hero_content {
    gap: 26px;
  }
  .ethics_hero .ethics_hero_title {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_hero .ethics_hero_title {
    padding: 0 20px;
  }
}

@media screen and (max-width: 1024px) {
  html[lang=en] .page_esg .intro_page_tab {
    flex-direction: column;
    align-self: center;
    width: 100%;
    max-width: 400px;
    gap: 8px;
  }
  html[lang=en] .page_esg .intro_tab {
    width: 100%;
    height: 52px;
    padding: 0 20px;
    border-radius: 8px;
  }
}
.ethics_section_inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_section_inner {
    flex-direction: column;
    gap: 16px;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_section_inner {
    padding: 0 20px;
  }
}

.ethics_section_title {
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.ethics_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  width: max(420px * var(--base-ratio), 420 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .ethics_section_title {
    position: static;
    width: 100%;
  }
}

.ethics_values {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .ethics_values {
    padding: 144px 40px 128px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_values {
    padding: 144px 20px 128px;
  }
}

.ethics_values_heading {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_heading {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_values_heading {
    font-size: var(--fs-h2-mob);
  }
}
.ethics_values_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_values_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_values_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_values_desc {
    margin-top: 26px;
  }
}

.ethics_values_cards {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.ethics_values_cards .ethics_values_card {
  flex: none;
}
@media screen and (max-width: 1024px) {
  .ethics_values_cards {
    gap: 12px;
    margin-top: 64px;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .ethics_values_cards {
    flex-direction: column;
  }
  .ethics_values_cards .ethics_values_card {
    width: 100% !important;
  }
}

.ethics_values_card {
  position: relative;
  height: max(520px * var(--base-ratio), 520 / var(--base-size) * var(--base-percent));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  cursor: pointer;
}
.ethics_values_card::after {
  content: "";
  position: absolute;
  inset: 0;
  backdrop-filter: blur(12px);
  background: rgba(0, 0, 0, 0.25);
  transition: opacity 0.3s;
  z-index: 1;
}
.ethics_values_card.is_active {
  cursor: default;
}
.ethics_values_card.is_active::after {
  opacity: 0;
  pointer-events: none;
}
.ethics_values_card.is_active .ethics_values_card_off {
  opacity: 0;
  transform: translateX(-20px);
}
.ethics_values_card.is_active .ethics_values_card_on {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.3s 0.3s, transform 0.3s 0.3s;
}
.ethics_values_card .ethics_values_card_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: max(1064px * var(--base-ratio), 1064 / var(--base-size) * var(--base-percent));
  height: 100%;
  object-fit: cover;
}
.ethics_values_card .ethics_values_card_off {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  text-align: center;
  white-space: nowrap;
  transition: opacity 0.3s, transform 0.3s;
}
.ethics_values_card .ethics_values_card_off .ethics_values_card_name {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_card .ethics_values_card_off .ethics_values_card_name {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_values_card .ethics_values_card_off .ethics_values_card_name {
    font-size: var(--fs-h4-mob);
  }
}
.ethics_values_card .ethics_values_card_off .ethics_values_card_name {
  letter-spacing: -0.02em;
}
.ethics_values_card .ethics_values_card_on {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  text-align: left;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.2s, transform 0.2s;
}
.ethics_values_card .ethics_values_card_on .ethics_values_card_name {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_card .ethics_values_card_on .ethics_values_card_name {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_values_card .ethics_values_card_on .ethics_values_card_name {
    font-size: var(--fs-h2-mob);
  }
}
.ethics_values_card .ethics_values_card_on .ethics_values_card_name {
  letter-spacing: -0.02em;
}
@media screen and (max-width: 1024px) {
  .ethics_values_card {
    height: 400px;
    border-radius: 12px;
  }
  .ethics_values_card .ethics_values_card_bg {
    width: 100%;
  }
  .ethics_values_card .ethics_values_card_off {
    padding: 72px 0;
    gap: 6px;
  }
  .ethics_values_card .ethics_values_card_on {
    padding: 72px 32px;
    gap: 36px;
    white-space: normal;
  }
  .ethics_values_card .ethics_values_card_title {
    gap: 6px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_values_card {
    height: 400px;
    border-radius: 12px;
  }
  .ethics_values_card::after {
    display: none;
  }
  .ethics_values_card .ethics_values_card_off {
    display: none;
  }
  .ethics_values_card .ethics_values_card_on {
    opacity: 1;
    transform: none;
    padding: 48px 28px;
    gap: 36px;
    white-space: normal;
  }
  .ethics_values_card .ethics_values_card_bg {
    width: 100%;
  }
  .ethics_values_card .ethics_values_card_title {
    gap: 6px;
  }
}
.ethics_values_card .ethics_values_card_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_card .ethics_values_card_label {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_values_card .ethics_values_card_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.ethics_values_card .ethics_values_card_name {
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.ethics_values_card .ethics_values_card_title {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.ethics_values_card .ethics_values_card_txt {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  white-space: normal;
}
.ethics_values_card .ethics_values_card_txt strong {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_card .ethics_values_card_txt strong {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_values_card .ethics_values_card_txt strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.ethics_values_card .ethics_values_card_txt p {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_values_card .ethics_values_card_txt p {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_values_card .ethics_values_card_txt p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.ethics_charter {
  position: relative;
  z-index: 1;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ethics_charter {
    padding: 128px 0;
  }
}

.ethics_charter_bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #F3F3F3;
}

.ethics_charter_card {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_charter_card {
    width: 100%;
    border-radius: 12px;
    padding: 40px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_charter_card {
    padding: 28px 20px;
  }
}

.ethics_charter_intro {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_charter_intro {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_charter_intro {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_charter_intro {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_charter_body {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_charter_body {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_charter_body {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_principles {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ethics_principles {
    padding: 128px 0;
  }
}

.ethics_principles_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .ethics_principles_content {
    width: 100%;
  }
}

.ethics_principles_block {
  display: flex;
  flex-direction: column;
}
.ethics_principles_block + .ethics_principles_block {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_principles_block + .ethics_principles_block {
    margin-top: 64px;
  }
}

.ethics_principles_heading {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_principles_heading {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_principles_heading {
    font-size: var(--fs-h4-mob);
  }
}
.ethics_principles_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_principles_sub {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_principles_sub {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_principles_sub {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_principles_sub {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_principles_sub {
    margin-top: 10px;
  }
}

.ethics_principles_desc {
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.ethics_principles_desc strong {
  display: block;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_principles_desc strong {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_principles_desc strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.ethics_principles_desc .ethics_principles_list {
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_principles_desc .ethics_principles_list {
    margin-top: 8px;
  }
}
@media screen and (max-width: 1024px) {
  .ethics_principles_desc {
    margin-top: 26px;
  }
}

.ethics_principles_list {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.ethics_principles_list li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_principles_list li {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_principles_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_principles_list li::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #6D6E72;
  margin-top: 0.65em;
}
@media screen and (max-width: 1024px) {
  .ethics_principles_list {
    gap: 8px;
    margin-top: 26px;
  }
  .ethics_principles_list li {
    gap: 6px;
  }
  .ethics_principles_list li::before {
    width: 2px;
    height: 2px;
  }
}

.ethics_principles_img {
  margin-top: max(84px * var(--base-ratio), 84 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.ethics_principles_img img {
  width: 100%;
  display: block;
}
@media screen and (max-width: 1024px) {
  .ethics_principles_img {
    margin-top: 64px;
    border-radius: 10px;
  }
}

.ethics_conduct {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding-bottom: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_conduct {
    padding-bottom: 128px;
  }
}

.ethics_conduct_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_conduct_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .ethics_conduct_grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.ethics_conduct_card {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_conduct_card {
    gap: 8px;
    padding: 20px;
    border-radius: 10px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_conduct_card {
    min-height: 180px;
  }
}

.ethics_conduct_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_conduct_num {
    font-size: 16px;
  }
}
.ethics_conduct_num {
  letter-spacing: -0.02em;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_conduct_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_conduct_title {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_conduct_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_conduct_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_conduct_desc {
    font-size: 16px;
  }
}
.ethics_conduct_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_guidelines {
  position: relative;
  z-index: 1;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ethics_guidelines {
    padding: 128px 0 160px;
  }
}

.ethics_guidelines_bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #E8F3FE;
}

.ethics_guidelines_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_guidelines_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .ethics_guidelines_grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.ethics_guidelines_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .ethics_guidelines_card {
    height: 128px;
    padding: 16px 20px;
    border-radius: 10px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_guidelines_card {
    height: auto;
    min-height: 120px;
  }
}
.ethics_guidelines_card.is_active {
  background: #025997;
}
.ethics_guidelines_card.is_active .ethics_guidelines_num {
  color: #FFFFFF;
}
.ethics_guidelines_card.is_active .ethics_guidelines_title {
  color: #FFFFFF;
}

.ethics_guidelines_card_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ethics_guidelines_num {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_guidelines_num {
    font-size: 16px;
  }
}
.ethics_guidelines_num {
  letter-spacing: -0.02em;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_guidelines_ico {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  color: #818286;
}
.ethics_guidelines_card.is_active .ethics_guidelines_ico {
  color: #FFFFFF;
}

.ethics_guidelines_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_guidelines_title {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_guidelines_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_popup {
  position: fixed;
  inset: 0;
  z-index: 1100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.ethics_popup.is_visible {
  opacity: 1;
  visibility: visible;
}

.ethics_popup_dimmed {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.6);
}

.ethics_popup_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  max-width: 870px;
  max-height: calc(100dvh - 120px);
  overflow: hidden;
  background: #FFFFFF;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_popup_inner {
    width: calc(100% - 80px);
    max-width: 688px;
    border-radius: 12px;
    padding: 36px 30px;
    gap: 32px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_inner {
    width: calc(100% - 40px);
    max-width: 335px;
    border-radius: 12px;
    padding: 36px 30px;
    gap: 32px;
  }
}

.ethics_popup_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .ethics_popup_header {
    padding-bottom: 16px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_header {
    align-items: flex-start;
    padding-bottom: 16px;
  }
}

.ethics_popup_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_popup_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_title {
    font-size: var(--fs-h3-mob);
  }
}
.ethics_popup_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_popup_close {
  flex-shrink: 0;
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  color: #818286;
  transition: opacity 0.3s ease;
}
@media screen and (max-width: 1024px) {
  .ethics_popup_close {
    width: 40px;
    height: 40px;
  }
  .ethics_popup_close svg {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_close {
    width: 40px;
    height: 40px;
  }
  .ethics_popup_close svg {
    width: 40px;
    height: 40px;
  }
}
@media (hover: hover) {
  .ethics_popup_close:hover:hover {
    opacity: 0.7;
  }
}

.ethics_popup_body {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.ethics_popup_list {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  list-style: none;
  margin: 0;
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) 0 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}
.ethics_popup_list::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 1024px) {
  .ethics_popup_list {
    gap: 8px;
    padding-right: 16px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_list {
    gap: 8px;
    padding-right: 16px;
  }
}

.ethics_popup_scrollbar {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 2px;
  background: #F3F3F3;
  border-radius: 999px;
  z-index: 2;
}

.ethics_popup_scrollbar_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #818286;
  border-radius: 999px;
  cursor: grab;
  touch-action: none;
}
.ethics_popup_scrollbar_thumb:active {
  cursor: grabbing;
}

.ethics_popup_item {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_popup_item {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_popup_item {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_popup_item > div {
  flex: 1;
  min-width: 0;
}
.ethics_popup_item::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  margin-top: 0.65em;
  background: #818286;
}
@media screen and (max-width: 1024px) {
  .ethics_popup_item {
    gap: 6px;
  }
  .ethics_popup_item::before {
    width: 2px;
    height: 2px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_popup_item {
    gap: 6px;
  }
  .ethics_popup_item::before {
    width: 2px;
    height: 2px;
  }
}
.ethics_popup_item dl {
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.ethics_popup_item dl dd {
  margin-left: 0;
  padding-left: 6px;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_popup_item dl dd {
    font-size: 16px;
  }
}
.ethics_popup_item dl dd {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_popup_item dl dd.has_dot {
  position: relative;
}
.ethics_popup_item dl dd.has_dot::before {
  content: "·";
  position: absolute;
  left: 0;
  top: 0;
  line-height: inherit;
  color: inherit;
}
@media screen and (max-width: 1024px) {
  .ethics_popup_item dl {
    margin-top: 6px;
  }
}

.ethics_anchor_area {
  position: relative;
}

.ethics_anchor_fixed {
  display: none;
}

@media screen and (max-width: 1024px) {
  .ethics_anchor_fixed {
    display: none;
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    width: 100%;
    height: 72px;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    background: #FFFFFF;
    border-top: 1px solid #D1D2D4;
    border-bottom: 1px solid #D1D2D4;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .ethics_anchor_fixed {
    height: 60px;
    border-top-color: rgba(209, 210, 212, 0.6);
    border-bottom-color: rgba(209, 210, 212, 0.6);
  }
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_fixed.is_visible {
    display: flex;
  }
  .ethics_anchor_fixed .ethics_anchor_dot {
    display: none;
  }
  .ethics_anchor_fixed .ethics_anchor_item {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
    color: #161D27;
    background: #FFFFFF;
    border-right: 1px solid #D1D2D4;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .ethics_anchor_fixed .ethics_anchor_item {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .ethics_anchor_fixed .ethics_anchor_item {
    border-right-color: rgba(209, 210, 212, 0.6);
  }
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_fixed .ethics_anchor_item:last-child {
    border-right: none;
  }
  .ethics_anchor_fixed .ethics_anchor_item.is_active {
    background: #025997;
    color: #FFFFFF;
    font-weight: 700;
  }
}
.ethics_anchor {
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.ethics_anchor.is_hidden {
  opacity: 0;
  pointer-events: none;
}
.ethics_anchor {
  height: 0;
  overflow: visible;
  width: fit-content;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  margin-bottom: calc(max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) * -1);
  margin-left: auto;
  margin-right: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_anchor {
    position: static;
    height: 72px;
    width: 100%;
    margin: 0;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    overflow: hidden;
    background: #FFFFFF;
    border-top: 1px solid #D1D2D4;
    border-bottom: 1px solid #D1D2D4;
  }
}
@media screen and (max-width: 767px) {
  .ethics_anchor {
    height: 60px;
    border-top-color: rgba(209, 210, 212, 0.6);
    border-bottom-color: rgba(209, 210, 212, 0.6);
  }
}

.ethics_anchor_dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #818286;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_dot {
    display: none;
  }
}

.ethics_anchor_item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: round(down, max(14px * var(--base-ratio), 14 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_item {
    font-size: 12px;
  }
}
.ethics_anchor_item {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-decoration: none;
  transition: none;
}
.ethics_anchor_item.is_active {
  font-weight: 700;
  line-height: 1.5;
  color: #025997;
}
.ethics_anchor_item.is_active .ethics_anchor_dot {
  background: #025997;
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_item {
    flex: 1;
    justify-content: center;
    text-align: center;
    word-break: keep-all;
    gap: 0;
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
    color: #161D27;
    background: #FFFFFF;
    border-right: 1px solid #D1D2D4;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .ethics_anchor_item {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .ethics_anchor_item:last-child {
    border-right: none;
  }
  .ethics_anchor_item.is_active {
    background: #025997;
    color: #FFFFFF;
    font-weight: 700;
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .ethics_anchor_item {
    border-right-color: rgba(209, 210, 212, 0.6);
  }
}

.ethics_activity_section {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
.ethics_activity_section + .ethics_activity_section {
  padding-top: 0;
}
.ethics_activity_section:last-child {
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_activity_section {
    padding: 128px 0;
  }
  .ethics_activity_section + .ethics_activity_section {
    padding-top: 0;
  }
  .ethics_activity_section:last-child {
    padding-bottom: 160px;
  }
}

.ethics_activity_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .ethics_activity_content {
    width: 100%;
  }
}

.ethics_activity_desc {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_activity_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_desc {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_activity_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_activity_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  row-gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_activity_grid {
    column-gap: 20px;
    row-gap: 40px;
    margin-top: 32px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_grid {
    grid-template-columns: 1fr;
    row-gap: 32px;
  }
}

.ethics_activity_card {
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_activity_card {
    gap: 28px;
  }
}

.ethics_activity_card_img {
  width: 100%;
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.ethics_activity_card_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 1024px) {
  .ethics_activity_card_img {
    height: auto;
    aspect-ratio: 334/191;
    border-radius: 6px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_card_img {
    aspect-ratio: 335/192;
  }
}

.ethics_activity_card_txt {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_activity_card_txt {
    gap: 6px;
  }
}

.ethics_activity_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_activity_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_activity_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_activity_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_activity_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_activity_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_activity_list {
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_activity_list {
    border-radius: 12px;
    padding: 32px 40px;
    gap: 24px;
    margin-top: 32px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_list {
    padding: 28px 20px;
    gap: 24px;
  }
}

.ethics_activity_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.ethics_activity_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
@media screen and (max-width: 1024px) {
  .ethics_activity_item {
    gap: 6px;
    padding-bottom: 24px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_item {
    padding-bottom: 24px;
  }
}

.ethics_activity_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_activity_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_activity_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_activity_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_activity_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_activity_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_activity_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_reporting_notice_wrap {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_notice_wrap {
    padding: 128px 40px 0;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_notice_wrap {
    padding: 128px 20px 0;
  }
}

.ethics_reporting_notice {
  display: flex;
  align-items: center;
  justify-content: center;
  height: max(132px * var(--base-ratio), 132 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_notice {
    height: auto;
    padding: 32px 40px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_notice {
    padding: 32px 20px;
  }
}

.ethics_reporting_notice_text {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_notice_text {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_notice_text {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_reporting_notice_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}

.ethics_reporting_section {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_section {
    padding: 80px 0 160px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_section {
    padding: 80px 0 160px;
  }
}

.ethics_reporting_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_content {
    width: 100%;
  }
}

.ethics_reporting_list {
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_list {
    border-radius: 12px;
    padding: 32px 40px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_list {
    padding: 28px 20px;
    gap: 24px;
  }
}

.ethics_reporting_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.ethics_reporting_item:last-child, .ethics_reporting_item.is_last {
  padding-bottom: 0;
  border-bottom: none;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_item {
    gap: 6px;
    padding-bottom: 24px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_item {
    padding-bottom: 24px;
  }
}

.ethics_reporting_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_reporting_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_reporting_bullet_list {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.ethics_reporting_bullet_list li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_bullet_list li {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_reporting_bullet_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_reporting_bullet_list li::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #6D6E72;
  margin-top: 0.65em;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_bullet_list {
    gap: 4px;
  }
  .ethics_reporting_bullet_list li {
    gap: 6px;
  }
  .ethics_reporting_bullet_list li::before {
    width: 3px;
    height: 3px;
  }
}

.ethics_reporting_info {
  background: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) 0;
  text-align: center;
}
.ethics_reporting_info p {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_info p {
    font-size: 16px;
  }
}
.ethics_reporting_info p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_info {
    border-radius: 8px;
    padding: 20px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_info {
    padding: 20px;
  }
}

.ethics_reporting_links {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_links {
    gap: 20px;
    margin-top: 32px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_links {
    flex-direction: column;
    gap: 20px;
  }
}

.ethics_reporting_link_btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #FFFFFF;
  text-decoration: none;
  transition: opacity 0.2s;
}
.ethics_reporting_link_btn span {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_link_btn span {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_reporting_link_btn span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.ethics_reporting_link_btn .ethics_reporting_link_arrow {
  flex-shrink: 0;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.ethics_reporting_link_btn .ethics_reporting_link_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .ethics_reporting_link_btn:hover .ethics_reporting_link_arrow svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
.ethics_reporting_link_btn.is_primary {
  background: #025997;
}
.ethics_reporting_link_btn.is_secondary {
  background: #818286;
}
.ethics_reporting_link_btn.is_secondary span {
  font-weight: 600;
}
@media screen and (max-width: 1024px) {
  .ethics_reporting_link_btn {
    height: 80px;
    border-radius: 8px;
    padding: 0 20px;
  }
  .ethics_reporting_link_btn.is_secondary span {
    font-weight: 700;
  }
}
@media screen and (max-width: 767px) {
  .ethics_reporting_link_btn {
    flex: none;
    height: 80px;
    padding: 0 20px;
  }
}

.ethics_cleanposco_cards_wrap {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) 0 max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_cards_wrap {
    padding: 140px 40px 128px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_cards_wrap {
    padding: 140px 20px 128px;
  }
}

.ethics_cleanposco_cards {
  display: flex;
  justify-content: center;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_cards {
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_cards {
    flex-direction: column;
    gap: 20px;
  }
}

.ethics_cleanposco_card {
  width: max(460px * var(--base-ratio), 460 / var(--base-size) * var(--base-percent));
  height: max(490px * var(--base-ratio), 490 / var(--base-size) * var(--base-percent));
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: 0 max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.ethics_cleanposco_card.is_primary {
  background: #025997;
}
.ethics_cleanposco_card.is_light {
  background: #00A3F1;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_card {
    flex: 1;
    width: auto;
    height: 380px;
    justify-content: flex-start;
    padding: 36px 24px 0;
    border-radius: 12px;
    gap: 16px;
  }
  .ethics_cleanposco_card.is_light {
    padding: 36px 32px 0;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_card {
    flex: none;
    width: 100%;
    height: 380px;
    padding: 36px 24px 0;
    gap: 16px;
  }
  .ethics_cleanposco_card.is_light {
    padding: 36px 32px 0;
  }
}
@media screen and (max-width: 1024px) {
  :lang(en) .ethics_cleanposco_card {
    height: auto;
    min-height: 380px;
    padding-bottom: 36px;
  }
}

.ethics_cleanposco_card_ico {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_card_ico {
    width: 52px;
    height: 52px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_card_ico {
    width: 52px;
    height: 52px;
  }
}

.ethics_cleanposco_card_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_card_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_card_title {
    font-size: var(--fs-h4-mob);
  }
}
.ethics_cleanposco_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.ethics_cleanposco_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_cleanposco_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.ethics_cleanposco_process {
  position: relative;
  z-index: 1;
  background: #E8F3FE;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_process {
    padding: 128px 0;
  }
}

.ethics_cleanposco_process_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_process_content {
    width: 100%;
  }
}

.ethics_cleanposco_steps {
  display: flex;
  justify-content: space-between;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_steps {
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_steps {
    flex-wrap: wrap;
    gap: 12px;
  }
}

.ethics_cleanposco_step {
  width: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  height: max(158px * var(--base-ratio), 158 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.ethics_cleanposco_step.is_step1 {
  background: #3BB7F3;
}
.ethics_cleanposco_step.is_step2 {
  background: #0091DB;
}
.ethics_cleanposco_step.is_step3 {
  background: #017EC4;
}
.ethics_cleanposco_step.is_step4 {
  background: #025997;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_step {
    flex: 1;
    width: auto;
    height: 162px;
    padding: 20px 16px;
    border-radius: 8px;
    gap: 8px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_step {
    flex: none;
    width: calc(50% - 6px);
    padding: 20px 16px;
  }
}
:lang(en) .ethics_cleanposco_step {
  height: auto;
  justify-content: flex-start;
}
@media screen and (max-width: 1024px) {
  :lang(en) .ethics_cleanposco_step {
    height: auto;
  }
}

.ethics_cleanposco_step_label {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_step_label {
    font-size: 14px;
  }
}
.ethics_cleanposco_step_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.ethics_cleanposco_step_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_step_desc {
    font-size: 16px;
  }
}
.ethics_cleanposco_step_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.ethics_cleanposco_list {
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
}
.ethics_cleanposco_list.is_white {
  background: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_list {
    border-radius: 12px;
    padding: 32px 40px;
    gap: 24px;
    margin-top: 32px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_list {
    padding: 28px 20px;
    gap: 24px;
  }
}

.ethics_cleanposco_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.ethics_cleanposco_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.ethics_cleanposco_item.is_detail {
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_item.is_detail {
    gap: 10px;
  }
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_item {
    gap: 6px;
    padding-bottom: 24px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_item {
    padding-bottom: 24px;
  }
}

.ethics_cleanposco_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.ethics_cleanposco_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.ethics_cleanposco_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_cleanposco_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.ethics_cleanposco_bullet_list {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.ethics_cleanposco_bullet_list li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_bullet_list li {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_cleanposco_bullet_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_cleanposco_bullet_list li::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  background: #818286;
  margin-top: 0.65em;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_bullet_list {
    gap: 4px;
  }
  .ethics_cleanposco_bullet_list li {
    gap: 6px;
  }
  .ethics_cleanposco_bullet_list li::before {
    width: 2px;
    height: 2px;
  }
}

.ethics_cleanposco_detail {
  position: relative;
  z-index: 1;
}
.ethics_cleanposco_detail .ethics_section_title.is_white {
  color: #FFFFFF;
}

.ethics_cleanposco_detail_bg {
  position: sticky;
  top: 0;
  height: 100vh;
  background: url("/images/esg/ethics/cleanposco_detail_bg.jpg") no-repeat top center/cover;
}
.ethics_cleanposco_detail_bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(27, 26, 26, 0.34) 0%, rgba(27, 24, 24, 0) 100%);
  pointer-events: none;
}

.ethics_cleanposco_detail_body {
  position: relative;
  z-index: 1;
  margin-top: -100vh;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_body {
    padding: 128px 0 160px;
  }
}

.ethics_cleanposco_detail_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
}
.ethics_cleanposco_detail_content .ethics_cleanposco_list {
  margin-top: 0;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_content {
    width: 100%;
  }
}

.ethics_cleanposco_detail_box {
  background: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_box {
    border-radius: 6px;
    padding: 20px;
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .ethics_cleanposco_detail_box {
    padding: 20px;
    gap: 16px;
  }
}

.ethics_cleanposco_detail_group_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_group_title {
    font-size: var(--fs-p1-tab);
  }
}
.ethics_cleanposco_detail_group_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  display: block;
  margin-bottom: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_group_title {
    margin-bottom: 8px;
  }
}

.ethics_cleanposco_detail_bullet_list {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.ethics_cleanposco_detail_bullet_list li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_bullet_list li {
    font-size: 16px;
  }
}
.ethics_cleanposco_detail_bullet_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.ethics_cleanposco_detail_bullet_list li::before {
  content: "";
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  background: #818286;
  margin-top: 0.6em;
}
@media screen and (max-width: 1024px) {
  .ethics_cleanposco_detail_bullet_list {
    gap: 4px;
  }
  .ethics_cleanposco_detail_bullet_list li {
    gap: 6px;
  }
  .ethics_cleanposco_detail_bullet_list li::before {
    width: 3px;
    height: 3px;
  }
}

.fair_trade {
  position: relative;
}

.fair_trade_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fair_trade_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.fair_trade_hero .fair_trade_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.fair_trade_hero .fair_trade_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .fair_trade_hero .fair_trade_hero_bg {
    width: 90%;
  }
}
.fair_trade_hero .fair_trade_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.fair_trade_hero .fair_trade_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_hero .fair_trade_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_hero .fair_trade_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.fair_trade_hero .fair_trade_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

.fair_trade_section_inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_section_inner {
    flex-direction: column;
    gap: 16px;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_section_inner {
    padding: 0 20px;
  }
}

.fair_trade_section_title {
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.fair_trade_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .fair_trade_section_title {
    position: static;
    top: auto;
    width: auto;
  }
}

.fair_trade_message {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding-bottom: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_message {
    padding-top: 128px;
    padding-bottom: 140px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_message {
    padding-bottom: 128px;
  }
}

.fair_trade_message_card {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  outline: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_card {
    width: 100%;
    border-radius: 12px;
    padding: 32px 40px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_message_card {
    padding: 28px 20px;
  }
}

.fair_trade_message_greeting {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_greeting {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_message_greeting {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_message_greeting {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_message_lead {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_lead {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_message_lead {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_message_lead {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_message_body {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_body {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_message_body {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.fair_trade_message_detail {
  background: #F3F3F3;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_detail {
    border-radius: 6px;
    padding: 20px;
    gap: 16px;
  }
}

.fair_trade_message_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item {
    gap: 8px;
  }
}

.fair_trade_message_item_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item_title {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_message_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_message_item_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item_list {
    gap: 4px;
  }
}
.fair_trade_message_item_list li {
  position: relative;
  padding-left: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item_list li {
    font-size: 16px;
  }
}
.fair_trade_message_item_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item_list li {
    padding-left: 12px;
  }
}
.fair_trade_message_item_list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #818286;
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_item_list li::before {
    width: 4px;
    height: 4px;
  }
}

.fair_trade_message_sign {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_message_sign {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_message_sign {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: right;
}

.fair_trade_cp {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding-bottom: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp {
    padding-bottom: 140px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp {
    padding-bottom: 128px;
  }
}

.fair_trade_cp_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_content {
    width: 100%;
  }
}

.fair_trade_cp_def {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_def {
    gap: 10px;
  }
}

.fair_trade_cp_def_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_def_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp_def_title {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_cp_def_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_cp_def_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_def_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_cp_def_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.fair_trade_cp_goal {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  min-height: max(167px * var(--base-ratio), 167 / var(--base-size) * var(--base-percent));
  background: #025997;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  text-align: center;
  padding: 0 max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_goal {
    margin-top: 32px;
    min-height: 133px;
    border-radius: 4px;
    gap: 6px;
    padding: 20px 32px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp_goal {
    min-height: 164px;
    padding: 20px 8px;
  }
}

.fair_trade_cp_goal_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_goal_label {
    font-size: 16px;
  }
}
.fair_trade_cp_goal_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_cp_goal_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_goal_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp_goal_title {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_cp_goal_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_cp_purpose {
  list-style: none;
  padding: 0;
  margin: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) 0 0;
  display: flex;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_purpose {
    margin-top: 16px;
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp_purpose {
    flex-direction: column;
  }
}

.fair_trade_cp_purpose_item {
  flex: 1;
  min-height: max(252px * var(--base-ratio), 252 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_purpose_item {
    min-height: 220px;
    border-radius: 4px;
    gap: 12px;
    padding: 32px 16px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cp_purpose_item {
    min-height: 0;
    height: auto;
    padding: 28px 20px;
  }
}

.fair_trade_cp_purpose_tag {
  min-height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  padding: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_purpose_tag {
    font-size: 14px;
  }
}
.fair_trade_cp_purpose_tag {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_cp_purpose_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cp_purpose_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_cp_purpose_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}

.fair_trade_hero_content {
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_hero_content {
    gap: 26px;
    width: 100%;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_hero_content {
    width: 100%;
    padding: 0 20px;
  }
}
.fair_trade_hero_content .fair_trade_hero_buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_hero_content .fair_trade_hero_buttons {
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_hero_content .fair_trade_hero_buttons {
    flex-direction: column;
    align-items: center;
  }
}
@media (hover: hover) {
  .fair_trade_hero_content .fair_trade_hero_buttons .btn:first-child:hover svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

@media screen and (max-width: 767px) {
  :lang(en) .fair_trade_hero_buttons {
    width: 100%;
  }
  :lang(en) .fair_trade_hero_buttons .btn {
    width: 100%;
    height: auto;
    min-width: 0;
    padding: 14px 32px;
    justify-content: space-between;
    text-align: left;
    white-space: normal;
  }
}

.fair_trade_divider {
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  border: 0;
  border-top: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .fair_trade_divider {
    width: calc(100% - 80px);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_divider {
    width: calc(100% - 40px);
  }
}

.fair_trade_vision {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision {
    padding: 140px 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision {
    padding: 128px 0;
  }
}

.fair_trade_vision_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_content {
    width: 100%;
    gap: 14px;
    margin-top: 24px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_content {
    gap: 7px;
    margin-top: 32px;
  }
}

.fair_trade_vision_box {
  position: relative;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box {
    border-radius: 4px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box {
    border-radius: 2px;
  }
}
.fair_trade_vision_box--primary {
  height: max(197px * var(--base-ratio), 197 / var(--base-size) * var(--base-percent));
  border-radius: 0;
  justify-content: flex-end;
  padding-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box--primary {
    height: 133px;
    padding-bottom: 16px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box--primary {
    height: 65px;
    padding-bottom: 8px;
  }
}
.fair_trade_vision_box_shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
}
.fair_trade_vision_box--accent {
  min-height: max(167px * var(--base-ratio), 167 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
  justify-content: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box--accent {
    min-height: 113px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box--accent {
    min-height: 55px;
  }
}

.fair_trade_vision_box_label {
  position: relative;
  z-index: 1;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box_label {
    font-size: 16px;
  }
}
.fair_trade_vision_box_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box_label {
    font-size: 12.15px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box_label {
    font-size: 5.92px;
  }
}

.fair_trade_vision_box_title {
  position: relative;
  z-index: 1;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box_title {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_vision_box_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_box_title {
    font-size: 21.6px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_box_title {
    font-size: 10.52px;
  }
}

:lang(en) .fair_trade_vision_box_title {
  top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  :lang(en) .fair_trade_vision_box_title {
    top: 10px;
  }
}
@media screen and (max-width: 767px) {
  :lang(en) .fair_trade_vision_box_title {
    top: 8px;
  }
}

:lang(en) .fair_trade_vision_box--accent {
  padding-bottom: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  padding-left: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding-right: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  :lang(en) .fair_trade_vision_box--accent {
    padding-bottom: 15px;
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media screen and (max-width: 767px) {
  :lang(en) .fair_trade_vision_box--accent {
    padding-bottom: 12px;
    padding-left: 24px;
    padding-right: 24px;
  }
}

:lang(en) .fair_trade_vision_box--accent .fair_trade_vision_box_label {
  top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  :lang(en) .fair_trade_vision_box--accent .fair_trade_vision_box_label {
    top: 10px;
  }
}
@media screen and (max-width: 767px) {
  :lang(en) .fair_trade_vision_box--accent .fair_trade_vision_box_label {
    top: 8px;
  }
}

@property --fair-trade-vision-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}
.fair_trade_vision_strategy {
  position: relative;
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: 3px solid transparent;
  border-radius: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  background: linear-gradient(#FFFFFF, #FFFFFF) padding-box, conic-gradient(from var(--fair-trade-vision-angle) at 50% 50%, #D1D2D4 0deg, #D1D2D4 36deg, #00A3F1 72deg, #025997 108deg, #00A3F1 144deg, #D1D2D4 180deg, #D1D2D4 216deg, #00A3F1 252deg, #025997 288deg, #00A3F1 324deg, #D1D2D4 360deg) border-box;
  animation: fair_trade_vision_gradient_rotate 6s linear infinite;
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy {
    margin-top: 14px;
    border-width: 2px;
    border-radius: 4px;
    padding: 40px 32px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy {
    margin-top: 7px;
    border-width: 1px;
    border-radius: 2px;
    padding: 20px 16px;
  }
}

@keyframes fair_trade_vision_gradient_rotate {
  to {
    --fair-trade-vision-angle: 360deg;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fair_trade_vision_strategy {
    animation: none;
  }
}
.fair_trade_vision_strategy_badge {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: 0 max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_badge {
    font-size: 16px;
  }
}
.fair_trade_vision_strategy_badge {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_badge {
    font-size: 12.15px;
    gap: 5px;
    padding: 0 5px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_badge {
    font-size: 5.92px;
    gap: 3px;
    padding: 0 3px;
  }
}
.fair_trade_vision_strategy_badge--top {
  top: 0;
}
.fair_trade_vision_strategy_badge--bottom {
  top: 100%;
}

.fair_trade_vision_strategy_badge_arrow {
  width: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_badge_arrow {
    width: 20px;
    height: 8px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_badge_arrow {
    width: 10px;
    height: 4px;
  }
}

.fair_trade_vision_strategy_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_list {
    gap: 14px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_list {
    gap: 7px;
  }
}

.fair_trade_vision_strategy_item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_item {
    gap: 14px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_item {
    gap: 7px;
  }
}

.fair_trade_vision_strategy_ico {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_ico {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_ico {
    width: 20px;
    height: 20px;
  }
}

.fair_trade_vision_strategy_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_label {
    font-size: 16px;
  }
}
.fair_trade_vision_strategy_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_label {
    font-size: 12.15px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_label {
    font-size: 5.92px;
  }
}

.fair_trade_vision_strategy_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_title {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_vision_strategy_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_vision_strategy_title {
    font-size: 16.2px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_vision_strategy_title {
    font-size: 7.89px;
  }
}

.fair_trade_process {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding-top: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  padding-bottom: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process {
    padding-top: 140px;
    padding-bottom: 140px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process {
    padding-top: 128px;
    padding-bottom: 128px;
  }
}

.fair_trade_process_content {
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_content {
    width: 100%;
  }
}

.fair_trade_process_diagram {
  position: relative;
  height: max(262px * var(--base-ratio), 262 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border: 1px solid #ABDDFA;
  border-bottom: 0;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) 0 0;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_diagram {
    height: 316px;
    border-radius: 16px 16px 0 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_diagram {
    height: 604px;
  }
}

.fair_trade_process_diagram_inner {
  position: relative;
  height: 100%;
}
@media screen and (max-width: 767px) {
  .fair_trade_process_diagram_inner {
    width: 311px;
    margin: 0 auto;
  }
}

.fair_trade_process_pill {
  position: absolute;
  width: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  height: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_process_pill {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill {
    width: 260px;
    height: 60px;
  }
}
.fair_trade_process_pill--start {
  top: max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent));
  left: max(57px * var(--base-ratio), 57 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 1px solid #025997;
  color: #025997;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--start {
    top: 32px;
    left: 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--start {
    top: 32px;
    left: 20px;
  }
}
.fair_trade_process_pill--step02 {
  top: max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent));
  left: max(369px * var(--base-ratio), 369 / var(--base-size) * var(--base-percent));
  background: #ABDDFA;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--step02 {
    top: 32px;
    left: 388px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--step02 {
    top: 128px;
    left: 20px;
  }
}
.fair_trade_process_pill--step03 {
  top: max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent));
  left: max(681px * var(--base-ratio), 681 / var(--base-size) * var(--base-percent));
  background: #7BCDF5;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--step03 {
    top: 128px;
    left: 388px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--step03 {
    top: 224px;
    left: 20px;
  }
}
.fair_trade_process_pill--step04 {
  top: max(147px * var(--base-ratio), 147 / var(--base-size) * var(--base-percent));
  left: max(681px * var(--base-ratio), 681 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--step04 {
    top: 224px;
    left: 388px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--step04 {
    top: 320px;
    left: 20px;
  }
}
.fair_trade_process_pill--step05 {
  top: max(147px * var(--base-ratio), 147 / var(--base-size) * var(--base-percent));
  left: max(369px * var(--base-ratio), 369 / var(--base-size) * var(--base-percent));
  background: #017EC4;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--step05 {
    top: 224px;
    left: 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--step05 {
    top: 512px;
    left: 20px;
  }
}
.fair_trade_process_pill--step06 {
  top: max(147px * var(--base-ratio), 147 / var(--base-size) * var(--base-percent));
  left: max(57px * var(--base-ratio), 57 / var(--base-size) * var(--base-percent));
  background: #025997;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_pill--step06 {
    top: 128px;
    left: 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_pill--step06 {
    top: 416px;
    left: 20px;
  }
}

.fair_trade_process_arrow {
  position: absolute;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow {
    width: 20px;
    height: 20px;
  }
}
.fair_trade_process_arrow--r1 {
  top: max(67px * var(--base-ratio), 67 / var(--base-size) * var(--base-percent));
  left: max(341px * var(--base-ratio), 341 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--r1 {
    top: 52px;
    left: 334px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--r1 {
    top: 100px;
    left: 140px;
    transform: rotate(90deg);
  }
}
.fair_trade_process_arrow--r2 {
  top: max(67px * var(--base-ratio), 67 / var(--base-size) * var(--base-percent));
  left: max(653px * var(--base-ratio), 653 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--r2 {
    top: 100px;
    left: 508px;
    transform: rotate(90deg);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--r2 {
    top: 196px;
    left: 140px;
    transform: rotate(90deg);
  }
}
.fair_trade_process_arrow--down {
  top: max(119px * var(--base-ratio), 119 / var(--base-size) * var(--base-percent));
  left: max(809px * var(--base-ratio), 809 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--down {
    top: 196px;
    left: 508px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--down {
    top: 292px;
    left: 140px;
  }
}
.fair_trade_process_arrow--l1 {
  top: max(171px * var(--base-ratio), 171 / var(--base-size) * var(--base-percent));
  left: max(653px * var(--base-ratio), 653 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--l1 {
    top: 244px;
    left: 334px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--l1 {
    top: 388px;
    left: 140px;
    transform: rotate(-90deg);
  }
}
.fair_trade_process_arrow--l2 {
  top: max(171px * var(--base-ratio), 171 / var(--base-size) * var(--base-percent));
  left: max(341px * var(--base-ratio), 341 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--l2 {
    top: 196px;
    left: 160px;
    transform: rotate(-90deg);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--l2 {
    top: 484px;
    left: 140px;
    transform: rotate(-90deg);
  }
}
.fair_trade_process_arrow--up {
  top: max(119px * var(--base-ratio), 119 / var(--base-size) * var(--base-percent));
  left: max(185px * var(--base-ratio), 185 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_arrow--up {
    top: 100px;
    left: 160px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--up {
    display: none;
  }
}
.fair_trade_process_arrow--return {
  display: none;
}
@media screen and (max-width: 767px) {
  .fair_trade_process_arrow--return {
    display: block;
    width: 27px;
    height: 502px;
    top: 52px;
    left: 284px;
  }
}

.fair_trade_process_list {
  list-style: none;
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  margin: 0;
  background: #FFFFFF;
  border: 1px solid #D1D2D4;
  border-top: 0;
  border-radius: 0 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_list {
    padding: 32px 40px;
    border-radius: 0 0 12px 12px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_list {
    padding: 28px 20px;
  }
}

.fair_trade_process_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_item {
    gap: 6px;
    padding-bottom: 24px;
  }
}
.fair_trade_process_item--last {
  padding-bottom: 0;
  border-bottom: 0;
}

.fair_trade_process_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_process_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.fair_trade_process_item_title br {
  display: none;
}

.fair_trade_process_bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.fair_trade_process_bullets--grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent)) max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  html[lang=en] .fair_trade_process_bullets--grid {
    grid-template-columns: repeat(2, 1fr);
    gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_bullets--grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_process_bullets--grid {
    grid-template-columns: 1fr;
  }
}
.fair_trade_process_bullets li {
  position: relative;
  padding-left: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_bullets li {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_process_bullets li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_bullets li {
    padding-left: 12px;
  }
}
.fair_trade_process_bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #818286;
}
@media screen and (max-width: 1024px) {
  .fair_trade_process_bullets li::before {
    width: 4px;
    height: 4px;
  }
}

.fair_trade_system {
  position: relative;
  z-index: 1;
  background: #E8F3FE;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_system {
    padding: 140px 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system {
    padding: 128px 0;
  }
}

.fair_trade_system_inner {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent)) max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  column-gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  align-items: start;
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_inner {
    padding: 0 40px;
    grid-template-columns: 1fr;
    column-gap: 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_inner {
    padding: 0 20px;
  }
}

.fair_trade_system_title {
  grid-column: 1;
  grid-row: 1/-1;
  align-self: start;
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_title {
    font-size: var(--fs-h3-mob);
  }
}
.fair_trade_system_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_title {
    grid-column: 1;
    grid-row: auto;
    position: static;
    top: auto;
  }
}

.fair_trade_system_diagram {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  width: max(680px * var(--base-ratio), 680 / var(--base-size) * var(--base-percent));
  height: max(680px * var(--base-ratio), 680 / var(--base-size) * var(--base-percent));
}
.fair_trade_system_diagram img {
  width: 100%;
  height: 100%;
  display: block;
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_diagram {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_diagram {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
  }
}

.fair_trade_system_desc {
  grid-column: 2;
  grid-row: 2;
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_desc {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_system_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_desc {
    grid-column: 1;
    grid-row: auto;
    margin-top: 48px;
  }
}

.fair_trade_system_list {
  grid-column: 2;
  grid-row: 3;
  list-style: none;
  padding: 0;
  margin: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) 0 0;
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_list {
    grid-column: 1;
    grid-row: auto;
    margin-top: 32px;
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_list {
    flex-direction: column;
  }
}

.fair_trade_system_card {
  flex: 1;
  background: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_card {
    padding: 24px 4px 45px 4px;
  }
}

.fair_trade_system_card_tag {
  height: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent));
  padding: 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  border-radius: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_card_tag {
    font-size: 14px;
  }
}
.fair_trade_system_card_tag {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.fair_trade_system_card_tag--prevention {
  background: #7BCDF5;
}
.fair_trade_system_card_tag--response {
  background: #3BB7F3;
}
.fair_trade_system_card_tag--detection {
  background: #00A3F1;
}

.fair_trade_system_card_body {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  align-items: center;
}

.fair_trade_system_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_system_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_system_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
html[lang=en] .fair_trade_system_card_title {
  min-height: 2.6em;
}
@media screen and (max-width: 767px) {
  html[lang=en] .fair_trade_system_card_title {
    min-height: 0;
  }
}

.fair_trade_system_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_system_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_system_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}

.fair_trade_elements {
  position: relative;
  z-index: 1;
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) 0 max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  background: #D9D9D9;
  overflow: clip;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements {
    padding: 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements {
    padding: 0;
  }
}

.fair_trade_elements_bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #D9D9D9;
}
.fair_trade_elements_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_bg {
    position: sticky;
    inset: auto;
    top: 0;
    height: 100vh;
    margin-bottom: -100vh;
    background-image: url("/images/esg/fair_trade_elements_bg_tb.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
  .fair_trade_elements_bg img {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_bg {
    background-image: url("/images/esg/fair_trade_elements_bg_mo.jpg");
  }
}

.fair_trade_elements_inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent)) 1fr;
  column-gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_inner {
    grid-template-columns: 1fr;
    column-gap: 0;
    padding: 140px 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_inner {
    padding: 128px 20px;
  }
}

.fair_trade_elements_title {
  grid-column: 1;
  grid-row: 1/-1;
  align-self: start;
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_title {
    font-size: var(--fs-h3-mob);
  }
}
.fair_trade_elements_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_title {
    grid-column: 1;
    grid-row: auto;
    position: static;
    top: auto;
  }
}

.fair_trade_elements_intro {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_intro {
    grid-column: 1;
    gap: 10px;
    margin-top: 16px;
  }
}

.fair_trade_elements_intro_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_intro_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_intro_title {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_elements_intro_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_elements_intro_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_intro_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_elements_intro_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_elements_cards {
  grid-column: 2;
  list-style: none;
  padding: 0;
  margin: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) 0 0;
  display: grid;
  grid-template-columns: repeat(2, max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent)));
  grid-template-rows: repeat(4, max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent)));
  column-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  row-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.fair_trade_elements_cards > li {
  align-self: start;
}
.fair_trade_elements_cards > li:nth-child(even) {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  .fair_trade_elements_cards {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_cards {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_cards {
    grid-column: 1;
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
    grid-template-rows: none;
    column-gap: 0;
    row-gap: 20px;
  }
  .fair_trade_elements_cards > li:nth-child(even) {
    margin-top: 0;
  }
}

.fair_trade_elements_cards_tablet {
  display: none;
}
@media screen and (min-width: 1025px) {
  .fair_trade_elements_cards_tablet {
    grid-column: 2;
    margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
    display: flex;
    gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_cards_tablet {
    grid-column: 1;
    margin-top: 32px;
    display: flex;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_cards_tablet {
    display: none;
  }
}

.fair_trade_elements_cards_col {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 1;
}
.fair_trade_elements_cards_col:nth-child(2) {
  margin-top: 40px;
}
@media screen and (min-width: 1025px) {
  .fair_trade_elements_cards_col {
    gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  }
  .fair_trade_elements_cards_col:nth-child(2) {
    margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  }
  .fair_trade_elements_cards_col .fair_trade_elements_card {
    width: 100%;
  }
}

.fair_trade_elements_card {
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  min-height: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.21);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_card {
    width: 100%;
    min-height: 292px;
    border-radius: 8px;
    padding: 32px 24px 24px;
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_card {
    width: 100%;
    min-height: auto;
  }
}

.fair_trade_elements_card_txt {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.fair_trade_elements_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_elements_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.fair_trade_elements_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_elements_card_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_card_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_elements_card_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_elements_card_num {
  display: block;
  text-align: right;
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .fair_trade_elements_card_num {
    font-size: 16px;
  }
}

.fair_trade_org {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .fair_trade_org {
    padding: 140px 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_org {
    padding: 128px 0;
  }
}

.fair_trade_cp .fair_trade_section_title,
.fair_trade_vision .fair_trade_section_title,
.fair_trade_org .fair_trade_section_title {
  position: static;
}

.fair_trade_org_chart {
  position: relative;
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding-bottom: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_chart {
    width: 100%;
    background: #E8F3FE;
    border-radius: 11px;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
  }
  .fair_trade_org_chart > .fair_trade_org_head,
  .fair_trade_org_chart > .fair_trade_org_tree {
    display: none;
  }
  .fair_trade_org_chart::after {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_org_chart {
    border-radius: 5px;
  }
}
.fair_trade_org_chart::after {
  content: "";
  position: absolute;
  top: max(124px * var(--base-ratio), 124 / var(--base-size) * var(--base-percent));
  left: max(511px * var(--base-ratio), 511 / var(--base-size) * var(--base-percent));
  width: 1px;
  height: max(96px * var(--base-ratio), 96 / var(--base-size) * var(--base-percent));
  background: #BCBDC1;
}

.fair_trade_org_chart_image {
  display: none;
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_chart_image {
    display: block;
    width: 100%;
    height: auto;
  }
}

.fair_trade_org_chart_expand {
  display: none;
}
@media screen and (max-width: 767px) {
  .fair_trade_org_chart_expand {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(188, 189, 193, 0.4);
    border: 1px solid rgba(188, 189, 193, 0.4);
    backdrop-filter: blur(28px);
  }
}

.fair_trade_org_head {
  position: relative;
  height: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
}

.fair_trade_org_ceo {
  position: absolute;
  top: 0;
  left: max(410px * var(--base-ratio), 410 / var(--base-size) * var(--base-percent));
  width: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  height: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  background: #025997;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_ceo {
    font-size: 16px;
  }
}
.fair_trade_org_ceo {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_org_board {
  position: absolute;
  top: max(76px * var(--base-ratio), 76 / var(--base-size) * var(--base-percent));
  left: max(640px * var(--base-ratio), 640 / var(--base-size) * var(--base-percent));
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 1px solid #025997;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_board {
    font-size: 16px;
  }
}
.fair_trade_org_board {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}

.fair_trade_org_connector {
  position: absolute;
  top: max(64px * var(--base-ratio), 64 / var(--base-size) * var(--base-percent));
  left: max(511px * var(--base-ratio), 511 / var(--base-size) * var(--base-percent));
  width: max(129px * var(--base-ratio), 129 / var(--base-size) * var(--base-percent));
  height: max(44px * var(--base-ratio), 44 / var(--base-size) * var(--base-percent));
  pointer-events: none;
}
.fair_trade_org_connector::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: #BCBDC1;
}

.fair_trade_org_tree {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent)));
  column-gap: max(46px * var(--base-ratio), 46 / var(--base-size) * var(--base-percent));
  margin-top: max(52px * var(--base-ratio), 52 / var(--base-size) * var(--base-percent));
  padding: 0 max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.fair_trade_org_tree::before {
  content: "";
  position: absolute;
  top: calc(max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) * -1);
  left: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
  right: max(141px * var(--base-ratio), 141 / var(--base-size) * var(--base-percent));
  height: 1px;
  background: #BCBDC1;
}

.fair_trade_org_branch {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.fair_trade_org_branch::before {
  content: "";
  position: absolute;
  top: calc(max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) * -1);
  left: 50%;
  width: 1px;
  height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  background: #BCBDC1;
}

.fair_trade_org_role {
  width: 100%;
  min-height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: max(12.5px * var(--base-ratio), 12.5 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_role {
    font-size: 14px;
  }
}
.fair_trade_org_role {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

:lang(en) .fair_trade_org_role {
  height: 88px;
}

.fair_trade_org_tasks {
  list-style: none;
  padding: 0;
  margin: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent)) 0 0;
  display: flex;
  flex-direction: column;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.fair_trade_org_tasks li {
  background: #FFFFFF;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  min-height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_org_tasks li {
    font-size: 14px;
  }
}
.fair_trade_org_tasks li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.fair_trade_status {
  position: relative;
  z-index: 1;
  background: #E8F3FE;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_status {
    padding: 140px 0;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_status {
    padding: 128px 0;
  }
}

.fair_trade_status_inner {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent)) 1fr;
  column-gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  align-items: start;
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_inner {
    grid-template-columns: 1fr;
    column-gap: 0;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_status_inner {
    padding: 0 20px;
  }
}

.fair_trade_status_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_status_title {
    font-size: var(--fs-h3-mob);
  }
}
.fair_trade_status_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_status_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_list {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_status_list {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.fair_trade_status_card {
  background: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_card {
    border-radius: 10px;
    padding: 16px 20px;
    height: 128px;
  }
  html[lang=en] .fair_trade_status_card {
    height: 148px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .fair_trade_status_card {
    height: auto;
    min-height: 128px;
  }
}

.fair_trade_status_year {
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent));
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_year {
    font-size: 16px;
  }
}

.fair_trade_status_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_status_desc {
    font-size: var(--fs-p1-tab);
  }
}
.fair_trade_status_desc {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}

.fair_trade_cta {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cta {
    padding: 64px 0 160px;
  }
}

.fair_trade_cta_inner {
  width: max(1464px * var(--base-ratio), 1464 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
  height: max(204px * var(--base-ratio), 204 / var(--base-size) * var(--base-percent));
  background: #003264;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cta_inner {
    width: calc(100% - 80px);
    min-height: 142px;
    height: auto;
    border-radius: 12px;
    padding: 40px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cta_inner {
    flex-direction: column;
    width: calc(100% - 40px);
    min-height: 207px;
    height: auto;
    padding: 24px;
  }
}

.fair_trade_cta_text {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .fair_trade_cta_text {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cta_text {
    font-size: var(--fs-h4-mob);
  }
}
.fair_trade_cta_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fair_trade_cta_btn.btn.btn_small {
  flex-shrink: 0;
  min-width: max(216px * var(--base-ratio), 216 / var(--base-size) * var(--base-percent));
  margin-top: max(38px * var(--base-ratio), 38 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .fair_trade_cta_btn.btn.btn_small {
    min-width: 196px;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .fair_trade_cta_btn.btn.btn_small {
    margin-top: 24px;
  }
}
@media (hover: hover) {
  .fair_trade_cta_btn.btn.btn_small:hover svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

.esg_mgmt {
  position: relative;
  background: #002B53;
}

.page_esg_mgmt .header_spacer {
  display: none !important;
}
.page_esg_mgmt #header.is_white:not(.is_fixed) {
  position: absolute;
  visibility: hidden;
}
.page_esg_mgmt #esgMgmtHeader {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

.page_esg_mgmt.esg_mgmt_hero_active #header {
  transform: translateY(-100%) !important;
  pointer-events: none;
}

.esg_mgmt_hero {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_hero {
    height: 133.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_hero {
    height: 216.5333333333vw;
  }
}
.esg_mgmt_hero .esg_mgmt_hero_bg {
  position: absolute;
  inset: 0;
}
.esg_mgmt_hero .esg_mgmt_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.esg_mgmt_hero .esg_mgmt_hero_content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_hero .esg_mgmt_hero_content {
    gap: 1.5625vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_hero .esg_mgmt_hero_content {
    gap: 3.2vw;
  }
}
.esg_mgmt_hero .esg_mgmt_hero_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_hero .esg_mgmt_hero_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_hero .esg_mgmt_hero_label {
    font-size: var(--fs-h5-mob);
  }
}
.esg_mgmt_hero .esg_mgmt_hero_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.esg_mgmt_hero .esg_mgmt_hero_title {
  font-size: round(down, max(var(--fs-d2-pc) * 1px * var(--base-ratio), var(--fs-d2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_hero .esg_mgmt_hero_title {
    font-size: var(--fs-d2-tab);
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_hero .esg_mgmt_hero_title {
    font-size: var(--fs-d2-mob);
  }
}
.esg_mgmt_hero .esg_mgmt_hero_title {
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  text-align: center;
}

.esg_mgmt_green_intro {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  background: linear-gradient(180deg, #012B53 0%, #012C54 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro {
    height: 88.8020833333vw;
    align-items: flex-start;
    padding-top: 26.0416666667vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro {
    height: 216.5333333333vw;
    align-items: flex-start;
    padding-top: 26.6666666667vw;
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(74px * var(--base-ratio), 74 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_inner {
    gap: 7.8125vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_inner {
    gap: 16vw;
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  width: max(1000px * var(--base-ratio), 1000 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_txt {
    gap: 3.3854166667vw;
    width: 100%;
    padding: 0 5.2083333333vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_txt {
    gap: 6.9333333333vw;
    width: 100%;
    padding: 0 4.5333333333vw;
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_title {
    font-size: var(--fs-h2-mob);
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_title em {
  color: #00A3F1;
  font-style: normal;
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_intro_desc {
    font-size: var(--fs-p1-tab);
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_intro_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.esg_mgmt_green_intro .esg_mgmt_green_circles {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circles {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    position: static;
    width: auto;
    height: auto;
    gap: 3.125vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circles {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: static;
    width: 2em;
    height: auto;
    margin: 0 auto;
    gap: 3.2vw;
  }
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circles.is_animated .esg_mgmt_green_circle b {
    display: inline;
    width: auto;
    height: auto;
    overflow: visible;
  }
  .esg_mgmt_green_intro .esg_mgmt_green_circles.is_animated .esg_mgmt_green_circle b::before {
    content: " ";
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circles.is_animated {
    width: auto;
    margin: 0;
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: max(272px * var(--base-ratio), 272 / var(--base-size) * var(--base-percent));
  height: max(272px * var(--base-ratio), 272 / var(--base-size) * var(--base-percent));
  margin-left: max(-20px * var(--base-ratio), -20 / var(--base-size) * var(--base-percent));
  border: 1px solid #d1d2d4;
  border-radius: 50%;
}
.esg_mgmt_green_intro .esg_mgmt_green_circle:first-child {
  margin-left: 0;
}
.esg_mgmt_green_intro .esg_mgmt_green_circle span {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circle span {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circle span {
    font-size: var(--fs-h4-mob);
  }
}
.esg_mgmt_green_intro .esg_mgmt_green_circle span {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.esg_mgmt_green_intro .esg_mgmt_green_circle em {
  font-weight: 600;
  color: #3BB7F3;
  font-style: normal;
}
.esg_mgmt_green_intro .esg_mgmt_green_circle i {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  font-style: normal;
  vertical-align: top;
}
.esg_mgmt_green_intro .esg_mgmt_green_circle b {
  display: block;
  overflow: hidden;
  font-weight: inherit;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circle b {
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: baseline;
  }
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circle {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    border: none;
    border-radius: 0;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_green_intro .esg_mgmt_green_circle {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    border: none;
    border-radius: 0;
    text-align: center;
  }
}

.esg_mgmt_strategy_floor_bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}

.esg_mgmt_strategy {
  position: relative;
  width: 100%;
  height: max(1080px * var(--base-ratio), 1080 / var(--base-size) * var(--base-percent));
  min-height: 100vh;
  margin-bottom: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  --strategy-word-gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.esg_mgmt_strategy.is_governance {
  margin-bottom: 0;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy {
    height: 133.3333333333vw;
    --strategy-word-gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy {
    height: 216.5333333333vw;
    --strategy-word-gap: 10px;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.esg_mgmt_strategy .esg_mgmt_strategy_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.esg_mgmt_strategy .esg_mgmt_strategy_word {
  position: absolute;
  z-index: 1;
  font-family: "Bai Jamjuree", sans-serif;
  font-size: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  opacity: 0.2;
  pointer-events: none;
  white-space: nowrap;
}
.esg_mgmt_strategy .esg_mgmt_strategy_word.is_top {
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  left: max(377px * var(--base-ratio), 377 / var(--base-size) * var(--base-percent));
}
.esg_mgmt_strategy .esg_mgmt_strategy_word.is_bottom {
  right: max(377px * var(--base-ratio), 377 / var(--base-size) * var(--base-percent));
  bottom: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  text-align: right;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_word {
    font-size: 6.25vw;
  }
  .esg_mgmt_strategy .esg_mgmt_strategy_word.is_top {
    top: 29.4270833333vw;
    left: 5.2083333333vw;
  }
  .esg_mgmt_strategy .esg_mgmt_strategy_word.is_bottom {
    right: 5.2083333333vw;
    bottom: 29.4270833333vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_word {
    font-size: 12.8vw;
  }
  .esg_mgmt_strategy .esg_mgmt_strategy_word.is_top {
    top: 16vw;
    left: 5.3333333333vw;
  }
  .esg_mgmt_strategy .esg_mgmt_strategy_word.is_bottom {
    right: 5.3333333333vw;
    bottom: 19.7333333333vw;
  }
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy.is_green .esg_mgmt_strategy_word.is_top {
    top: 27.734375vw;
  }
  .esg_mgmt_strategy.is_green .esg_mgmt_strategy_word.is_bottom {
    bottom: 27.6041666667vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_green .esg_mgmt_strategy_word.is_top {
    top: 21.3333333333vw;
  }
  .esg_mgmt_strategy.is_green .esg_mgmt_strategy_word.is_bottom {
    bottom: 34.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_governance .esg_mgmt_strategy_word.is_top {
    top: 10.6666666667vw;
  }
  .esg_mgmt_strategy.is_governance .esg_mgmt_strategy_word.is_bottom {
    bottom: 11.2vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_card {
  position: relative;
  z-index: 2;
  width: max(1166px * var(--base-ratio), 1166 / var(--base-size) * var(--base-percent));
  padding: max(58px * var(--base-ratio), 58 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.21);
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_card {
    width: 89.5833333333vw;
    padding: 7.8125vw 5.2083333333vw;
    border-radius: 1.3020833333vw;
    gap: 1.5625vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_card {
    position: absolute;
    top: 39.4666666667vw;
    left: 5.3333333333vw;
    width: 89.3333333333vw;
    min-height: 124.2666666667vw;
    padding: 10.6666666667vw 4.5333333333vw;
    border-radius: 2.6666666667vw;
    gap: 0;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_responsible .esg_mgmt_strategy_card {
    top: 34.1333333333vw;
    min-height: 145.6vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_employee .esg_mgmt_strategy_card {
    padding-bottom: 9.6vw;
    min-height: 137.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_ethics .esg_mgmt_strategy_card {
    top: 38.9333333333vw;
    min-height: 138.4vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy.is_governance .esg_mgmt_strategy_card {
    top: 41.6vw;
    min-height: 145.6vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_word_first {
    display: inline-block;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_word_rest {
  --wipe: 0;
  -webkit-text-stroke-width: calc((100 - var(--wipe)) * 0.01px);
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.3);
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(to right, #ffffff, #ffffff);
  background-repeat: no-repeat;
  background-size: calc(var(--wipe) * 1%) 100%;
  -webkit-background-clip: text;
  background-clip: text;
}
.esg_mgmt_strategy .esg_mgmt_strategy_label {
  font-size: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_label {
    font-size: 3.125vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_label {
    font-size: 6.4vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_desc {
    font-size: var(--fs-p1-tab);
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_desc {
    margin-top: 3.2vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_items {
  list-style: none;
  margin: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) 0 0;
  padding: 0;
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_items {
    margin-top: 2.6041666667vw;
    gap: 1.3020833333vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_items {
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 7.4666666667vw;
    gap: 2.1333333333vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_item {
  width: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  height: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background: rgba(255, 255, 255, 0.21);
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_item {
    width: 23.4375vw;
    height: 20.8333333333vw;
    padding: 2.6041666667vw;
    border-radius: 0.78125vw;
    gap: 1.5625vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_item {
    width: 35.2vw;
    height: 33.6vw;
    padding: 3.2vw 0;
    border-radius: 1.6vw;
    gap: 2.1333333333vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_item_ico {
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_item_ico {
    width: 7.8125vw;
    height: 7.8125vw;
  }
}
@media screen and (max-width: 767px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_item_ico {
    width: 13.8666666667vw;
    height: 13.8666666667vw;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_item_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_strategy .esg_mgmt_strategy_item_label {
    font-size: 16px;
  }
}
.esg_mgmt_strategy .esg_mgmt_strategy_item_label {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}

@media screen and (min-width: 1025px) {
  html[lang=en] .esg_mgmt_strategy_item {
    padding-left: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
    padding-right: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  }
  html[lang=en] .esg_mgmt_strategy_item_label {
    font-size: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
    min-height: 3.9em;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .esg_mgmt_strategy_card {
    padding: 10.6666666667vw 5.3333333333vw 5.3333333333vw;
    min-height: 140vw;
  }
  html[lang=en] .esg_mgmt_strategy.is_responsible .esg_mgmt_strategy_card {
    top: 39.4666666667vw;
    min-height: 136.8vw;
  }
  html[lang=en] .esg_mgmt_strategy.is_employee .esg_mgmt_strategy_card {
    min-height: 136.8vw;
  }
  html[lang=en] .esg_mgmt_strategy.is_ethics .esg_mgmt_strategy_card {
    top: 39.4666666667vw;
    min-height: 130.4vw;
  }
  html[lang=en] .esg_mgmt_strategy.is_governance .esg_mgmt_strategy_card {
    min-height: 149.6vw;
  }
  html[lang=en] .esg_mgmt_strategy_desc {
    font-size: 4.2666666667vw;
  }
  html[lang=en] .esg_mgmt_strategy_items {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 1.6vw;
    width: 100%;
    margin-top: 8.5333333333vw;
  }
  html[lang=en] .esg_mgmt_strategy_item {
    width: 100%;
    height: auto;
    min-height: 16vw;
    flex-direction: row;
    justify-content: flex-start;
    padding: 3.2vw 5.3333333333vw;
    gap: 3.2vw;
    border-radius: 1.6vw;
  }
  html[lang=en] .esg_mgmt_strategy_item_ico {
    width: 9.6vw;
    height: 9.6vw;
    flex-shrink: 0;
  }
  html[lang=en] .esg_mgmt_strategy_item_label {
    font-size: 3.7333333333vw;
    text-align: left;
  }
}
.esg_mgmt_data_btn {
  position: fixed;
  right: max(96px * var(--base-ratio), 96 / var(--base-size) * var(--base-percent));
  bottom: max(38px * var(--base-ratio), 38 / var(--base-size) * var(--base-percent));
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  padding: 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.21);
  border: 1px solid rgba(209, 210, 212, 0.2);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  text-decoration: none;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_data_btn {
    right: 74px;
    bottom: 36px;
    height: 40px;
    padding: 0 16px;
    gap: 4px;
  }
}
.esg_mgmt_data_btn .esg_mgmt_data_btn_label {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_data_btn .esg_mgmt_data_btn_label {
    font-size: 14px;
  }
}
.esg_mgmt_data_btn .esg_mgmt_data_btn_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.esg_mgmt_data_btn .esg_mgmt_data_btn_ico {
  width: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  height: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.esg_mgmt_data_btn .esg_mgmt_data_btn_ico img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
.esg_mgmt_data_btn .esg_mgmt_data_btn_ico::after {
  content: "";
  position: absolute;
  top: 200%;
  left: -100%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url("/images/esg/management/ico_outlink.svg") no-repeat center/contain;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
@media screen and (max-width: 1024px) {
  .esg_mgmt_data_btn .esg_mgmt_data_btn_ico {
    width: 12px;
    height: 12px;
  }
}
@media (hover: hover) {
  .esg_mgmt_data_btn:hover .esg_mgmt_data_btn_ico img {
    top: -100%;
    left: 200%;
  }
  .esg_mgmt_data_btn:hover .esg_mgmt_data_btn_ico::after {
    top: 50%;
    left: 50%;
  }
}

.page_recruit .talent {
  position: relative;
}
.page_recruit .talent_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_recruit .talent_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.page_recruit .talent_hero .talent_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.page_recruit .talent_hero .talent_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_hero .talent_hero_bg {
    width: 90%;
  }
}
.page_recruit .talent_hero .talent_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_hero .talent_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_hero .talent_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_hero .talent_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.page_recruit .talent_hero .talent_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.page_recruit .talent_hero .talent_hero_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_hero .talent_hero_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .talent_hero .talent_hero_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.page_recruit .talent_value_wrap {
  position: relative;
  z-index: 1;
}
.page_recruit .talent_value_sticky {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.page_recruit .talent_value_head {
  position: relative;
  z-index: 10;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  flex-shrink: 0;
}
.page_recruit .talent_value_text {
  display: none;
  align-items: baseline;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_value_text.is_active {
  display: flex;
}
.page_recruit .talent_value_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_value_title {
    font-size: var(--fs-h3-mob);
  }
}
.page_recruit .talent_value_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.page_recruit .talent_value_desc {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_value_desc {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .talent_value_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .talent_value_bgs {
  position: relative;
  flex: 1;
  overflow: hidden;
}
.page_recruit .talent_value_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.page_recruit .talent_value_bg_01 {
  z-index: 1;
  background-image: url("/images/recruit/talent_action_bg.jpg");
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_bg_01 {
    background-image: url("/images/recruit/talent_action_bg_tb.jpg");
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_value_bg_01 {
    background-image: url("/images/recruit/talent_action_bg_mo.jpg");
  }
}
.page_recruit .talent_value_bg_02 {
  z-index: 2;
  background-image: url("/images/recruit/talent_consideration_bg.jpg");
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_bg_02 {
    background-image: url("/images/recruit/talent_consideration_bg_tb.jpg");
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_value_bg_02 {
    background-image: url("/images/recruit/talent_consideration_bg_mo.jpg");
  }
}
.page_recruit .talent_value_bg_03 {
  z-index: 3;
  background-image: url("/images/recruit/talent_creativity_bg.jpg");
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_bg_03 {
    background-image: url("/images/recruit/talent_creativity_bg_tb.jpg");
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_value_bg_03 {
    background-image: url("/images/recruit/talent_creativity_bg_mo.jpg");
  }
}
.page_recruit .talent_value_slide_head {
  display: none;
}
.page_recruit .hr {
  position: relative;
}
.page_recruit .hr_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_recruit .hr_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.page_recruit .hr_hero .hr_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.page_recruit .hr_hero .hr_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_hero .hr_hero_bg {
    width: 90%;
  }
}
.page_recruit .hr_hero .hr_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page_recruit .hr_hero .hr_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_hero .hr_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_hero .hr_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.page_recruit .hr_hero .hr_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.page_recruit .hr_section {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
}
.page_recruit .hr_section_inner {
  display: flex;
  align-items: flex-start;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_section_title {
  position: sticky;
  top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.page_recruit .hr_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.page_recruit .hr_section_content {
  flex: 1;
}
.page_recruit .hr_section_subtitle {
  display: block;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_section_subtitle {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_section_subtitle {
    font-size: var(--fs-h4-mob);
  }
}
.page_recruit .hr_section_subtitle {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .hr_section_desc {
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_section_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_section_desc {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hr_section_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .hr .hr_system .hr_section_title {
  position: static;
}
.page_recruit .hr_system {
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_bullet_list {
  margin-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_bullet_list li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_bullet_list li {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .hr_bullet_list li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .hr_bullet_list li::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #818286;
  margin-top: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.page_recruit .hr_reward {
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
.page_recruit .hr_reward_diagram {
  position: relative;
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  height: max(262px * var(--base-ratio), 262 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) 0 0;
  display: flex;
  align-items: center;
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_reward_diagram::before {
  content: "";
  position: absolute;
  inset: -1px -1px 0 -1px;
  border: 1px solid #ABDDFA;
  border-bottom: 0;
  border-radius: inherit;
  pointer-events: none;
}
.page_recruit .hr_reward_circle {
  width: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_recruit .hr_reward_circle span {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_reward_circle span {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_reward_circle span {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hr_reward_circle span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.page_recruit .hr_reward_circle_01 {
  background: #025997;
}
.page_recruit .hr_reward_circle_02 {
  background: #00A3F1;
}
.page_recruit .hr_reward_circle_03 {
  background: #3bb7f3;
}
.page_recruit .hr_reward_circle_04 {
  background: #7bcdf5;
}
.page_recruit .hr_reward_plus {
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_recruit .hr_reward_alpha {
  background: #FFFFFF;
  border-radius: 999px;
  padding: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  box-shadow: 0 0 max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) #D1E8FE;
}
.page_recruit .hr_reward_list {
  position: relative;
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  border-radius: 0 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_reward_list::before {
  content: "";
  position: absolute;
  inset: 0 -1px 0 -1px;
  border: 1px solid #D1D2D4;
  border-top: 0;
  border-radius: inherit;
  pointer-events: none;
}
.page_recruit .hr_reward_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_recruit .hr_reward_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.page_recruit .hr_reward_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_reward_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_reward_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hr_reward_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .hr_reward_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_reward_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .hr_reward_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .hr_benefit {
  position: relative;
  z-index: 1;
  background: none;
}
.page_recruit .hr_benefit .hr_section_title,
.page_recruit .hr_benefit .hr_section_subtitle,
.page_recruit .hr_benefit .hr_section_desc {
  color: #FFFFFF;
}
.page_recruit .hr_benefit_bg {
  position: sticky;
  top: 0;
  height: 100vh;
  background: url("/images/recruit/hr_benefit_bg.jpg") no-repeat center center/cover;
}
.page_recruit .hr_benefit_bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  pointer-events: none;
}
.page_recruit .hr_benefit_body {
  position: relative;
  z-index: 1;
  margin-top: -100vh;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_benefit_cards {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: repeat(2, max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent)));
  column-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  row-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  padding-bottom: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_benefit_card {
  background: rgba(255, 255, 255, 0.21);
  border: 1px solid rgba(209, 210, 212, 0.2);
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: max(36px * var(--base-ratio), 36 / var(--base-size) * var(--base-percent)) max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  min-height: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_benefit_card:nth-child(even) {
  transform: translateY(max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)));
}
.page_recruit .hr_benefit_card_ico {
  width: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  height: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
.page_recruit .hr_benefit_card_txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.page_recruit .hr_benefit_card_txt strong {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_benefit_card_txt strong {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hr_benefit_card_txt strong {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hr_benefit_card_txt strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.page_recruit .hr_benefit_card_txt p {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hr_benefit_card_txt p {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .hr_benefit_card_txt p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.page_recruit .hrd {
  position: relative;
}
.page_recruit .hrd_hero {
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_recruit .hrd_hero .intro_page_title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
}
.page_recruit .hrd_hero .hrd_hero_bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 75%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
.page_recruit .hrd_hero .hrd_hero_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .page_recruit .hrd_hero .hrd_hero_bg {
    width: 90%;
  }
}
.page_recruit .hrd_hero .hrd_hero_content {
  position: relative;
  z-index: 2;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page_recruit .hrd_hero .hrd_hero_title {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hrd_hero .hrd_hero_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hrd_hero .hrd_hero_title {
    font-size: var(--fs-h2-mob);
  }
}
.page_recruit .hrd_hero .hrd_hero_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
.page_recruit .hrd_newcomer {
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_expert {
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
.page_recruit .hrd_diagram {
  position: relative;
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  width: max(1019px * var(--base-ratio), 1019 / var(--base-size) * var(--base-percent));
  height: max(262px * var(--base-ratio), 262 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)) 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(25px * var(--base-ratio), 25 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_diagram::before {
  content: "";
  position: absolute;
  inset: -1px -1px 0 -1px;
  border: 1px solid #ABDDFA;
  border-bottom: 0;
  border-radius: inherit;
  pointer-events: none;
}
.page_recruit .hrd_diagram.is_4 {
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_diagram_row {
  display: contents;
}
.page_recruit .hrd_diagram_circle {
  width: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  height: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.page_recruit .hrd_diagram_circle.is_c1 {
  background: #7bcdf5;
}
.page_recruit .hrd_diagram_circle.is_c2 {
  background: #3bb7f3;
}
.page_recruit .hrd_diagram_circle.is_c3 {
  background: #00a3f1;
}
.page_recruit .hrd_diagram_circle.is_c4 {
  background: #0091db;
}
.page_recruit .hrd_diagram_circle.is_c5 {
  background: #017ec4;
}
.page_recruit .hrd_diagram_circle.is_c6 {
  background: #016cae;
}
.page_recruit .hrd_diagram_circle.is_c7 {
  background: #025997;
}
.page_recruit .hrd_diagram_circle span {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hrd_diagram_circle span {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hrd_diagram_circle span {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hrd_diagram_circle span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
}
html[lang=en] .page_recruit .hrd_diagram_circle {
  width: max(170px * var(--base-ratio), 170 / var(--base-size) * var(--base-percent));
  height: max(170px * var(--base-ratio), 170 / var(--base-size) * var(--base-percent));
}
html[lang=en] .page_recruit .hrd_diagram_circle span {
  font-size: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  html[lang=en] .page_recruit .hrd_diagram_circle {
    width: 128px;
    height: 128px;
  }
  html[lang=en] .page_recruit .hrd_diagram_circle span {
    font-size: 15px;
  }
}
.page_recruit .hrd_support {
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(190px * var(--base-ratio), 190 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-top: 1px solid #D1D2D4;
  border-bottom: 1px solid #D1D2D4;
}
.page_recruit .hrd_support_cards {
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  row-gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_support_card_img {
  width: 100%;
  height: max(280px * var(--base-ratio), 280 / var(--base-size) * var(--base-percent));
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.page_recruit .hrd_support_card_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page_recruit .hrd_support_card_txt {
  margin-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_support_card_txt strong {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hrd_support_card_txt strong {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .hrd_support_card_txt strong {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .hrd_support_card_txt strong {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .hrd_support_card_txt ul {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_recruit .hrd_support_card_txt li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .hrd_support_card_txt li {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .hrd_support_card_txt li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .hrd_support_card_txt li::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #818286;
  margin-top: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.page_recruit .apply_noti {
  margin: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_noti_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .apply_noti_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .apply_noti_title {
    font-size: var(--fs-h4-mob);
  }
}
.page_recruit .apply_noti_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.page_recruit .apply_noti_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .apply_noti_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .apply_noti_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}
.page_recruit .apply_filter {
  margin: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_filter_tabs {
  display: flex;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_tag_active {
  background-color: #00A3F1;
  color: #FFFFFF;
}
.page_recruit .apply_tag_closed {
  background-color: #818286;
  color: #FFFFFF;
}
.page_recruit .apply_filter_select {
  width: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_board {
  margin: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
}
.page_recruit .apply_board .board_list_head {
  padding: max(35px * var(--base-ratio), 35 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_board .board_list_item {
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_board .board_list_status {
  flex-shrink: 0;
  width: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
}
.page_recruit .apply_board .board_list_meta {
  display: contents;
}
.page_recruit .apply_board .board_list_type {
  flex-shrink: 0;
  width: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  text-align: center;
}
.page_recruit .apply_board .board_list_item .board_list_type {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .apply_board .board_list_item .board_list_type {
    font-size: 16px;
  }
}
.page_recruit .apply_board .board_list_item .board_list_type {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #161D27;
}
.page_recruit .apply_pagination {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_view {
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.page_recruit .apply_tag_type {
  border: 1px solid #D1D2D4;
  color: #161D27;
  background-color: transparent;
}
.page_recruit .talent_bottom {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_bottom_inner {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_bottom_card {
  flex: 1;
  height: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_bottom_inquiry {
  background: #F3F3F3;
}
.page_recruit .talent_bottom_inquiry_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_bottom_inquiry_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_bottom_inquiry_label {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .talent_bottom_inquiry_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .talent_bottom_inquiry_mail {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_bottom_inquiry_mail img {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .talent_bottom_inquiry_mail span {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_bottom_inquiry_mail span {
    font-size: 14px;
  }
}
.page_recruit .talent_bottom_inquiry_mail span {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .talent_bottom_recruit {
  background: #025997;
  text-decoration: none;
}
.page_recruit .talent_bottom_recruit > span {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_bottom_recruit > span {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_bottom_recruit > span {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .talent_bottom_recruit > span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.page_recruit .talent_bottom_arrow {
  display: block;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  background: url("/images/recruit/ico_outlink_circle.svg") no-repeat center/contain;
  position: relative;
  overflow: hidden;
}
.page_recruit .talent_bottom_arrow img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
.page_recruit .talent_bottom_arrow::after {
  content: "";
  position: absolute;
  top: 200%;
  left: -100%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url("/images/recruit/ico_outlink_arrow.svg") no-repeat center/contain;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
@media screen and (min-width: 1025px) and (hover: hover) {
  .page_recruit .talent_bottom_recruit:hover .talent_bottom_arrow img {
    top: -100%;
    left: 200%;
  }
  .page_recruit .talent_bottom_recruit:hover .talent_bottom_arrow::after {
    top: 50%;
    left: 50%;
  }
}
.page_recruit .job {
  position: relative;
}
.page_recruit .job_hero {
  margin: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  height: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.page_recruit .job_hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page_recruit .job_anchor {
  position: sticky;
  top: 0;
  z-index: 10;
  margin: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  height: max(72px * var(--base-ratio), 72 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  transition: top 0.3s cubic-bezier(0.4, 0, 1, 1);
}
.page_recruit .job_anchor_label {
  display: none;
}
.page_recruit .job_anchor_chevron {
  display: none;
}
.page_recruit .job_anchor_dropdown {
  display: contents;
}
.page_recruit .header.is_fixed.is_visible ~ .content .job_anchor {
  top: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  transition: top 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.page_recruit .job_anchor_tab {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  border-bottom: 1px solid #D1D2D4;
  background: #FFFFFF;
  text-align: center;
  text-decoration: none;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_anchor_tab {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .job_anchor_tab {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_recruit .job_anchor_tab.is_active {
  color: #025997;
  font-weight: 700;
}
.page_recruit .job_anchor_tab.is_active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: #025997;
}
.page_recruit .job_sections {
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  gap: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_section {
  display: block;
}
.page_recruit .job_section_img {
  width: 100%;
  height: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.page_recruit .job_section_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page_recruit .job_section_inner {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  align-items: flex-start;
}
.page_recruit .job_section_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_section_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_section_title {
    font-size: var(--fs-h3-mob);
  }
}
.page_recruit .job_section_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  width: max(425px * var(--base-ratio), 425 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  position: sticky;
  top: max(108px * var(--base-ratio), 108 / var(--base-size) * var(--base-percent));
}
.page_recruit .header.is_fixed.is_visible ~ .content .job_section_title {
  top: calc(max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent)) + max(108px * var(--base-ratio), 108 / var(--base-size) * var(--base-percent)));
}
.page_recruit .job_section_content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_duty_lead {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_duty_lead {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_duty_lead {
    font-size: var(--fs-h4-mob);
  }
}
.page_recruit .job_duty_lead {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
  margin-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_duty_list {
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_duty_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_recruit .job_duty_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.page_recruit .job_duty_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_duty_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_duty_title {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .job_duty_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .job_duty_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_duty_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .job_duty_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .job_qual_heading {
  display: block;
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_qual_heading {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_qual_heading {
    font-size: var(--fs-h4-mob);
  }
}
.page_recruit .job_qual_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  margin-bottom: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_qual_box {
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_qual_list {
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_qual_item {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_recruit .job_qual_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.page_recruit .job_qual_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_qual_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_qual_title {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .job_qual_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .job_qual_bullets {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_qual_bullets li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_qual_bullets li {
    font-size: var(--fs-p1-tab);
  }
}
.page_recruit .job_qual_bullets li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .job_qual_bullets li::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #818286;
  margin-top: max(13px * var(--base-ratio), 13 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.page_recruit .job_bottom {
  margin: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_bottom_inner {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_bottom_inquiry,
.page_recruit .job_bottom_recruit {
  flex: 1;
  height: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_bottom_inquiry {
  background: #F3F3F3;
}
.page_recruit .job_bottom_inquiry_label {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_bottom_inquiry_label {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_bottom_inquiry_label {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .job_bottom_inquiry_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_recruit .job_bottom_inquiry_mail {
  display: flex;
  align-items: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_bottom_inquiry_mail img {
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_recruit .job_bottom_inquiry_mail span {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_bottom_inquiry_mail span {
    font-size: 14px;
  }
}
.page_recruit .job_bottom_inquiry_mail span {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_recruit .job_bottom_recruit {
  background: #025997;
  text-decoration: none;
}
.page_recruit .job_bottom_recruit > span {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_bottom_recruit > span {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .job_bottom_recruit > span {
    font-size: var(--fs-h5-mob);
  }
}
.page_recruit .job_bottom_recruit > span {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.page_recruit .job_bottom_arrow {
  display: block;
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  background: url("/images/recruit/ico_outlink_circle.svg") no-repeat center/contain;
  position: relative;
  overflow: hidden;
}
.page_recruit .job_bottom_arrow img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
.page_recruit .job_bottom_arrow::after {
  content: "";
  position: absolute;
  top: 200%;
  left: -100%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url("/images/recruit/ico_outlink_arrow.svg") no-repeat center/contain;
  transition: top 0.3s ease-in-out, left 0.3s ease-in-out;
}
@media screen and (min-width: 1025px) and (hover: hover) {
  .page_recruit .job_bottom_recruit:hover .job_bottom_arrow img {
    top: -100%;
    left: 200%;
  }
  .page_recruit .job_bottom_recruit:hover .job_bottom_arrow::after {
    top: 50%;
    left: 50%;
  }
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_hero .talent_hero_content {
    gap: 26px;
  }
  .page_recruit .talent_value_head {
    display: none;
  }
  .page_recruit .talent_value_bg {
    padding-top: 288px;
    background-origin: content-box;
    background-clip: content-box;
  }
  .page_recruit .talent_value_slide_head {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 288px;
    background: #FFFFFF;
    padding: 128px 20px 0;
  }
  .page_recruit .talent_value_slide_title {
    font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #161D27;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_recruit .talent_value_slide_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .page_recruit .talent_value_slide_title {
    font-size: var(--fs-h3-mob);
  }
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_value_slide_desc {
    font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.02em;
    color: #161D27;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_recruit .talent_value_slide_desc {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .page_recruit .talent_value_slide_desc {
    font-size: var(--fs-h5-mob);
  }
}
@media screen and (max-width: 1024px) {
  .page_recruit .talent_bottom {
    padding: 64px 40px 160px;
  }
  .page_recruit .talent_bottom_inner {
    gap: 20px;
  }
  .page_recruit .talent_bottom_card {
    height: 100px;
    gap: 10px;
  }
  .page_recruit .talent_bottom_inquiry {
    border-radius: 8px;
  }
  .page_recruit .talent_bottom_inquiry_mail {
    gap: 4px;
  }
  .page_recruit .talent_bottom_inquiry_mail img {
    width: 20px;
    height: 20px;
  }
  .page_recruit .talent_bottom_recruit {
    border-radius: 12px;
    gap: 4px;
  }
  .page_recruit .talent_bottom_arrow {
    width: 28px;
    height: 28px;
  }
  .page_recruit .hr_section_inner {
    flex-direction: column;
    gap: 16px;
    width: 688px;
    padding: 0;
    margin: 0 auto;
  }
  .page_recruit .hr_section_title {
    position: static;
    width: auto;
  }
  .page_recruit .hr_section_desc {
    margin-top: 10px;
  }
  .page_recruit .hr_system {
    padding-top: 128px;
  }
  .page_recruit .hr_bullet_list {
    margin-top: 26px;
    gap: 10px;
  }
  .page_recruit .hr_bullet_list li {
    gap: 6px;
  }
  .page_recruit .hr_bullet_list li::before {
    margin-top: 11px;
  }
  .page_recruit .hr_reward {
    padding: 128px 0;
  }
  .page_recruit .hr_reward_diagram {
    margin-top: 32px;
    width: 100%;
    height: 224px;
    border-radius: 12px 12px 0 0;
    padding: 0 32px;
    gap: 20px;
  }
  .page_recruit .hr_reward_circle {
    width: 128px;
    height: 128px;
    flex-shrink: 0;
  }
  .page_recruit .hr_reward_alpha {
    padding: 12px;
    gap: 14px;
  }
  .page_recruit .hr_reward_list {
    width: 100%;
    border-radius: 0 0 12px 12px;
    padding: 32px 40px;
    gap: 24px;
  }
  .page_recruit .hr_reward_item {
    gap: 6px;
    padding-bottom: 24px;
  }
  .page_recruit .hr_benefit_body {
    padding: 128px 0 128px;
  }
  .page_recruit .hr_benefit_cards {
    margin-top: 32px;
    grid-template-columns: repeat(2, 334px);
    column-gap: 20px;
    row-gap: 20px;
    padding-bottom: 40px;
  }
  .page_recruit .hr_benefit_card {
    border-radius: 8px;
    padding: 28px 24px 32px;
    gap: 12px;
  }
  .page_recruit .hr_benefit_card:nth-child(even) {
    transform: translateY(40px);
  }
  .page_recruit .hr_benefit_card_ico {
    width: 40px;
    height: 40px;
  }
  .page_recruit .hr_benefit_card_txt {
    gap: 8px;
  }
  .page_recruit .hrd_newcomer .hr_section_desc,
  .page_recruit .hrd_expert .hr_section_desc,
  .page_recruit .hrd_support .hr_section_desc {
    margin-top: 0;
  }
  .page_recruit .hrd_newcomer {
    padding-top: 128px;
  }
  .page_recruit .hrd_expert {
    padding: 128px 0;
  }
  .page_recruit .hrd_diagram {
    width: 100%;
    height: 200px;
    border-radius: 12px 12px 0 0;
    margin-top: 32px;
    gap: 0;
    justify-content: center;
  }
  .page_recruit .hrd_diagram.is_4 {
    gap: 37px;
  }
  .page_recruit .hrd_diagram_circle {
    width: 128px;
    height: 128px;
  }
  .page_recruit .hrd_support {
    padding: 128px 0;
  }
  .page_recruit .hrd_support_cards {
    margin-top: 32px;
    column-gap: 20px;
    row-gap: 40px;
  }
  .page_recruit .hrd_support_card_img {
    height: 200px;
    border-radius: 6px;
  }
  .page_recruit .hrd_support_card_txt {
    margin-top: 28px;
    gap: 6px;
  }
  .page_recruit .apply_noti {
    margin: 0 40px;
    padding: 32px 40px;
    border-radius: 8px;
    gap: 10px;
  }
  .page_recruit .apply_filter {
    margin: 48px 40px 0;
    height: 52px;
  }
  .page_recruit .apply_filter_tabs {
    gap: 4px;
  }
  .page_recruit .apply_board {
    margin: 28px 40px 0;
  }
  .page_recruit .apply_board .board_list_item {
    padding: 24px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .page_recruit .apply_board .board_list_status {
    width: auto;
    justify-content: flex-start;
    margin-bottom: -4px;
  }
  .page_recruit .apply_board .board_list_title {
    align-self: stretch;
  }
  .page_recruit .apply_board .board_list_meta {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
  }
  .page_recruit .apply_board .board_list_date {
    width: auto;
    text-align: left;
  }
  .page_recruit .apply_board .board_list_type {
    width: auto;
    text-align: right;
  }
  .page_recruit .apply_pagination {
    margin-top: 48px;
    padding-bottom: 160px;
  }
  .page_recruit .apply_view {
    padding: 80px 40px 160px;
  }
  .page_recruit .job_hero {
    margin: 0 40px;
    height: 320px;
    border-radius: 10px;
  }
  .page_recruit .job_anchor {
    margin: 80px 0 0;
    height: 72px;
    display: block;
    overflow: visible;
    border-top: 1px solid #D1D2D4;
    border-bottom: 1px solid #D1D2D4;
  }
  .page_recruit .header.is_fixed.is_visible ~ .content .job_anchor {
    top: 80px;
    transition: top 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .page_recruit .job_anchor.is_sticky {
    border-top: none;
  }
  .page_recruit .job_anchor_label {
    display: flex;
    width: 100%;
    height: 72px;
    padding: 0 40px;
    align-items: center;
    justify-content: flex-start;
    background: none;
    border: none;
    box-shadow: inset 0 -3px 0 0 #025997;
    color: #025997;
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.02em;
    cursor: pointer;
    text-align: left;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_recruit .job_anchor_label {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_anchor_chevron {
    display: block;
    position: absolute;
    right: 40px;
    top: 24px;
    width: 24px;
    height: 24px;
    pointer-events: none;
  }
  .page_recruit .job_anchor_chevron::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid #818286;
    border-bottom: 2px solid #818286;
    transform: rotate(45deg);
    margin: 3px auto 0;
    transition: transform 0.2s;
  }
  .page_recruit .job_anchor.is_open .job_anchor_dropdown {
    display: flex;
  }
  .page_recruit .job_anchor.is_open .job_anchor_chevron::before {
    transform: rotate(-135deg);
    margin-top: 8px;
  }
  .page_recruit .job_anchor_dropdown {
    display: none;
    position: absolute;
    top: 72px;
    left: 0;
    right: 0;
    flex-direction: column;
    background: #F3F3F3;
    border-bottom: 1px solid #D1D2D4;
    padding: 24px 40px 36px;
    gap: 16px;
    z-index: 10;
  }
  .page_recruit .job_anchor_dropdown .job_anchor_tab {
    display: flex;
    height: 23px;
    width: 100%;
    padding: 0;
    align-items: center;
    justify-content: flex-start;
    background: none;
    box-shadow: none;
    border-bottom: none;
    color: #161D27;
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_recruit .job_anchor_dropdown .job_anchor_tab {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .page_recruit .job_anchor_dropdown .job_anchor_tab.is_active {
    color: #025997;
  }
  .page_recruit .job_anchor_dropdown .job_anchor_tab::after {
    display: none;
  }
  .page_recruit .job_sections {
    padding: 64px 40px 0;
    gap: 128px;
  }
  .page_recruit .job_section_img {
    height: 320px;
    border-radius: 10px;
  }
  .page_recruit .job_section_inner {
    margin-top: 60px;
    flex-direction: column;
    gap: 16px;
  }
  .page_recruit .job_section_title {
    width: auto;
    position: static;
  }
  .page_recruit .job_section_content {
    gap: 64px;
  }
  .page_recruit .job_duty_lead {
    margin-bottom: 26px;
  }
  .page_recruit .job_duty_list {
    gap: 32px;
  }
  .page_recruit .job_duty_item {
    gap: 8px;
    padding-bottom: 32px;
  }
  .page_recruit .job_qual_heading {
    margin-bottom: 12px;
  }
  .page_recruit .job_qual_box {
    border-radius: 12px;
    padding: 32px 40px;
  }
  .page_recruit .job_qual_list {
    gap: 24px;
  }
  .page_recruit .job_qual_item {
    gap: 10px;
    padding-bottom: 24px;
  }
  .page_recruit .job_qual_bullets {
    gap: 4px;
  }
  .page_recruit .job_qual_bullets li {
    gap: 6px;
  }
  .page_recruit .job_qual_bullets li::before {
    margin-top: 12px;
  }
  .page_recruit .job_bottom {
    margin: 80px 40px 160px;
  }
  .page_recruit .job_bottom_inner {
    gap: 20px;
  }
  .page_recruit .job_bottom_inquiry,
  .page_recruit .job_bottom_recruit {
    height: 100px;
  }
  .page_recruit .job_bottom_inquiry {
    border-radius: 8px;
  }
  .page_recruit .job_bottom_inquiry_mail {
    gap: 10px;
  }
  .page_recruit .job_bottom_recruit {
    border-radius: 12px;
    gap: 4px;
  }
  .page_recruit .job_bottom_arrow {
    width: 28px;
    height: 28px;
  }
}
@media screen and (max-width: 767px) {
  .page_recruit .talent_hero .talent_hero_content {
    gap: 26px;
    padding: 0 20px;
  }
  .page_recruit .talent_bottom {
    padding: 64px 20px 160px;
  }
  .page_recruit .talent_bottom_inner {
    flex-direction: column;
    gap: 20px;
  }
  .page_recruit .talent_bottom_card {
    flex: none;
    height: 100px;
    gap: 10px;
  }
  .page_recruit .talent_bottom_card,
  .page_recruit .talent_bottom_inquiry,
  .page_recruit .talent_bottom_recruit {
    border-radius: 8px;
  }
  .page_recruit .talent_bottom_inquiry_mail {
    gap: 4px;
  }
  .page_recruit .talent_bottom_inquiry_mail img {
    width: 20px;
    height: 20px;
  }
  .page_recruit .talent_bottom_recruit {
    gap: 4px;
  }
  .page_recruit .talent_bottom_arrow {
    width: 28px;
    height: 28px;
  }
  .page_recruit .hr_section_inner {
    flex-direction: column;
    gap: 16px;
    width: auto;
    padding: 0 20px;
    margin: 0;
  }
  .page_recruit .hr_section_title {
    position: static;
    width: auto;
  }
  .page_recruit .hr_section_desc {
    margin-top: 10px;
  }
  .page_recruit .hr_system {
    padding-top: 128px;
  }
  .page_recruit .hr_bullet_list {
    margin-top: 26px;
    gap: 10px;
  }
  .page_recruit .hr_bullet_list li {
    gap: 6px;
  }
  .page_recruit .hr_bullet_list li::before {
    margin-top: 11px;
  }
  .page_recruit .hr_reward {
    padding: 128px 0;
  }
  .page_recruit .hr_reward_diagram {
    margin-top: 32px;
    width: 100%;
    height: 274px;
    border-radius: 12px 12px 0 0;
    padding: 20px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }
  .page_recruit .hr_reward_circle {
    width: 86px;
    height: 86px;
    flex-shrink: 0;
  }
  .page_recruit .hr_reward_circle span {
    font-size: 14px;
  }
  .page_recruit .hr_reward_plus svg {
    width: 14px;
    height: 14px;
  }
  .page_recruit .hr_reward_alpha {
    padding: 8px;
    gap: 10px;
  }
  .page_recruit .hr_reward_list {
    width: 100%;
    border-radius: 0 0 12px 12px;
    padding: 28px 20px;
    gap: 24px;
  }
  .page_recruit .hr_reward_item {
    gap: 6px;
    padding-bottom: 24px;
  }
  .page_recruit .hr_benefit_body {
    padding: 128px 0 64px;
  }
  .page_recruit .hr_benefit_cards {
    margin-top: 32px;
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 20px;
    padding-bottom: 0;
  }
  .page_recruit .hr_benefit_card {
    border-radius: 8px;
    padding: 28px 20px 32px;
    gap: 12px;
    min-height: auto;
  }
  .page_recruit .hr_benefit_card:nth-child(even) {
    transform: none;
  }
  .page_recruit .hr_benefit_card_ico {
    width: 40px;
    height: 40px;
  }
  .page_recruit .hr_benefit_card_txt {
    gap: 8px;
  }
  .page_recruit .hrd_newcomer .hr_section_desc,
  .page_recruit .hrd_expert .hr_section_desc,
  .page_recruit .hrd_support .hr_section_desc {
    margin-top: 0;
  }
  .page_recruit .hrd_newcomer {
    padding-top: 128px;
  }
  .page_recruit .hrd_expert {
    padding: 128px 0;
  }
  .page_recruit .hrd_diagram {
    width: 100%;
    height: 181px;
    border-radius: 16px 16px 0 0;
    margin-top: 32px;
    padding: 0;
    gap: 0;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
  }
  .page_recruit .hrd_diagram_row {
    display: flex;
    justify-content: center;
    width: 100%;
    gap: 0;
  }
  .page_recruit .hrd_diagram_row:nth-child(2) {
    margin-top: -11px;
  }
  .page_recruit .hrd_diagram.is_4 {
    height: 260px;
    display: grid;
    grid-template-columns: repeat(2, 110px);
    grid-auto-rows: 110px;
    justify-content: center;
    align-content: center;
    gap: 0;
  }
  .page_recruit .hrd_diagram.is_4 .hrd_diagram_circle {
    width: 110px;
    height: 110px;
  }
  html[lang=en] .page_recruit .hrd_diagram.is_4 .hrd_diagram_circle {
    width: 110px;
    height: 110px;
  }
  .page_recruit .hrd_diagram_circle {
    width: 80px;
    height: 80px;
  }
  .page_recruit .hrd_diagram_circle span {
    font-size: 12px;
    font-weight: 600;
  }
  html[lang=en] .page_recruit .hrd_diagram_circle {
    width: 80px;
    height: 80px;
  }
  html[lang=en] .page_recruit .hrd_diagram_circle span {
    font-size: 12px;
  }
  .page_recruit .hrd_support {
    padding: 128px 0;
  }
  .page_recruit .hrd_support_cards {
    margin-top: 32px;
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 32px;
  }
  .page_recruit .hrd_support_card_img {
    height: auto;
    border-radius: 6px;
  }
  .page_recruit .hrd_support_card_txt {
    margin-top: 28px;
    gap: 6px;
  }
  .page_recruit .hrd .talent_bottom {
    padding-top: 64px;
  }
  .page_recruit .apply_noti {
    margin: 0 20px;
  }
  .page_recruit .apply_filter {
    margin: 48px 20px 0;
    height: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .page_recruit .apply_filter_select {
    width: 100%;
  }
  .page_recruit .apply_board {
    margin: 28px 20px 0;
  }
  .page_recruit .apply_board .board_list_item {
    padding: 24px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .page_recruit .apply_board .board_list_status {
    width: auto;
    justify-content: flex-start;
    margin-bottom: -4px;
  }
  .page_recruit .apply_board .board_list_title {
    align-self: stretch;
  }
  .page_recruit .apply_board .board_list_meta {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
  }
  .page_recruit .apply_board .board_list_date {
    width: auto;
    text-align: left;
  }
  .page_recruit .apply_board .board_list_type {
    width: auto;
    text-align: right;
  }
  .page_recruit .apply_pagination {
    margin-top: 48px;
    padding-bottom: 160px;
  }
  .page_recruit .apply_view {
    padding: 80px 20px 160px;
  }
  .page_recruit .job_anchor {
    height: 60px;
  }
  .page_recruit .header.is_fixed.is_visible ~ .content .job_anchor {
    top: 68px;
  }
  .page_recruit .job_anchor_label {
    height: 60px;
    padding: 0 20px;
  }
  .page_recruit .job_anchor_chevron {
    right: 20px;
    top: 18px;
  }
  .page_recruit .job_anchor_dropdown {
    top: 60px;
    padding: 24px 20px 36px;
  }
  .page_recruit .job .intro_page_title_inner {
    padding: 120px 0 60px;
  }
  .page_recruit .job_hero {
    margin: 0 20px;
  }
  .page_recruit .job_sections {
    padding: 64px 20px 0;
  }
  .page_recruit .job_section_img {
    height: 280px;
    border-radius: 8.75px;
  }
  .page_recruit .job_qual_box {
    padding: 28px 20px;
  }
  .page_recruit .job_bottom {
    margin: 80px 20px 160px;
  }
  .page_recruit .job_bottom_inner {
    flex-direction: column;
  }
  .page_recruit .job_bottom_inquiry,
  .page_recruit .job_bottom_recruit {
    flex: none;
  }
  .page_recruit .job_bottom_recruit {
    border-radius: 8px;
  }
}

.privacy_policy .privacy_inner {
  width: max(1166px * var(--base-ratio), 1166 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
.privacy_policy .privacy_intro {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_intro {
    font-size: var(--fs-p1-tab);
  }
}
.privacy_policy .privacy_intro {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #161D27;
  text-align: center;
}
.privacy_policy .privacy_select {
  display: flex;
  justify-content: flex-end;
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_select .select {
  width: max(335px * var(--base-ratio), 335 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
.privacy_policy .privacy_select .select_trigger {
  color: #818286;
}
.privacy_policy .privacy_toc {
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  background-color: #F3F3F3;
  padding: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_toc_list {
  display: flex;
  flex-wrap: wrap;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_toc_col {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  flex: 1;
  min-width: 0;
}
.privacy_policy .privacy_toc_item {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_toc_item {
    font-size: 16px;
  }
}
.privacy_policy .privacy_toc_item {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #6D6E72;
  text-decoration: none;
  cursor: pointer;
}
.privacy_policy .privacy_toc_item .dot {
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  margin-top: 0.6em;
  border-radius: 50%;
  background-color: #6D6E72;
  flex-shrink: 0;
}
.privacy_policy .privacy_content {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content > * {
  margin-top: 0;
  margin-bottom: 0;
}
.privacy_policy .privacy_content > h3 {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_content > h3 {
    font-size: var(--fs-p1-tab);
  }
}
.privacy_policy .privacy_content > h3 {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content > h3:first-child {
  margin-top: 0;
}
.privacy_policy .privacy_content > p {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_content > p {
    font-size: 16px;
  }
}
.privacy_policy .privacy_content > p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
  white-space: pre-line;
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content > strong {
  display: block;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_content > strong {
    font-size: 16px;
  }
}
.privacy_policy .privacy_content > strong {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.3;
  color: #161D27;
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content > strong + p,
.privacy_policy .privacy_content > strong + ul {
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content > ul {
  list-style: none;
  padding: 0;
  padding-left: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  margin-top: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.privacy_policy .privacy_content li {
  position: relative;
  padding-left: max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_content li {
    font-size: 16px;
  }
}
.privacy_policy .privacy_content li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
}
.privacy_policy .privacy_content li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent));
  height: max(3px * var(--base-ratio), 3 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background-color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .privacy_policy .privacy_inner {
    width: auto;
    padding: 0 40px;
  }
  .privacy_policy .privacy_select {
    margin-top: 64px;
  }
  .privacy_policy .privacy_select .select {
    width: 335px;
  }
  .privacy_policy .privacy_toc {
    margin-top: 16px;
    padding: 36px 40px;
  }
  .privacy_policy .privacy_toc_list {
    display: block;
    columns: 2;
    column-gap: 40px;
  }
  .privacy_policy .privacy_toc_col {
    display: contents;
  }
  .privacy_policy .privacy_toc_item {
    gap: 6px;
    margin-top: 8px;
    break-inside: avoid;
  }
  .privacy_policy .privacy_toc_item .dot {
    width: 3px;
    height: 3px;
  }
  .privacy_policy .privacy_toc_col:first-child > .privacy_toc_item:first-child {
    margin-top: 0;
  }
  .privacy_policy .privacy_content {
    margin-top: 48px;
    padding-bottom: 160px;
  }
  .privacy_policy .privacy_content > h3 {
    margin-top: 32px;
  }
  .privacy_policy .privacy_content > strong {
    margin-top: 10px;
    line-height: 1.5;
  }
  .privacy_policy .privacy_content > strong + p,
  .privacy_policy .privacy_content > strong + ul {
    margin-top: 6px;
  }
  .privacy_policy .privacy_content > ul {
    margin-top: 6px;
    padding-left: 12px;
  }
  .privacy_policy .privacy_content li {
    padding-left: 10px;
  }
  .privacy_policy .privacy_content li::before {
    width: 3px;
    height: 3px;
  }
}
@media screen and (max-width: 767px) {
  .privacy_policy .privacy_inner {
    padding: 0 20px;
  }
  .privacy_policy .privacy_select .select {
    width: 100%;
  }
  .privacy_policy .privacy_toc {
    padding: 28px 32px;
  }
  .privacy_policy .privacy_toc_list {
    columns: 1;
  }
  .privacy_policy .privacy_content {
    margin-top: 40px;
  }
}

.newsroom_list {
  position: relative;
}

.newsroom_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: max(999px * var(--base-ratio), 999 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  z-index: 0;
}

.newsroom_list .intro_page_title {
  position: relative;
  z-index: 1;
}

.newsroom_featured {
  position: relative;
  z-index: 1;
  margin: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}

.newsroom_slider {
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.newsroom_slide {
  display: flex;
  height: max(476px * var(--base-ratio), 476 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.newsroom_slide_cover {
  position: relative;
  width: max(722px * var(--base-ratio), 722 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  display: block;
  text-decoration: none;
}
.newsroom_slide_cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.newsroom_slide_content {
  flex: 1;
  background: #FFFFFF;
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.newsroom_slide_content_top {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.newsroom_slide_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_slide_label {
    font-size: 16px;
  }
}
.newsroom_slide_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}

.newsroom_slide_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_slide_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .newsroom_slide_title {
    font-size: var(--fs-h4-mob);
  }
}
.newsroom_slide_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.newsroom_slide_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_slide_desc {
    font-size: 16px;
  }
}
.newsroom_slide_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.newsroom_slide_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_slide_date {
    font-size: 16px;
  }
}
.newsroom_slide_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.newsroom_indicator {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.newsroom_dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #FFFFFF;
  border: 1px solid #D1D2D4;
  cursor: pointer;
  padding: 0;
  transition: all 0.3s ease;
}
.newsroom_dot.is_active {
  background: #025997;
  border-color: #025997;
}

.newsroom_search {
  position: relative;
  z-index: 1;
  margin: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  justify-content: flex-end;
}

.newsroom_search_box {
  position: relative;
  width: max(335px * var(--base-ratio), 335 / var(--base-size) * var(--base-percent));
}

.newsroom_input {
  padding-right: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent));
}

.newsroom_search_btn {
  position: absolute;
  right: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
}
.newsroom_search_btn svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.newsroom_cards {
  position: relative;
  z-index: 1;
  margin: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
}

.newsroom_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  text-decoration: none;
  transition: all 0.3s ease;
}
@media (hover: hover) {
  .newsroom_card:hover {
    background: #025997;
    border-color: #025997;
  }
  .newsroom_card:hover .newsroom_card_tag {
    background: #FFFFFF;
    color: #025997;
    border-color: transparent;
  }
  .newsroom_card:hover .newsroom_card_title {
    color: #FFFFFF;
  }
  .newsroom_card:hover .newsroom_card_date {
    color: #FFFFFF;
  }
  .newsroom_card:hover .newsroom_card_arrow {
    color: #FFFFFF;
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

.newsroom_card_top {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}

.newsroom_card_tag {
  align-self: flex-start;
  transition: all 0.3s ease;
}

.newsroom_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .newsroom_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.newsroom_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.3s ease;
}

.newsroom_card_bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.newsroom_card_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_card_date {
    font-size: 16px;
  }
}
.newsroom_card_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  transition: color 0.3s ease;
}

.newsroom_card_arrow {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #949599;
  flex-shrink: 0;
  transition: color 0.3s ease;
}

.newsroom_pagination {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}

.newsroom_empty {
  position: relative;
  z-index: 1;
  margin: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent)) 0;
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}

.newsroom_empty_box {
  border-top: 2px solid #025997;
  border-bottom: 1px solid #D1D2D4;
  padding: max(220px * var(--base-ratio), 220 / var(--base-size) * var(--base-percent)) max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.newsroom_empty_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_empty_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .newsroom_empty_title {
    font-size: var(--fs-h4-mob);
  }
}
.newsroom_empty_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}

.newsroom_empty_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_empty_desc {
    font-size: 16px;
  }
}
.newsroom_empty_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}

.newsroom_list_en {
  position: relative;
}
.newsroom_list_en .intro_page_title_inner {
  padding-bottom: 0;
}
.newsroom_list_en .newsroom_search {
  margin: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) 0 0;
}
.newsroom_list_en .newsroom_empty {
  margin: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) 0 0;
}

.newsroom_en_inner {
  position: relative;
  z-index: 1;
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}

.newsroom_en_list {
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-top: 2px solid #025997;
}

.newsroom_en_item {
  display: flex;
  align-items: flex-start;
  gap: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: max(56px * var(--base-ratio), 56 / var(--base-size) * var(--base-percent)) 0;
  border-bottom: 1px solid #D1D2D4;
  text-decoration: none;
}

@media (hover: hover) {
  a.newsroom_en_item:hover .newsroom_en_title {
    color: #025997;
  }
}

.newsroom_en_thumb {
  flex-shrink: 0;
  width: max(300px * var(--base-ratio), 300 / var(--base-size) * var(--base-percent));
  height: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  background-color: #d9d9d9;
}
.newsroom_en_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.newsroom_en_body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}

.newsroom_en_text {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}

.newsroom_en_tag {
  align-self: flex-start;
}

.newsroom_en_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_en_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .newsroom_en_title {
    font-size: var(--fs-h5-mob);
  }
}
.newsroom_en_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
}

.newsroom_en_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_en_desc {
    font-size: 16px;
  }
}
.newsroom_en_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
  white-space: pre-line;
}

.newsroom_en_date {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_en_date {
    font-size: 16px;
  }
}
.newsroom_en_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  color: #6D6E72;
}

@media screen and (max-width: 1024px) {
  .newsroom_list_en .intro_page_title_inner {
    padding-bottom: 0;
  }
  .newsroom_list_en .newsroom_search {
    margin-top: 48px;
  }
  .newsroom_list_en .newsroom_search_box {
    width: 340px;
  }
  .newsroom_list_en .newsroom_input {
    padding-right: 48px;
  }
  .newsroom_list_en .newsroom_search_btn {
    right: 20px;
  }
  .newsroom_list_en .newsroom_search_btn svg {
    width: 20px;
    height: 20px;
  }
  .newsroom_list_en .newsroom_empty {
    margin-top: 16px;
  }
  .newsroom_en_inner {
    padding: 0 40px;
  }
  .newsroom_en_list {
    margin-top: 16px;
  }
  .newsroom_en_item {
    gap: 30px;
    padding: 40px 0;
  }
  .newsroom_en_thumb {
    width: 246px;
    height: 164px;
  }
  .newsroom_en_body {
    gap: 32px;
  }
  .newsroom_en_text {
    gap: 10px;
  }
}
@media screen and (max-width: 767px) {
  .newsroom_list_en .newsroom_search_box {
    width: 100%;
  }
  .newsroom_en_inner {
    padding: 0 20px;
  }
  .newsroom_en_item {
    flex-direction: column;
    gap: 30px;
  }
  .newsroom_en_thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 335/223;
  }
}
.newsroom_view {
  margin: 0 max(377px * var(--base-ratio), 377 / var(--base-size) * var(--base-percent));
  padding-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}

.newsroom_view_category {
  display: block;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_category {
    font-size: var(--fs-p1-tab);
  }
}
.newsroom_view_category {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}

.newsroom_view_title {
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_title {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .newsroom_view_title {
    font-size: var(--fs-h2-mob);
  }
}
.newsroom_view_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.newsroom_view_date {
  display: block;
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_date {
    font-size: 16px;
  }
}
.newsroom_view_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.newsroom_view_body {
  margin-top: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
  border-top: 1px solid #D1D2D4;
  border-bottom: 1px solid #D1D2D4;
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  gap: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}

.newsroom_view_figure img {
  width: 100%;
  display: block;
}

.newsroom_view_caption {
  background-color: #F3F3F3;
  padding: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_caption {
    font-size: 14px;
  }
}
.newsroom_view_caption {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.newsroom_view_summary {
  background-color: #E8F3FE;
  padding: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_summary {
    font-size: var(--fs-p1-tab);
  }
}
.newsroom_view_summary {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #025997;
}

.newsroom_view_text {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_text {
    font-size: var(--fs-p1-tab);
  }
}
.newsroom_view_text {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.newsroom_view_text ul {
  list-style: disc;
  padding-left: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
.newsroom_view_text ol {
  list-style: decimal;
  padding-left: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.newsroom_view_nav {
  padding-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.newsroom_view_prev,
.newsroom_view_next {
  display: flex;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  text-decoration: none;
  color: #6D6E72;
}
.newsroom_view_prev svg,
.newsroom_view_next svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  color: #949599;
  flex-shrink: 0;
}
.newsroom_view_prev span,
.newsroom_view_next span {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .newsroom_view_prev span,
  .newsroom_view_next span {
    font-size: 16px;
  }
}
.newsroom_view_prev span,
.newsroom_view_next span {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.library {
  position: relative;
}

.library_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: max(997px * var(--base-ratio), 997 / var(--base-size) * var(--base-percent));
  background-color: #E8F3FE;
  z-index: 0;
}

.library .intro_page_title {
  position: relative;
  z-index: 1;
}

.library_video {
  position: relative;
  z-index: 1;
  margin: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.library_video_player {
  width: max(870px * var(--base-ratio), 870 / var(--base-size) * var(--base-percent));
  height: max(490px * var(--base-ratio), 490 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
  flex-shrink: 0;
}
.library_video_player img,
.library_video_player iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border: none;
}

.library_video_side {
  width: max(574px * var(--base-ratio), 574 / var(--base-size) * var(--base-percent));
  height: max(490px * var(--base-ratio), 490 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.library_video_info {
  height: max(184px * var(--base-ratio), 184 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  background-color: #025997;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.library_video_info_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_video_info_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .library_video_info_title {
    font-size: var(--fs-h5-mob);
  }
}
.library_video_info_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  flex-shrink: 0;
}

.library_video_info_desc_box {
  flex: 1;
  min-height: 0;
  position: relative;
}

.library_video_info_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_video_info_desc {
    font-size: 16px;
  }
}
.library_video_info_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  word-break: break-all;
  white-space: pre-line;
}
:lang(en) .library_video_info_desc {
  word-break: keep-all;
}
.library_video_info_desc {
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.library_video_info_desc::-webkit-scrollbar {
  display: none;
}
.library_video_info_desc {
  scrollbar-width: none;
}

.library_video_info_scrollbar {
  position: absolute;
  top: 0;
  right: calc(max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent)) * -1);
  bottom: 0;
  width: 2px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  z-index: 2;
}

.library_video_info_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  transition: top 0.05s linear;
}

.library_video_list {
  flex: 1;
  min-height: 0;
  position: relative;
  background-color: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.library_video_list_inner {
  padding: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.library_video_list_inner::-webkit-scrollbar {
  display: none;
}
.library_video_list_inner {
  scrollbar-width: none;
}

.library_video_list_scrollbar {
  position: absolute;
  top: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  right: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  bottom: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
  width: 2px;
  background: #F3F3F3;
  border-radius: 999px;
  z-index: 2;
}

.library_video_list_thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #818286;
  border-radius: 999px;
  transition: top 0.05s linear;
}

.library_video_item {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-bottom: 1px solid #D1D2D4;
  padding: 0 0 max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  cursor: pointer;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_video_item {
    font-size: 16px;
  }
}
.library_video_item {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
  transition: color 0.3s ease;
}
.library_video_item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
@media (hover: hover) {
  .library_video_item:hover {
    color: #025997;
  }
}

.library_video_list_fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
  pointer-events: none;
  border-radius: 0 0 max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent)) max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  transition: opacity 0.3s ease;
}
.library_video_list_fade.is_hidden {
  opacity: 0;
}

.library_social {
  position: relative;
  z-index: 1;
  margin: max(260px * var(--base-ratio), 260 / var(--base-size) * var(--base-percent)) max(227px * var(--base-ratio), 227 / var(--base-size) * var(--base-percent)) 0;
  display: flex;
  flex-direction: column;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}

.library_social_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.library_social_header .btn {
  overflow: hidden;
}
@media (hover: hover) {
  .library_social_header .btn:hover svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

.library_social_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_social_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .library_social_title {
    font-size: var(--fs-h3-mob);
  }
}
.library_social_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}

.library_social_grid {
  display: flex;
  flex-wrap: wrap;
  row-gap: max(42px * var(--base-ratio), 42 / var(--base-size) * var(--base-percent));
  column-gap: max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent));
}

.library_social_card {
  width: calc((100% - max(43px * var(--base-ratio), 43 / var(--base-size) * var(--base-percent)) * 2) / 3);
  display: flex;
  flex-direction: column;
  text-decoration: none;
}
@media (hover: hover) {
  .library_social_card:hover .library_social_play {
    background: #00A3F1;
    border-color: transparent;
  }
}
.library_social_card.is_instagram .library_social_play {
  display: none;
}
@media (hover: hover) {
  .library_social_card.is_instagram:hover .library_social_thumb img {
    transform: scale(1.1);
  }
}

.library_social_thumb {
  position: relative;
  width: 100%;
  height: max(259px * var(--base-ratio), 259 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}
.library_social_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s cubic-bezier(0, 0.49, 1, 1);
}

.library_social_dim {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1;
}

.library_social_play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  height: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(20.8px);
  -webkit-backdrop-filter: blur(20.8px);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  padding: 0;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.library_social_play svg {
  width: max(19px * var(--base-ratio), 19 / var(--base-size) * var(--base-percent));
  height: max(19px * var(--base-ratio), 19 / var(--base-size) * var(--base-percent));
  color: #FFFFFF;
  margin-left: 2px;
}

.library_social_content {
  margin-top: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.library_social_content .tag {
  align-self: flex-start;
}

.library_social_text {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}

.library_social_card_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_social_card_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .library_social_card_title {
    font-size: var(--fs-h5-mob);
  }
}
.library_social_card_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.library_social_card_date {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_social_card_date {
    font-size: 14px;
  }
}
.library_social_card_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}

.library_brochure {
  position: relative;
  width: 100%;
  height: max(400px * var(--base-ratio), 400 / var(--base-size) * var(--base-percent));
  margin-top: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  overflow: hidden;
}

.library_brochure_bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
}
.library_brochure_bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.library_brochure_content {
  position: relative;
  z-index: 1;
  margin: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  padding-top: max(108px * var(--base-ratio), 108 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}

.library_brochure_text {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}

.library_brochure_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_brochure_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .library_brochure_title {
    font-size: var(--fs-h3-mob);
  }
}
.library_brochure_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.library_brochure_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .library_brochure_desc {
    font-size: var(--fs-p1-tab);
  }
}
.library_brochure_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.library_brochure_buttons {
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.library_brochure_buttons .btn {
  overflow: hidden;
}
@media (hover: hover) {
  .library_brochure_buttons .btn:hover svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}

@media screen and (max-width: 1024px) {
  .newsroom_bg {
    height: 1098px;
  }
  .newsroom_featured {
    margin: 0 40px;
  }
  .newsroom_slider {
    border-radius: 8px;
  }
  .newsroom_slide {
    flex-direction: column;
    height: auto;
    border-radius: 8px;
  }
  .newsroom_slide_cover {
    width: 100%;
    height: 453px;
    flex-shrink: 0;
  }
  .newsroom_slide_content {
    flex: none;
    padding: 40px;
    justify-content: flex-start;
    gap: 24px;
  }
  .newsroom_slide_content_top {
    gap: 12px;
  }
  .newsroom_indicator {
    margin-top: 26px;
  }
  .newsroom_search {
    margin: 176px 40px 0;
  }
  .newsroom_search_box {
    width: 340px;
  }
  .newsroom_input {
    padding-right: 48px;
  }
  .newsroom_search_btn {
    right: 20px;
  }
  .newsroom_search_btn svg {
    width: 20px;
    height: 20px;
  }
  .newsroom_cards {
    margin: 32px 40px 0;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .newsroom_card {
    height: 200px;
    padding: 24px 20px;
  }
  .newsroom_card_top {
    gap: 8px;
  }
  .newsroom_card_arrow {
    width: 20px;
    height: 20px;
  }
  .newsroom_pagination {
    margin-top: 64px;
    padding-bottom: 160px;
  }
  .newsroom_empty {
    margin: 32px 40px 0;
    padding-bottom: 160px;
  }
  .newsroom_empty_box {
    padding: 160px 20px;
    gap: 10px;
  }
  .newsroom_view {
    margin: 0 40px;
    padding-top: 80px;
    padding-bottom: 160px;
  }
  .newsroom_view_title {
    margin-top: 10px;
  }
  .newsroom_view_date {
    margin-top: 20px;
  }
  .newsroom_view_body {
    margin-top: 36px;
    padding: 64px 0;
    gap: 36px;
  }
  .newsroom_view_summary {
    padding: 22px;
  }
  .newsroom_view_nav {
    padding-top: 48px;
  }
  .newsroom_view_prev,
  .newsroom_view_next {
    gap: 8px;
  }
  .newsroom_view_prev svg,
  .newsroom_view_next svg {
    width: 24px;
    height: 24px;
  }
  .library_bg {
    height: 1202px;
  }
  .library_video {
    margin: 0 40px;
    flex-direction: column;
    gap: 20px;
  }
  .library_video_player {
    width: 100%;
    height: 387px;
    border-radius: 8px;
  }
  .library_video_side {
    width: 100%;
    height: 437px;
  }
  .library_video_info {
    height: 166px;
    padding: 28px 32px;
    gap: 12px;
  }
  .library_video_info_scrollbar {
    right: -22px;
  }
  .library_video_list_inner {
    padding: 28px 32px;
  }
  .library_video_list_scrollbar {
    top: 28px;
    right: 10px;
    bottom: 28px;
  }
  .library_social {
    margin: 192px 40px 0;
    gap: 20px;
  }
  .library_social_grid {
    flex-wrap: wrap;
    gap: 20px;
  }
  .library_social_card {
    width: calc((100% - 20px) / 2);
  }
  .library_social_content {
    margin-top: 20px;
  }
  .library_social_thumb {
    height: auto;
    aspect-ratio: 334/188;
  }
  .library_brochure {
    height: 320px;
    margin-top: 160px;
  }
  .library_brochure_content {
    margin: 0 40px;
    padding-top: 88px;
    gap: 22px;
  }
  .library_brochure_text {
    gap: 10px;
  }
}
@media screen and (max-width: 767px) {
  .newsroom_list .intro_page_title_inner {
    padding: 120px 0 60px;
  }
  .newsroom_bg {
    height: 864px;
  }
  .newsroom_featured {
    margin: 0 20px;
  }
  .newsroom_slide_cover {
    height: 220px;
  }
  .newsroom_slide_content {
    padding: 24px 20px;
  }
  .newsroom_search {
    margin: 176px 20px 0;
  }
  .newsroom_search_box {
    width: 100%;
  }
  .newsroom_cards {
    margin: 32px 20px 0;
    grid-template-columns: 1fr;
  }
  .newsroom_empty {
    margin: 32px 20px 0;
  }
  .newsroom_view {
    margin: 0 20px;
  }
  .library .intro_page_title_inner {
    padding: 120px 0 60px;
  }
  .library_bg {
    height: 977px;
  }
  .library_video {
    margin: 0 20px;
    gap: 12px;
  }
  .library_video_player {
    height: 189px;
    border-radius: 4px;
  }
  .library_video_side {
    height: 418px;
    gap: 12px;
  }
  .library_video_info {
    height: 212px;
    border-radius: 4px;
    padding: 16px 20px;
    gap: 10px;
  }
  .library_video_info_scrollbar {
    right: -12px;
  }
  .library_video_list {
    border-radius: 4px;
  }
  .library_video_list_inner {
    padding: 16px 20px;
  }
  .library_video_list_scrollbar {
    top: 16px;
    right: 8px;
    bottom: 16px;
  }
  .library_video_list_fade {
    border-radius: 0 0 4px 4px;
  }
  .library_social {
    margin: 192px 20px 0;
  }
  .library_social_card {
    width: 100%;
  }
  .library_brochure {
    height: 398px;
  }
  .library_brochure_content {
    margin: 0 20px;
    padding-top: 80px;
  }
  .library_brochure_buttons {
    flex-direction: column;
    width: 180px;
  }
}
.page_error .wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100svh;
}

.page_error .content {
  flex: 1;
  display: flex;
}

.error_page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(50px * var(--base-ratio), 50 / var(--base-size) * var(--base-percent));
  flex: 1;
}
@media screen and (max-width: 1024px) {
  .error_page {
    gap: 40px;
  }
}
@media screen and (max-width: 767px) {
  .error_page {
    min-height: 664px;
  }
}

.error_content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(30px * var(--base-ratio), 30 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .error_content {
    gap: 24px;
  }
}

.error_icon {
  width: 80px;
  height: 80px;
}

.error_text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .error_text {
    gap: 12px;
  }
}

.error_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .error_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .error_title {
    font-size: var(--fs-h3-mob);
  }
}
.error_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  color: #161D27;
  letter-spacing: -0.02em;
}

.error_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .error_desc {
    font-size: var(--fs-p1-tab);
  }
}
.error_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  color: #6D6E72;
  letter-spacing: -0.02em;
}

.page_reporting .unethical {
  position: relative;
  background: #FFFFFF;
}
@media screen and (max-width: 767px) {
  .page_reporting .intro_page_title_inner {
    padding: 120px 0 60px;
  }
}
.page_reporting .unethical.is_with_tab .intro_page_title_inner {
  padding-bottom: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical.is_with_tab .intro_page_title_inner {
    padding-bottom: 32px;
  }
}
.page_reporting .unethical_tab_nav {
  display: flex;
  justify-content: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_tab_nav {
    gap: 8px;
  }
}
.page_reporting .unethical_tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  width: max(144px * var(--base-ratio), 144 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0;
  border: 1px solid #D1D2D4;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  color: #161D27;
  text-decoration: none;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_tab {
    font-size: 16px;
  }
}
.page_reporting .unethical_tab {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.page_reporting .unethical_tab.is_active {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_tab {
    gap: 4px;
    width: 126px;
    height: 52px;
  }
}
.page_reporting .unethical_notice_wrap {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_notice_wrap {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_notice_wrap {
    padding: 0 20px;
  }
}
.page_reporting .unethical_tab_nav + .unethical_notice_wrap {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_tab_nav + .unethical_notice_wrap {
    margin-top: 60px;
  }
}
.page_reporting .unethical_notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_notice {
    gap: 10px;
    padding: 32px 40px;
    border-radius: 8px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_notice {
    padding: 32px 20px;
  }
}
@media screen and (min-width: 1025px) {
  .page_reporting .unethical_notice.is_slim {
    padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  }
}
.page_reporting .unethical_inline_notice {
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) 0;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  text-align: center;
}
.page_reporting .unethical_inline_notice p {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_inline_notice p {
    font-size: 16px;
  }
}
.page_reporting .unethical_inline_notice p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_inline_notice {
    padding: 20px;
    border-radius: 8px;
  }
}
.page_reporting .unethical_notice_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_notice_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_notice_title {
    font-size: var(--fs-h4-mob);
  }
}
.page_reporting .unethical_notice_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_notice_lead {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_notice_lead {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_notice_lead {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .unethical_notice_lead {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_notice_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_notice_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_notice_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_reporting .unethical_section {
  position: relative;
  padding-top: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_section {
    padding-top: 96px;
  }
}
.page_reporting .unethical_list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_list.is_filled {
  border: none;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_list {
    width: 100%;
    gap: 24px;
    padding: 32px 40px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_list {
    padding: 28px 20px;
  }
}
.page_reporting .unethical_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  padding-bottom: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_reporting .unethical_item.is_last, .page_reporting .unethical_item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.page_reporting .unethical_item.is_note {
  padding-top: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding-bottom: 0;
  border-top: 1px solid #D1D2D4;
  border-bottom: none;
}
.page_reporting .unethical_item:has(+ .is_note), .page_reporting .unethical_item:has(+ .unethical_inline_notice) {
  padding-bottom: 0;
  border-bottom: none;
}
.page_reporting .unethical_item.is_wide_gap {
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_item {
    gap: 6px;
    padding-bottom: 24px;
  }
  .page_reporting .unethical_item.is_note {
    padding-top: 24px;
  }
  .page_reporting .unethical_item.is_wide_gap {
    gap: 16px;
  }
}
.page_reporting .unethical_item_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_item_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_item_title {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .unethical_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_item_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_item_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_item_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_reporting .unethical_ul {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_ul li {
  display: flex;
  align-items: flex-start;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_ul li {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_ul li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_reporting .unethical_ul li::before {
  content: "";
  flex-shrink: 0;
  width: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  height: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #6D6E72;
  margin-top: 0.65em;
}
.page_reporting .unethical_ul.is_small li {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_ul.is_small li {
    font-size: 16px;
  }
}
.page_reporting .unethical_ul.is_small li {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
}
.page_reporting .unethical_ul.has_bottom_space {
  padding-bottom: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_ul .is_accent {
  font-weight: 600;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_ul li {
    gap: 6px;
  }
  .page_reporting .unethical_ul li::before {
    width: 2px;
    height: 2px;
  }
  .page_reporting .unethical_ul.is_small li {
    font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_reporting .unethical_ul.is_small li {
    font-size: var(--fs-p1-tab);
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_ul.has_bottom_space {
    padding-bottom: 0;
  }
}
.page_reporting .unethical_note_lead {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_note_lead {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_note_lead {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_numbered_group {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_numbered {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_numbered {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_numbered {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_board {
  display: flex;
  flex-direction: column;
}
.page_reporting .unethical_board_header {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-top: 2px solid #025997;
  border-bottom: 1px solid #D1D2D4;
}
.page_reporting .unethical_board_header span {
  flex: 1;
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_board_header span {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_board_header span {
  letter-spacing: -0.02em;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_board_header {
    gap: 16px;
    height: 64px;
    padding: 0 20px;
  }
}
.page_reporting .unethical_board_row {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_reporting .unethical_board_row span {
  flex: 1;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_board_row span {
    font-size: 16px;
  }
}
.page_reporting .unethical_board_row span {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_board_row {
    gap: 16px;
    height: 64px;
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_board_row {
    height: auto;
    padding: 10px 20px;
  }
}
.page_reporting .unethical_method_section {
  position: relative;
  margin-top: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent));
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0 max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  background: #E8F3FE;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_method_section {
    margin-top: 128px;
    padding: 128px 0 48px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_method_section {
    padding: 128px 0 10px;
  }
}
.page_reporting .unethical_method_list {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_method_item {
  display: flex;
  flex-direction: column;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_method_item_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_method_item_title {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_method_item_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_method_sub {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_reporting .unethical_method_sub_title {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_method_sub_title {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .unethical_method_sub_title {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .unethical_cta {
  position: sticky;
  bottom: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
  background: #00A3F1;
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta {
    height: 80px;
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_cta {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    height: auto;
    padding: 16px 20px;
  }
}
.page_reporting .unethical_cta_text {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta_text {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_cta_text {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .unethical_cta_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.page_reporting .unethical_cta_buttons {
  display: flex;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta_buttons {
    gap: 6px;
  }
}
.page_reporting .unethical_cta_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: max(6px * var(--base-ratio), 6 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  padding: 0 max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: 999px;
  background: #FFFFFF;
  color: #161D27;
  text-decoration: none;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta_btn {
    font-size: 16px;
  }
}
.page_reporting .unethical_cta_btn {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.page_reporting .unethical_cta_btn .unethical_cta_btn_arrow {
  flex-shrink: 0;
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.page_reporting .unethical_cta_btn .unethical_cta_btn_arrow svg {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .page_reporting .unethical_cta_btn:hover .unethical_cta_btn_arrow svg {
    animation: arrow-slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta_btn:last-child {
    margin-right: 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_cta_btn:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical_cta_btn {
    gap: 4px;
    height: 52px;
    padding: 0 20px;
  }
  .page_reporting .unethical_cta_btn .unethical_cta_btn_arrow {
    width: 20px;
    height: 20px;
  }
  .page_reporting .unethical_cta_btn .unethical_cta_btn_arrow svg {
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_cta_btn {
    gap: 4px;
    height: 42px;
    padding: 0 16px;
    font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1024px) {
  .page_reporting .unethical_cta_btn {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical_cta_btn .unethical_cta_btn_arrow {
    width: 16px;
    height: 16px;
  }
  .page_reporting .unethical_cta_btn .unethical_cta_btn_arrow svg {
    width: 16px;
    height: 16px;
  }
}
.page_reporting .fair_trade_notice_link {
  color: #025997;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.page_reporting .fair_trade_caution_note {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .fair_trade_caution_note {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .fair_trade_caution_note {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .fair_trade_method_sub {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_reporting .fair_trade_method_sub_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .fair_trade_method_sub_label {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .fair_trade_method_sub_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 767px) {
  .page_reporting .unethical.is_fair_trade .unethical_method_section {
    margin-top: 138px;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .unethical.is_fair_trade .unethical_method_item {
    gap: 6px;
  }
}
.page_reporting .report {
  position: relative;
  background: #FFFFFF;
  padding-bottom: max(200px * var(--base-ratio), 200 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report {
    padding-bottom: 160px;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .report .unethical_notice {
    padding: 48px 40px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report .unethical_notice {
    padding: 48px 16px;
  }
}
.page_reporting .report_notice_lead {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_notice_lead {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_notice_lead {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .report_notice_lead {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_notice_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_notice_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .report_notice_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_section_inner {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_section_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_section_inner {
    padding: 0 20px;
  }
}
.page_reporting .report_section_heading {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_section_heading {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_section_heading {
    font-size: var(--fs-h3-mob);
  }
}
.page_reporting .report_section_heading {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_type_list {
  display: flex;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_type_list.is_dual {
  width: max(722px * var(--base-ratio), 722 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_type_list.is_dual {
    width: 338px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_type_list.is_dual {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_type_list {
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_type_list {
    flex-wrap: wrap;
  }
}
.page_reporting .report_tab {
  display: none;
}
.page_reporting .report_tab.is_active {
  display: block;
}
.page_reporting .report_type {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: max(108px * var(--base-ratio), 108 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  color: #161D27;
  text-align: center;
  text-decoration: none;
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_type {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_type {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .report_type {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.page_reporting .report_type.is_active {
  background: #025997;
  border-color: #025997;
  color: #FFFFFF;
  font-weight: 700;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_type {
    height: 80px;
    padding: 0 16px;
    border-radius: 6px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_type {
    flex: 0 0 calc(50% - 6px);
  }
}
.page_reporting .report_form_col {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.page_reporting .report_form_required {
  color: #D60F0F;
}
.page_reporting .report_form_required_note {
  text-align: right;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_required_note {
    font-size: 16px;
  }
}
.page_reporting .report_form_required_note {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_reporting .report_form {
  margin-top: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border-top: 2px solid #025997;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form {
    margin-top: 16px;
  }
}
.page_reporting .report_form_row {
  display: flex;
  align-items: flex-start;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent)) max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  min-height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  border-bottom: 1px solid #D1D2D4;
}
.page_reporting .report_form_row .report_form_content:has(.report_radio_group) {
  align-self: center;
}
@media screen and (max-width: 767px) {
  .page_reporting .report_form_row .report_form_content:has(.report_radio_group) {
    align-self: stretch;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_row {
    padding: 24px 16px;
    gap: 12px;
  }
  .page_reporting .report_form_row.is_captcha {
    padding: 20px 16px;
    min-height: 0;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_form_row {
    flex-direction: column;
    align-items: stretch;
  }
}
.page_reporting .report_form_title {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_title {
    font-size: 16px;
  }
}
.page_reporting .report_form_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_title {
    width: 125px;
    height: 52px;
    gap: 2px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_form_title {
    height: auto;
  }
}
.page_reporting .report_form_content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_form_help {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_help {
    font-size: 14px;
  }
}
.page_reporting .report_form_help {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #818286;
}
.page_reporting .report_radio_group {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .page_reporting .report_radio_group {
    flex-wrap: wrap;
    gap: 12px 20px;
  }
}
.page_reporting .report .radio_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report .radio_label {
    font-size: 16px;
  }
}
.page_reporting .report .radio_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report .radio_input:checked ~ .radio_label {
  font-weight: 600;
  color: #025997;
}
.page_reporting .report_textarea {
  display: block;
  width: 100%;
  min-height: max(240px * var(--base-ratio), 240 / var(--base-size) * var(--base-percent));
  padding: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_textarea {
    font-size: 16px;
  }
}
.page_reporting .report_textarea {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  resize: vertical;
}
.page_reporting .report_textarea::placeholder {
  color: #818286;
}
.page_reporting .report_textarea:focus {
  border: 2px solid #025997;
  outline: none;
}
.page_reporting .report_files {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_files {
    gap: 12px;
  }
}
.page_reporting .report_file_row {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .page_reporting .report_file_row {
    flex-direction: column;
    align-items: stretch;
  }
}
.page_reporting .report_file_input {
  width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_file_input {
    width: 272px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_file_input {
    width: 100%;
  }
}
.page_reporting .report_file_actions {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 767px) {
  .page_reporting .report_file_actions {
    align-self: flex-start;
  }
}
.page_reporting .report_file_btn {
  flex-shrink: 0;
}
@media (hover: hover) {
  .page_reporting .report_file_btn:hover {
    background-color: #6D6E72;
    border-color: #6D6E72;
  }
}
.page_reporting .report_icon_btn {
  flex-shrink: 0;
  width: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #D1D2D4;
  border-radius: 50%;
  background: #FFFFFF;
  cursor: pointer;
  padding: 0;
}
.page_reporting .report_icon_btn img {
  display: block;
}
.page_reporting .report_icon_btn.is_plus img, .page_reporting .report_icon_btn.is_minus img {
  width: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  height: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_icon_btn.is_refresh img {
  width: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  height: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media (hover: hover) {
  .page_reporting .report_icon_btn:hover {
    background: #E7E7E9;
    border-color: transparent;
  }
}
.page_reporting .report_icon_btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
@media (hover: hover) {
  .page_reporting .report_icon_btn:disabled:hover {
    background: #FFFFFF;
    border-color: #D1D2D4;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_icon_btn {
    width: 52px;
    height: 52px;
  }
  .page_reporting .report_icon_btn.is_plus img, .page_reporting .report_icon_btn.is_minus img {
    width: 24px;
    height: 24px;
  }
  .page_reporting .report_icon_btn.is_refresh img {
    width: 20px;
    height: 20px;
  }
}
.page_reporting .report_captcha_row {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_captcha_row {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_captcha_row {
    align-items: stretch;
  }
}
.page_reporting .report_captcha_actions {
  display: flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_captcha_input {
  width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_captcha_input {
    width: 340px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_captcha_input {
    width: 100%;
  }
}
.page_reporting .report_captcha_image {
  width: max(230px * var(--base-ratio), 230 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  flex-shrink: 0;
  object-fit: cover;
  display: block;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_captcha_image {
    width: 199px;
    height: 52px;
  }
}
.page_reporting .report_password_input {
  width: max(360px * var(--base-ratio), 360 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_password_input {
    width: 340px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_password_input {
    width: 100%;
  }
}
.page_reporting .report_privacy {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy {
    margin-top: 56px;
  }
}
.page_reporting .report_privacy_head {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_head {
    gap: 4px;
  }
}
.page_reporting .report_privacy_title {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_title {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_privacy_title {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .report_privacy_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_privacy_desc {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_desc {
    font-size: 16px;
  }
}
.page_reporting .report_privacy_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_reporting .report_privacy_box {
  margin-top: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_privacy_box p {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_box p {
    font-size: 16px;
  }
}
.page_reporting .report_privacy_box p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_privacy_box p strong {
  font-weight: 700;
}
.page_reporting .report_privacy_box .report_privacy_item {
  display: flex;
  flex-direction: column;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_privacy_box .report_privacy_note {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_box .report_privacy_note {
    font-size: 14px;
  }
}
.page_reporting .report_privacy_box .report_privacy_note {
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_box {
    margin-top: 20px;
    padding: 28px;
    border-radius: 12px;
    gap: 10px;
  }
  .page_reporting .report_privacy_box .report_privacy_item {
    gap: 10px;
  }
}
.page_reporting .report_privacy_check {
  margin-top: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
  display: inline-flex;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_check {
    margin-top: 16px;
    gap: 8px;
  }
}
.page_reporting .report_privacy_check_label {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_privacy_check_label {
    font-size: 16px;
  }
}
.page_reporting .report_privacy_check_label {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_outro {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_outro {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_outro {
    padding: 0 20px;
  }
}
.page_reporting .report_divider {
  display: block;
  width: 100%;
  height: 1px;
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  background: #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_divider {
    margin-top: 48px;
  }
}
.page_reporting .report_bottom {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(24px * var(--base-ratio), 24 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_bottom {
    margin-top: 64px;
    gap: 20px;
  }
}
.page_reporting .report_bottom_text {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_bottom_text {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_bottom_text {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .report_bottom_text {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.page_reporting .report_bottom_buttons {
  display: flex;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_bottom_buttons {
    gap: 10px;
  }
}
@media (hover: hover) {
  .page_reporting .report_bottom_buttons .btn_primary:not(.is_active):hover {
    background-color: #6D6E72;
    border-color: #6D6E72;
  }
}
.page_reporting .report_complete_inner {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_complete_inner {
    padding: 0 20px;
  }
}
.page_reporting .report_complete_notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice {
    gap: 10px;
    padding: 48px 40px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_complete_notice {
    padding: 48px 16px;
  }
}
.page_reporting .report_complete_notice_title {
  font-size: round(down, max(var(--fs-h3-pc) * 1px * var(--base-ratio), var(--fs-h3-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_title {
    font-size: var(--fs-h3-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_complete_notice_title {
    font-size: var(--fs-h3-mob);
  }
}
.page_reporting .report_complete_notice_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_title {
    display: none;
  }
}
.page_reporting .report_complete_notice_text {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_text {
    gap: 10px;
  }
}
.page_reporting .report_complete_notice_lead {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_lead {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .report_complete_notice_lead {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .report_complete_notice_lead {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .report_complete_notice_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .report_complete_notice_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_notice_desc {
    color: #161D27;
  }
}
.page_reporting .report_complete_actions {
  display: flex;
  justify-content: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_complete_actions {
    gap: 10px;
    margin-top: 48px;
  }
}
.page_reporting .view_result_inner {
  padding: 0 max(228px * var(--base-ratio), 228 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_inner {
    padding: 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_inner {
    padding: 0 20px;
  }
}
.page_reporting .view_result_notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_notice {
    gap: 10px;
    padding: 48px 40px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_notice {
    padding: 48px 16px;
  }
}
.page_reporting .view_result_notice_lead {
  font-size: round(down, max(var(--fs-h5-pc) * 1px * var(--base-ratio), var(--fs-h5-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_notice_lead {
    font-size: var(--fs-h5-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_notice_lead {
    font-size: var(--fs-h5-mob);
  }
}
.page_reporting .view_result_notice_lead {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .view_result_notice_desc {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_notice_desc {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .view_result_notice_desc {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_notice_desc {
    color: #161D27;
  }
}
.page_reporting .view_result_form {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form {
    margin-top: 48px;
  }
}
.page_reporting .view_result_form_box {
  padding: max(120px * var(--base-ratio), 120 / var(--base-size) * var(--base-percent)) 0;
  border-top: 2px solid #025997;
  border-bottom: 1px solid #D1D2D4;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_box {
    padding: 96px 0;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_form_box {
    padding: 60px 0;
  }
}
.page_reporting .view_result_form_inner {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  width: max(720px * var(--base-ratio), 720 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_inner {
    width: 608px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_form_inner {
    width: 306px;
  }
}
.page_reporting .view_result_form_row {
  display: flex;
  align-items: flex-start;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_row {
    gap: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_form_row {
    flex-direction: column;
    align-items: stretch;
  }
}
.page_reporting .view_result_form_title {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  width: max(126px * var(--base-ratio), 126 / var(--base-size) * var(--base-percent));
  height: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_title {
    font-size: 16px;
  }
}
.page_reporting .view_result_form_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_title {
    width: 126px;
    height: 60px;
    gap: 4px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_form_title {
    width: auto;
    height: auto;
  }
}
.page_reporting .view_result_form_required {
  color: #D60F0F;
}
.page_reporting .view_result_form_content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_content {
    gap: 12px;
  }
}
.page_reporting .view_result_form_help {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_form_help {
    font-size: 14px;
  }
}
.page_reporting .view_result_form_help {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
@media screen and (max-width: 767px) {
  .page_reporting .view_result_form_help {
    word-break: break-all;
  }
  :lang(en) .page_reporting .view_result_form_help {
    word-break: keep-all;
  }
}
.page_reporting .view_result_actions {
  display: flex;
  justify-content: center;
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_result_actions {
    margin-top: 48px;
  }
}
.page_reporting .view_detail {
  position: relative;
}
.page_reporting .view_detail_top {
  background: #E8F3FE;
  padding: max(160px * var(--base-ratio), 160 / var(--base-size) * var(--base-percent)) 0;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_top {
    padding: 128px 0;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_top {
    padding: 128px 20px;
  }
}
.page_reporting .view_detail_inner {
  width: max(1166px * var(--base-ratio), 1166 / var(--base-size) * var(--base-percent));
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_inner {
    width: 688px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_inner {
    width: 100%;
  }
}
.page_reporting .view_detail_top .view_detail_inner {
  display: flex;
  flex-direction: column;
  gap: max(28px * var(--base-ratio), 28 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_top .view_detail_inner {
    gap: 28px;
  }
}
.page_reporting .view_detail_view {
  background: #FFFFFF;
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  padding: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent)) max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  display: flex;
  flex-direction: column;
  gap: max(48px * var(--base-ratio), 48 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_view {
    border-radius: 10px;
    padding: 64px 32px 80px;
    gap: 38px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_view {
    padding: 52px 20px 64px;
  }
}
.page_reporting .view_detail_title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_title {
    gap: 8px;
  }
}
.page_reporting .view_detail_label {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_label {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .view_detail_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #025997;
}
.page_reporting .view_detail_subject {
  font-size: round(down, max(var(--fs-h2-pc) * 1px * var(--base-ratio), var(--fs-h2-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_subject {
    font-size: var(--fs-h2-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_subject {
    font-size: var(--fs-h2-mob);
  }
}
.page_reporting .view_detail_subject {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.page_reporting .view_detail_info {
  display: flex;
  flex-wrap: wrap;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent)) max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #F3F3F3;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_info {
    gap: 16px 24px;
    padding: 32px 40px;
    border-radius: 10px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_info {
    gap: 12px;
    padding: 28px 20px;
  }
}
.page_reporting .view_detail_info_cell {
  width: calc((100% - max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent))) / 2);
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (min-width: 1025px) {
  html[lang=en] .page_reporting .view_detail_info_cell:nth-child(even) .view_detail_info_label {
    width: max(150px * var(--base-ratio), 150 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_info_cell {
    width: calc((100% - 24px) / 2);
    gap: 16px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_info_cell {
    width: 100%;
  }
}
.page_reporting .view_detail_info_label {
  flex-shrink: 0;
  width: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_info_label {
    font-size: 16px;
  }
}
.page_reporting .view_detail_info_label {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_info_label {
    width: 88px;
  }
}
.page_reporting .view_detail_info_value {
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_info_value {
    font-size: 16px;
  }
}
.page_reporting .view_detail_info_value {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #6D6E72;
}
.page_reporting .view_detail_body {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_body {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .view_detail_body {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
  text-align: center;
}
.page_reporting .view_detail_file {
  display: flex;
  align-items: center;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: 0 max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
  border-radius: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_file {
    gap: 16px;
    height: 80px;
    padding: 0 32px;
    border-radius: 10px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_file {
    gap: 20px;
    height: auto;
    padding: 26px 20px;
    align-items: flex-start;
  }
}
.page_reporting .view_detail_file_title {
  flex-shrink: 0;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_file_title {
    font-size: 16px;
  }
}
.page_reporting .view_detail_file_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .view_detail_file_list {
  display: flex;
  flex-wrap: wrap;
  gap: max(8px * var(--base-ratio), 8 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_file_list {
    gap: 6px;
  }
}
.page_reporting .view_detail_file_item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: max(32px * var(--base-ratio), 32 / var(--base-size) * var(--base-percent));
  padding: 0 max(10px * var(--base-ratio), 10 / var(--base-size) * var(--base-percent));
  border: 1px solid #D1D2D4;
  border-radius: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  background: #FFFFFF;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_file_item {
    font-size: 14px;
  }
}
.page_reporting .view_detail_file_item {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6D6E72;
  text-decoration: none;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_file_item {
    min-height: 28px;
    padding: 0 8px;
    border-radius: 2px;
  }
}
.page_reporting .view_detail_reply {
  margin-top: max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply {
    margin-top: 64px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_reply {
    padding: 0 20px;
  }
}
.page_reporting .view_detail_reply .view_detail_inner {
  display: flex;
  flex-direction: column;
  gap: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply .view_detail_inner {
    gap: 16px;
  }
}
.page_reporting .view_detail_reply_title {
  font-size: round(down, max(var(--fs-h4-pc) * 1px * var(--base-ratio), var(--fs-h4-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply_title {
    font-size: var(--fs-h4-tab);
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_reply_title {
    font-size: var(--fs-h4-mob);
  }
}
.page_reporting .view_detail_reply_title {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #161D27;
}
.page_reporting .view_detail_reply_answer {
  display: flex;
  flex-direction: column;
  gap: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply_answer {
    gap: 10px;
  }
}
.page_reporting .view_detail_reply_box {
  background: #F3F3F3;
  border-radius: max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent));
  padding: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent)) max(80px * var(--base-ratio), 80 / var(--base-size) * var(--base-percent));
}
.page_reporting .view_detail_reply_box p {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply_box p {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .view_detail_reply_box p {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #161D27;
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply_box {
    padding: 32px 40px;
    border-radius: 12px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail_reply_box {
    padding: 28px 20px;
  }
}
.page_reporting .view_detail_reply_date {
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_reply_date {
    font-size: 14px;
  }
}
.page_reporting .view_detail_reply_date {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #818286;
  text-align: right;
}
.page_reporting .view_detail_actions {
  display: flex;
  justify-content: center;
  margin-top: max(40px * var(--base-ratio), 40 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail_actions {
    margin-top: 32px;
  }
}
.page_reporting .view_detail .unethical_cta {
  margin-top: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .view_detail .unethical_cta {
    margin-top: 80px;
  }
}
@media screen and (max-width: 767px) {
  .page_reporting .view_detail .unethical_cta {
    margin-top: 42px;
  }
}
.page_reporting .result_board {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board {
    margin-top: 48px;
  }
}
.page_reporting .result_board .board_list_head {
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
.page_reporting .result_board .board_list_item {
  height: max(100px * var(--base-ratio), 100 / var(--base-size) * var(--base-percent));
  padding: 0 max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_item {
    height: auto;
    padding: 24px 0;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
}
.page_reporting .result_board .board_list_num {
  color: #6D6E72;
}
.page_reporting .result_board .board_list_head .board_list_num {
  color: #161D27;
}
.page_reporting .result_board .board_list_type {
  flex-shrink: 0;
  width: max(180px * var(--base-ratio), 180 / var(--base-size) * var(--base-percent));
  text-align: center;
  font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_type {
    font-size: 16px;
  }
}
.page_reporting .result_board .board_list_type {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #025997;
}
@media screen and (min-width: 1025px) {
  html[lang=en] .page_reporting .result_board .board_list_type {
    width: max(320px * var(--base-ratio), 320 / var(--base-size) * var(--base-percent));
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_type {
    width: auto;
    text-align: left;
  }
}
.page_reporting .result_board .board_list_type_sub {
  display: block;
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_type_sub {
    display: inline;
  }
}
.page_reporting .result_board .board_list_head .board_list_type {
  font-size: round(down, max(var(--fs-p1-pc) * 1px * var(--base-ratio), var(--fs-p1-pc) / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_head .board_list_type {
    font-size: var(--fs-p1-tab);
  }
}
.page_reporting .result_board .board_list_head .board_list_type {
  letter-spacing: -0.02em;
  font-weight: 700;
  line-height: 1.5;
  color: #161D27;
}
.page_reporting .result_board .board_list_title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_title {
    text-align: left;
    align-self: stretch;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.page_reporting .result_board .board_list_date {
  width: max(140px * var(--base-ratio), 140 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_date {
    display: flex;
    align-items: center;
    gap: 6px;
    width: auto;
    text-align: left;
    font-size: round(down, max(18px * var(--base-ratio), 18 / var(--base-size) * var(--base-percent)), 1px);
    letter-spacing: -0.02em;
    font-weight: 400;
    line-height: 1.3;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .page_reporting .result_board .board_list_date {
    font-size: 16px;
  }
}
.page_reporting .result_board .board_list_meta {
  display: contents;
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-top: 4px;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .page_reporting .result_board .board_list_meta {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 4px;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_date + .board_list_date {
    padding-left: 16px;
    border-left: 1px solid #D1D2D4;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .page_reporting .result_board .board_list_date + .board_list_date {
    padding-left: 0;
    border-left: 0;
  }
}
.page_reporting .result_board .board_list_date_label {
  display: none;
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_date_label {
    display: inline;
    color: #161D27;
  }
}
@media screen and (max-width: 767px) {
  html[lang=en] .page_reporting .result_board .board_list_date_label {
    flex-shrink: 0;
    width: 130px;
  }
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board .board_list_date_value {
    color: #6D6E72;
  }
}
.page_reporting .result_board + .pagination {
  margin-top: max(60px * var(--base-ratio), 60 / var(--base-size) * var(--base-percent));
}
@media screen and (max-width: 1024px) {
  .page_reporting .result_board + .pagination {
    margin-top: 48px;
  }
}
.page_reporting .report_form_error {
  display: flex;
  align-items: center;
  gap: max(4px * var(--base-ratio), 4 / var(--base-size) * var(--base-percent));
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: round(down, max(16px * var(--base-ratio), 16 / var(--base-size) * var(--base-percent)), 1px);
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_error {
    font-size: 14px;
  }
}
.page_reporting .report_form_error {
  letter-spacing: -0.02em;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #D60F0F;
}
.page_reporting .report_form_error::before {
  content: "";
  flex-shrink: 0;
  width: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  height: max(20px * var(--base-ratio), 20 / var(--base-size) * var(--base-percent));
  background: url("/images/icons/ico_alert_circle.svg") center/contain no-repeat;
}
.page_reporting .report_form_error:empty {
  display: none;
}
@media screen and (max-width: 1024px) {
  .page_reporting .report_form_error {
    gap: 4px;
    line-height: 1.3;
  }
}
.page_reporting .report_section_inner > .report_form_error,
.page_reporting .report_privacy > .report_form_error {
  margin-top: max(12px * var(--base-ratio), 12 / var(--base-size) * var(--base-percent));
}
.page_reporting .report_type_list.is_error .report_type:not(.is_active) {
  border-color: #D60F0F;
}
.page_reporting .report_textarea.is_error {
  border: 2px solid #D60F0F;
}
.page_reporting .checkbox.is_error .checkbox_box {
  border: 2px solid #D60F0F;
}
.page_reporting .report_input.is_error,
.page_reporting .report_textarea.is_error {
  color: #D60F0F;
}

.report_loading {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.8);
}
.report_loading[hidden] {
  display: none;
}

.report_loading_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.report_loading_spinner {
  display: block;
  width: 60px;
  height: 60px;
}
.report_loading_spinner svg {
  width: 100%;
  height: 100%;
  transform-origin: 50% 50%;
  animation: spin 1s linear infinite;
}

.report_loading_arc {
  background: conic-gradient(from 90deg, #E8F3FE 0deg, #00A3F1 360deg);
  height: 100%;
  width: 100%;
}

.board_list_empty {
  padding: 48px 0;
  text-align: center;
  color: #666;
}

.report_loading_text {
  font-weight: 600;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-align: center;
  margin: 0;
}