/*
 * variables
 */
:root {
  --main-color: #222;
  --border-color: rgba(0, 0, 0, 0.1);
  --font-weight-bold: 700;
}
html {
  min-height: 100vh;
  scroll-behavior: smooth;
}
body {
  font-family: 'Inter', 'Noto sans jp', 'Microsoft Yahei';
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  position: relative;
  z-index: 0;
  color: var(--meltline-color-base-foreground-default);
  overflow-x: hidden;
}
main {
  flex: 1 0 auto;
}
a .hover-link-underline {
  background-image: linear-gradient(var(--meltline-color-primary), var(--meltline-color-primary));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size 0.3s, color 0.3s;
}
a:hover .hover-link-underline {
  background-size: 100% 1px;
  color: var(--meltline-color-primary);
}
a:hover .hover-blank-icon {
  background-color: var(--meltline-color-primary);
}
.hover-blank-icon {
  display: inline-block;
  vertical-align: middle;
  mask-image: url("../../image/common/blank.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
  background-color: var(--meltline-color-base-foreground-default);
}
[id] {
  scroll-margin-top: 72px;
}
:root {
  --meltline-color-base-container-accent: #f9fbfc;
}
.text-base-container-accent {
  color: #f9fbfc !important;
}
.bg-base-container-accent {
  background-color: #f9fbfc !important;
}
.border-base-container-accent {
  border-color: #f9fbfc !important;
}
:root {
  --meltline-color-base-container-deep: #464646;
}
.text-base-container-deep {
  color: #464646 !important;
}
.bg-base-container-deep {
  background-color: #464646 !important;
}
.border-base-container-deep {
  border-color: #464646 !important;
}
:root {
  --meltline-color-base-container-default: #ffffff;
}
.text-base-container-default {
  color: #ffffff !important;
}
.bg-base-container-default {
  background-color: #ffffff !important;
}
.border-base-container-default {
  border-color: #ffffff !important;
}
:root {
  --meltline-color-base-container-muted: #f1f1f1;
}
.text-base-container-muted {
  color: #f1f1f1 !important;
}
.bg-base-container-muted {
  background-color: #f1f1f1 !important;
}
.border-base-container-muted {
  border-color: #f1f1f1 !important;
}
:root {
  --meltline-color-base-foreground-accent: #464646;
}
.text-base-foreground-accent {
  color: #464646 !important;
}
.bg-base-foreground-accent {
  background-color: #464646 !important;
}
.border-base-foreground-accent {
  border-color: #464646 !important;
}
:root {
  --meltline-color-base-foreground-default: #1e1e1e;
}
.text-base-foreground-default {
  color: #1e1e1e !important;
}
.bg-base-foreground-default {
  background-color: #1e1e1e !important;
}
.border-base-foreground-default {
  border-color: #1e1e1e !important;
}
:root {
  --meltline-color-base-foreground-muted: #757575;
}
.text-base-foreground-muted {
  color: #757575 !important;
}
.bg-base-foreground-muted {
  background-color: #757575 !important;
}
.border-base-foreground-muted {
  border-color: #757575 !important;
}
:root {
  --meltline-color-base-foreground-on-fill: #ffffff;
}
.text-base-foreground-on-fill {
  color: #ffffff !important;
}
.bg-base-foreground-on-fill {
  background-color: #ffffff !important;
}
.border-base-foreground-on-fill {
  border-color: #ffffff !important;
}
:root {
  --meltline-color-base-foreground-subtle: #b8b8b8;
}
.text-base-foreground-subtle {
  color: #b8b8b8 !important;
}
.bg-base-foreground-subtle {
  background-color: #b8b8b8 !important;
}
.border-base-foreground-subtle {
  border-color: #b8b8b8 !important;
}
:root {
  --meltline-color-base-stroke-default: #d6d6d6;
}
.text-base-stroke-default {
  color: #d6d6d6 !important;
}
.bg-base-stroke-default {
  background-color: #d6d6d6 !important;
}
.border-base-stroke-default {
  border-color: #d6d6d6 !important;
}
:root {
  --meltline-color-base-stroke-muted: #ffffff;
}
.text-base-stroke-muted {
  color: #ffffff !important;
}
.bg-base-stroke-muted {
  background-color: #ffffff !important;
}
.border-base-stroke-muted {
  border-color: #ffffff !important;
}
:root {
  --meltline-color-base-stroke-subtle: #eaeaea;
}
.text-base-stroke-subtle {
  color: #eaeaea !important;
}
.bg-base-stroke-subtle {
  background-color: #eaeaea !important;
}
.border-base-stroke-subtle {
  border-color: #eaeaea !important;
}
:root {
  --meltline-color-base-surface-deep: #00223a;
}
.text-base-surface-deep {
  color: #00223a !important;
}

.border-base-surface-deep {
  border-color: #00223a !important;
}
:root {
  --meltline-color-base-surface-default: #ffffff;
}
.text-base-surface-default {
  color: #ffffff !important;
}
.bg-base-surface-default {
  background-color: #ffffff !important;
}
.border-base-surface-default {
  border-color: #ffffff !important;
}
:root {
  --meltline-color-base-surface-subtle: #f1f1f1;
}
.text-base-surface-subtle {
  color: #f1f1f1 !important;
}
.bg-base-surface-subtle {
  background-color: #f1f1f1 !important;
}
.border-base-surface-subtle {
  border-color: #f1f1f1 !important;
}
:root {
  --meltline-color-primary: #0a539d;
}
.text-primary {
  color: #0a539d !important;
}
.bg-primary {
  background-color: #0a539d !important;
}
.border-primary {
  border-color: #0a539d !important;
}
:root {
  --meltline-color-primary-on-fill: #ffffff;
}
.text-primary-on-fill {
  color: #ffffff !important;
}
.bg-primary-on-fill {
  background-color: #ffffff !important;
}
.border-primary-on-fill {
  border-color: #ffffff !important;
}
:root {
  --meltline-color-destructive: #ef4444;
}
.text-destructive {
  color: #ef4444 !important;
}
.bg-destructive {
  background-color: #ef4444 !important;
}
.border-destructive {
  border-color: #ef4444 !important;
}
:root {
  --meltline-color-destructive-on-fill: #fef2f2;
}
.text-destructive-on-fill {
  color: #fef2f2 !important;
}
.bg-destructive-on-fill {
  background-color: #fef2f2 !important;
}
.border-destructive-on-fill {
  border-color: #fef2f2 !important;
}
:root {
  --meltline-color-illustration: #3d6188;
}
.text-illustration {
  color: #3d6188 !important;
}
.bg-illustration {
  background-color: #3d6188 !important;
}
.border-illustration {
  border-color: #3d6188 !important;
}
:root {
  --meltline-color-success: #16a34a;
}
.text-success {
  color: #16a34a !important;
}
.bg-success {
  background-color: #16a34a !important;
}
.border-success {
  border-color: #16a34a !important;
}
:root {
  --meltline-color-success-on-fill: #f0fdf4;
}
.text-success-on-fill {
  color: #f0fdf4 !important;
}
.bg-success-on-fill {
  background-color: #f0fdf4 !important;
}
.border-success-on-fill {
  border-color: #f0fdf4 !important;
}
:root {
  --meltline-color-base-container-default-dark-80: #CECECE;
}
.text-base-container-default-dark-80 {
  color: #CECECE !important;
}
.bg-base-container-default-dark-80 {
  background-color: #CECECE !important;
}
.border-base-container-default-dark-80 {
  border-color: #CECECE !important;
}
:root {
  --meltline-color-base-container-default-dark-90: #E1E3E4;
}
.text-base-container-default-dark-90 {
  color: #E1E3E4 !important;
}
.bg-base-container-default-dark-90 {
  background-color: #E1E3E4 !important;
}
.border-base-container-default-dark-90 {
  border-color: #E1E3E4 !important;
}
:root {
  --meltline-color-primary-bright-90: #2364A7;
}
.text-primary-bright-90 {
  color: #2364A7 !important;
}
.bg-primary-bright-90 {
  background-color: #2364A7 !important;
}
.border-primary-bright-90 {
  border-color: #2364A7 !important;
}
:root {
  --meltline-color-base-foreground-on-fill-dark-90: #E6E6E7;
}
.text-base-foreground-on-fill-dark-90 {
  color: #E6E6E7 !important;
}
.bg-base-foreground-on-fill-dark-90 {
  background-color: #E6E6E7 !important;
}
.border-base-foreground-on-fill-dark-90 {
  border-color: #E6E6E7 !important;
}
:root {
  --meltline-color-primary-inverse-10: rgba(10, 83, 157, 0.1);
}
.bg-primary-inverse-10 {
  background-color: rgba(10, 83, 157, 0.1) !important;
}
.border-primary-inverse-10 {
  border-color: rgba(10, 83, 157, 0.1) !important;
}
:root {
  --meltline-color-primary-inverse-20: rgba(10, 83, 157, 0.2);
}
.bg-primary-inverse-20 {
  background-color: rgba(10, 83, 157, 0.2) !important;
}
.border-primary-inverse-20 {
  border-color: rgba(10, 83, 157, 0.2) !important;
}
:root {
  --meltline-color-primary-inverse-30: rgba(10, 83, 157, 0.3);
}
.bg-primary-inverse-30 {
  background-color: rgba(10, 83, 157, 0.3) !important;
}
.border-primary-inverse-30 {
  border-color: rgba(10, 83, 157, 0.3) !important;
}
:root {
  --meltline-color-primary-inverse-40: rgba(10, 83, 157, 0.4);
}
.bg-primary-inverse-40 {
  background-color: rgba(10, 83, 157, 0.4) !important;
}
.border-primary-inverse-40 {
  border-color: rgba(10, 83, 157, 0.4) !important;
}
:root {
  --meltline-color-primary-inverse-50: rgba(10, 83, 157, 0.5);
}
.bg-primary-inverse-50 {
  background-color: rgba(10, 83, 157, 0.5) !important;
}
.border-primary-inverse-50 {
  border-color: rgba(10, 83, 157, 0.5) !important;
}
:root {
  --meltline-color-primary-inverse-60: rgba(10, 83, 157, 0.6);
}
.bg-primary-inverse-60 {
  background-color: rgba(10, 83, 157, 0.6) !important;
}
.border-primary-inverse-60 {
  border-color: rgba(10, 83, 157, 0.6) !important;
}
:root {
  --meltline-color-primary-inverse-70: rgba(10, 83, 157, 0.7);
}
.bg-primary-inverse-70 {
  background-color: rgba(10, 83, 157, 0.7) !important;
}
.border-primary-inverse-70 {
  border-color: rgba(10, 83, 157, 0.7) !important;
}
:root {
  --meltline-color-primary-inverse-80: rgba(10, 83, 157, 0.8);
}
.bg-primary-inverse-80 {
  background-color: rgba(10, 83, 157, 0.8) !important;
}
.border-primary-inverse-80 {
  border-color: rgba(10, 83, 157, 0.8) !important;
}
:root {
  --meltline-color-primary-inverse-90: rgba(10, 83, 157, 0.9);
}
.bg-primary-inverse-90 {
  background-color: rgba(10, 83, 157, 0.9) !important;
}
.border-primary-inverse-90 {
  border-color: rgba(10, 83, 157, 0.9) !important;
}
:root {
  --meltline-color-success-inverse-10: rgba(22, 163, 74, 0.1);
}
.bg-success-inverse-10 {
  background-color: rgba(22, 163, 74, 0.1) !important;
}
.border-success-inverse-10 {
  border-color: rgba(22, 163, 74, 0.1) !important;
}
:root {
  --meltline-color-success-inverse-20: rgba(22, 163, 74, 0.2);
}
.bg-success-inverse-20 {
  background-color: rgba(22, 163, 74, 0.2) !important;
}
.border-success-inverse-20 {
  border-color: rgba(22, 163, 74, 0.2) !important;
}
:root {
  --meltline-color-success-inverse-30: rgba(22, 163, 74, 0.3);
}
.bg-success-inverse-30 {
  background-color: rgba(22, 163, 74, 0.3) !important;
}
.border-success-inverse-30 {
  border-color: rgba(22, 163, 74, 0.3) !important;
}
:root {
  --meltline-color-success-inverse-40: rgba(22, 163, 74, 0.4);
}
.bg-success-inverse-40 {
  background-color: rgba(22, 163, 74, 0.4) !important;
}
.border-success-inverse-40 {
  border-color: rgba(22, 163, 74, 0.4) !important;
}
:root {
  --meltline-color-success-inverse-50: rgba(22, 163, 74, 0.5);
}
.bg-success-inverse-50 {
  background-color: rgba(22, 163, 74, 0.5) !important;
}
.border-success-inverse-50 {
  border-color: rgba(22, 163, 74, 0.5) !important;
}
:root {
  --meltline-color-success-inverse-60: rgba(22, 163, 74, 0.6);
}
.bg-success-inverse-60 {
  background-color: rgba(22, 163, 74, 0.6) !important;
}
.border-success-inverse-60 {
  border-color: rgba(22, 163, 74, 0.6) !important;
}
:root {
  --meltline-color-success-inverse-70: rgba(22, 163, 74, 0.7);
}
.bg-success-inverse-70 {
  background-color: rgba(22, 163, 74, 0.7) !important;
}
.border-success-inverse-70 {
  border-color: rgba(22, 163, 74, 0.7) !important;
}
:root {
  --meltline-color-success-inverse-80: rgba(22, 163, 74, 0.8);
}
.bg-success-inverse-80 {
  background-color: rgba(22, 163, 74, 0.8) !important;
}
.border-success-inverse-80 {
  border-color: rgba(22, 163, 74, 0.8) !important;
}
:root {
  --meltline-color-success-inverse-90: rgba(22, 163, 74, 0.9);
}
.bg-success-inverse-90 {
  background-color: rgba(22, 163, 74, 0.9) !important;
}
.border-success-inverse-90 {
  border-color: rgba(22, 163, 74, 0.9) !important;
}
:root {
  --meltline-color-destructive-inverse-10: rgba(239, 68, 68, 0.1);
}
.bg-destructive-inverse-10 {
  background-color: rgba(239, 68, 68, 0.1) !important;
}
.border-destructive-inverse-10 {
  border-color: rgba(239, 68, 68, 0.1) !important;
}
:root {
  --meltline-color-destructive-inverse-20: rgba(239, 68, 68, 0.2);
}
.bg-destructive-inverse-20 {
  background-color: rgba(239, 68, 68, 0.2) !important;
}
.border-destructive-inverse-20 {
  border-color: rgba(239, 68, 68, 0.2) !important;
}
:root {
  --meltline-color-destructive-inverse-30: rgba(239, 68, 68, 0.3);
}
.bg-destructive-inverse-30 {
  background-color: rgba(239, 68, 68, 0.3) !important;
}
.border-destructive-inverse-30 {
  border-color: rgba(239, 68, 68, 0.3) !important;
}
:root {
  --meltline-color-destructive-inverse-40: rgba(239, 68, 68, 0.4);
}
.bg-destructive-inverse-40 {
  background-color: rgba(239, 68, 68, 0.4) !important;
}
.border-destructive-inverse-40 {
  border-color: rgba(239, 68, 68, 0.4) !important;
}
:root {
  --meltline-color-destructive-inverse-50: rgba(239, 68, 68, 0.5);
}
.bg-destructive-inverse-50 {
  background-color: rgba(239, 68, 68, 0.5) !important;
}
.border-destructive-inverse-50 {
  border-color: rgba(239, 68, 68, 0.5) !important;
}
:root {
  --meltline-color-destructive-inverse-60: rgba(239, 68, 68, 0.6);
}
.bg-destructive-inverse-60 {
  background-color: rgba(239, 68, 68, 0.6) !important;
}
.border-destructive-inverse-60 {
  border-color: rgba(239, 68, 68, 0.6) !important;
}
:root {
  --meltline-color-destructive-inverse-70: rgba(239, 68, 68, 0.7);
}
.bg-destructive-inverse-70 {
  background-color: rgba(239, 68, 68, 0.7) !important;
}
.border-destructive-inverse-70 {
  border-color: rgba(239, 68, 68, 0.7) !important;
}
:root {
  --meltline-color-destructive-inverse-80: rgba(239, 68, 68, 0.8);
}
.bg-destructive-inverse-80 {
  background-color: rgba(239, 68, 68, 0.8) !important;
}
.border-destructive-inverse-80 {
  border-color: rgba(239, 68, 68, 0.8) !important;
}
:root {
  --meltline-color-destructive-inverse-90: rgba(239, 68, 68, 0.9);
}
.bg-destructive-inverse-90 {
  background-color: rgba(239, 68, 68, 0.9) !important;
}
.border-destructive-inverse-90 {
  border-color: rgba(239, 68, 68, 0.9) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-10: rgba(249, 251, 252, 0.1);
}
.bg-base-container-accent-inverse-10 {
  background-color: rgba(249, 251, 252, 0.1) !important;
}
.border-base-container-accent-inverse-10 {
  border-color: rgba(249, 251, 252, 0.1) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-20: rgba(249, 251, 252, 0.2);
}
.bg-base-container-accent-inverse-20 {
  background-color: rgba(249, 251, 252, 0.2) !important;
}
.border-base-container-accent-inverse-20 {
  border-color: rgba(249, 251, 252, 0.2) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-30: rgba(249, 251, 252, 0.3);
}
.bg-base-container-accent-inverse-30 {
  background-color: rgba(249, 251, 252, 0.3) !important;
}
.border-base-container-accent-inverse-30 {
  border-color: rgba(249, 251, 252, 0.3) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-40: rgba(249, 251, 252, 0.4);
}
.bg-base-container-accent-inverse-40 {
  background-color: rgba(249, 251, 252, 0.4) !important;
}
.border-base-container-accent-inverse-40 {
  border-color: rgba(249, 251, 252, 0.4) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-50: rgba(249, 251, 252, 0.5);
}
.bg-base-container-accent-inverse-50 {
  background-color: rgba(249, 251, 252, 0.5) !important;
}
.border-base-container-accent-inverse-50 {
  border-color: rgba(249, 251, 252, 0.5) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-60: rgba(249, 251, 252, 0.6);
}
.bg-base-container-accent-inverse-60 {
  background-color: rgba(249, 251, 252, 0.6) !important;
}
.border-base-container-accent-inverse-60 {
  border-color: rgba(249, 251, 252, 0.6) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-70: rgba(249, 251, 252, 0.7);
}
.bg-base-container-accent-inverse-70 {
  background-color: rgba(249, 251, 252, 0.7) !important;
}
.border-base-container-accent-inverse-70 {
  border-color: rgba(249, 251, 252, 0.7) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-80: rgba(249, 251, 252, 0.8);
}
.bg-base-container-accent-inverse-80 {
  background-color: rgba(249, 251, 252, 0.8) !important;
}
.border-base-container-accent-inverse-80 {
  border-color: rgba(249, 251, 252, 0.8) !important;
}
:root {
  --meltline-color-base-container-accent-inverse-90: rgba(249, 251, 252, 0.9);
}
.bg-base-container-accent-inverse-90 {
  background-color: rgba(249, 251, 252, 0.9) !important;
}
.border-base-container-accent-inverse-90 {
  border-color: rgba(249, 251, 252, 0.9) !important;
}
:root {
  --meltline-color-base-container-default-inverse-10: rgba(255, 255, 255, 0.1);
}
.bg-base-container-default-inverse-10 {
  background-color: rgba(255, 255, 255, 0.1) !important;
}
.border-base-container-default-inverse-10 {
  border-color: rgba(255, 255, 255, 0.1) !important;
}
:root {
  --meltline-color-base-container-default-inverse-20: rgba(255, 255, 255, 0.2);
}
.bg-base-container-default-inverse-20 {
  background-color: rgba(255, 255, 255, 0.2) !important;
}
.border-base-container-default-inverse-20 {
  border-color: rgba(255, 255, 255, 0.2) !important;
}
:root {
  --meltline-color-base-container-default-inverse-30: rgba(255, 255, 255, 0.3);
}
.bg-base-container-default-inverse-30 {
  background-color: rgba(255, 255, 255, 0.3) !important;
}
.border-base-container-default-inverse-30 {
  border-color: rgba(255, 255, 255, 0.3) !important;
}
:root {
  --meltline-color-base-container-default-inverse-40: rgba(255, 255, 255, 0.4);
}
.bg-base-container-default-inverse-40 {
  background-color: rgba(255, 255, 255, 0.4) !important;
}
.border-base-container-default-inverse-40 {
  border-color: rgba(255, 255, 255, 0.4) !important;
}
:root {
  --meltline-color-base-container-default-inverse-50: rgba(255, 255, 255, 0.5);
}
.bg-base-container-default-inverse-50 {
  background-color: rgba(255, 255, 255, 0.5) !important;
}
.border-base-container-default-inverse-50 {
  border-color: rgba(255, 255, 255, 0.5) !important;
}
:root {
  --meltline-color-base-container-default-inverse-60: rgba(255, 255, 255, 0.6);
}
.bg-base-container-default-inverse-60 {
  background-color: rgba(255, 255, 255, 0.6) !important;
}
.border-base-container-default-inverse-60 {
  border-color: rgba(255, 255, 255, 0.6) !important;
}
:root {
  --meltline-color-base-container-default-inverse-70: rgba(255, 255, 255, 0.7);
}
.bg-base-container-default-inverse-70 {
  background-color: rgba(255, 255, 255, 0.7) !important;
}
.border-base-container-default-inverse-70 {
  border-color: rgba(255, 255, 255, 0.7) !important;
}
:root {
  --meltline-color-base-container-default-inverse-80: rgba(255, 255, 255, 0.8);
}
.bg-base-container-default-inverse-80 {
  background-color: rgba(255, 255, 255, 0.8) !important;
}
.border-base-container-default-inverse-80 {
  border-color: rgba(255, 255, 255, 0.8) !important;
}
:root {
  --meltline-color-base-container-default-inverse-90: rgba(255, 255, 255, 0.9);
}
.bg-base-container-default-inverse-90 {
  background-color: rgba(255, 255, 255, 0.9) !important;
}
.border-base-container-default-inverse-90 {
  border-color: rgba(255, 255, 255, 0.9) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-10: rgba(214, 214, 214, 0.1);
}
.bg-base-stroke-default-inverse-10 {
  background-color: rgba(214, 214, 214, 0.1) !important;
}
.border-base-stroke-default-inverse-10 {
  border-color: rgba(214, 214, 214, 0.1) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-20: rgba(214, 214, 214, 0.2);
}
.bg-base-stroke-default-inverse-20 {
  background-color: rgba(214, 214, 214, 0.2) !important;
}
.border-base-stroke-default-inverse-20 {
  border-color: rgba(214, 214, 214, 0.2) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-30: rgba(214, 214, 214, 0.3);
}
.bg-base-stroke-default-inverse-30 {
  background-color: rgba(214, 214, 214, 0.3) !important;
}
.border-base-stroke-default-inverse-30 {
  border-color: rgba(214, 214, 214, 0.3) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-40: rgba(214, 214, 214, 0.4);
}
.bg-base-stroke-default-inverse-40 {
  background-color: rgba(214, 214, 214, 0.4) !important;
}
.border-base-stroke-default-inverse-40 {
  border-color: rgba(214, 214, 214, 0.4) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-50: rgba(214, 214, 214, 0.5);
}
.bg-base-stroke-default-inverse-50 {
  background-color: rgba(214, 214, 214, 0.5) !important;
}
.border-base-stroke-default-inverse-50 {
  border-color: rgba(214, 214, 214, 0.5) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-60: rgba(214, 214, 214, 0.6);
}
.bg-base-stroke-default-inverse-60 {
  background-color: rgba(214, 214, 214, 0.6) !important;
}
.border-base-stroke-default-inverse-60 {
  border-color: rgba(214, 214, 214, 0.6) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-70: rgba(214, 214, 214, 0.7);
}
.bg-base-stroke-default-inverse-70 {
  background-color: rgba(214, 214, 214, 0.7) !important;
}
.border-base-stroke-default-inverse-70 {
  border-color: rgba(214, 214, 214, 0.7) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-80: rgba(214, 214, 214, 0.8);
}
.bg-base-stroke-default-inverse-80 {
  background-color: rgba(214, 214, 214, 0.8) !important;
}
.border-base-stroke-default-inverse-80 {
  border-color: rgba(214, 214, 214, 0.8) !important;
}
:root {
  --meltline-color-base-stroke-default-inverse-90: rgba(214, 214, 214, 0.9);
}
.bg-base-stroke-default-inverse-90 {
  background-color: rgba(214, 214, 214, 0.9) !important;
}
.border-base-stroke-default-inverse-90 {
  border-color: rgba(214, 214, 214, 0.9) !important;
}
:root {
  --meltline-color-black-40: rgba(0, 0, 0, 0.4);
}
.text-black-40 {
  color: rgba(0, 0, 0, 0.4) !important;
}
.bg-black-40 {
  background-color: rgba(0, 0, 0, 0.4) !important;
}
.border-black-40 {
  border-color: rgba(0, 0, 0, 0.4) !important;
}
.w35 {
  width: 35px;
}
.h35 {
  height: 35px;
}
.s35 {
  width: 35px;
  height: 35px;
}
.w46 {
  width: 46px;
}
.h46 {
  height: 46px;
}
.s46 {
  width: 46px;
  height: 46px;
}
.w47 {
  width: 47px;
}
.h47 {
  height: 47px;
}
.s47 {
  width: 47px;
  height: 47px;
}
.w48 {
  width: 48px;
}
.h48 {
  height: 48px;
}
.s48 {
  width: 48px;
  height: 48px;
}
.w72 {
  width: 72px;
}
.h72 {
  height: 72px;
}
.s72 {
  width: 72px;
  height: 72px;
}

.w85 {
  width: 85px;
}
.h85 {
  height: 85px;
}
.s85 {
  width: 85px;
  height: 85px;
}

.w91 {
  width: 91px;
}
.h91 {
  height: 91px;
}
.s91 {
  width: 91px;
  height: 91px;
}
.w120 {
  width: 120px;
}
.h120 {
  height: 120px;
}
.s120 {
  width: 120px;
  height: 120px;
}
.w136 {
  width: 136px;
}
.h136 {
  height: 136px;
}
.s136 {
  width: 136px;
  height: 136px;
}
.w140 {
  width: 140px;
}
.h140 {
  height: 140px;
}
.s140 {
  width: 140px;
  height: 140px;
}
.w146 {
  width: 146px;
}
.h146 {
  height: 146px;
}
.s146 {
  width: 146px;
  height: 146px;
}
.w155 {
  width: 155px;
}
.h155 {
  height: 155px;
}
.s155 {
  width: 155px;
  height: 155px;
}
.w160 {
  width: 160px;
}
.h160 {
  height: 160px;
}
.s160 {
  width: 160px;
  height: 160px;
}
.w170 {
  width: 170px;
}
.h170 {
  height: 170px;
}
.s170 {
  width: 170px;
  height: 170px;
}
.w171 {
  width: 171px;
}
.h171 {
  height: 171px;
}
.s171 {
  width: 171px;
  height: 171px;
}
.w172 {
  width: 172px;
}
.h172 {
  height: 172px;
}
.s172 {
  width: 172px;
  height: 172px;
}
.w179 {
  width: 179px;
}
.h179 {
  height: 179px;
}
.s179 {
  width: 179px;
  height: 179px;
}
.w182 {
  width: 182px;
}
.h182 {
  height: 182px;
}
.s182 {
  width: 182px;
  height: 182px;
}
.w186 {
  width: 186px;
}
.h186 {
  height: 186px;
}
.s186 {
  width: 186px;
  height: 186px;
}
.w187 {
  width: 187px;
}
.h187 {
  height: 187px;
}
.s187 {
  width: 187px;
  height: 187px;
}
.w195 {
  width: 195px;
}
.h195 {
  height: 195px;
}
.s195 {
  width: 195px;
  height: 195px;
}
.w202 {
  width: 202px;
}
.h202 {
  height: 202px;
}
.s202 {
  width: 202px;
  height: 202px;
}
.w208 {
  width: 208px;
}
.h208 {
  height: 208px;
}
.s208 {
  width: 208px;
  height: 208px;
}
.w234 {
  width: 234px;
}
.h234 {
  height: 234px;
}
.s234 {
  width: 234px;
  height: 234px;
}
.w238 {
  width: 238px;
}
.h238 {
  height: 238px;
}
.s238 {
  width: 238px;
  height: 238px;
}
.w240 {
  width: 240px;
}
.h240 {
  height: 240px;
}
.s240 {
  width: 240px;
  height: 240px;
}
.w241 {
  width: 241px;
}
.h241 {
  height: 241px;
}
.s241 {
  width: 241px;
  height: 241px;
}
.w259 {
  width: 259px;
}
.h259 {
  height: 259px;
}
.s259 {
  width: 259px;
  height: 259px;
}
.w260 {
  width: 260px;
}
.h260 {
  height: 260px;
}
.s260 {
  width: 260px;
  height: 260px;
}
.w264 {
  width: 264px;
}
.h264 {
  height: 264px;
}
.s264 {
  width: 264px;
  height: 264px;
}
.w284 {
  width: 284px;
}
.h284 {
  height: 284px;
}
.s284 {
  width: 284px;
  height: 284px;
}
.w288 {
  width: 288px;
}
.h288 {
  height: 288px;
}
.s288 {
  width: 288px;
  height: 288px;
}
.w320 {
  width: 320px;
}
.h320 {
  height: 320px;
}
.s320 {
  width: 320px;
  height: 320px;
}
.w324 {
  width: 324px;
}
.h324 {
  height: 324px;
}
.s324 {
  width: 324px;
  height: 324px;
}
.w360 {
  width: 360px;
}
.h360 {
  height: 360px;
}
.s360 {
  width: 360px;
  height: 360px;
}
.w373 {
  width: 373px;
}
.h373 {
  height: 373px;
}
.s373 {
  width: 373px;
  height: 373px;
}
.w453 {
  width: 453px;
}
.h453 {
  height: 453px;
}
.s453 {
  width: 453px;
  height: 453px;
}
.w578 {
  width: 578px;
}
.h578 {
  height: 578px;
}
.s578 {
  width: 578px;
  height: 578px;
}
.w680 {
  width: 680px;
}
.h680 {
  height: 680px;
}
.s680 {
  width: 680px;
  height: 680px;
}
.w936 {
  width: 936px;
}
.h936 {
  height: 936px;
}
.s936 {
  width: 936px;
  height: 936px;
}
.w1020 {
  width: 1020px;
}
.h1020 {
  height: 1020px;
}
.s1020 {
  width: 1020px;
  height: 1020px;
}
.p28 {
  padding: 28px;
}
.pt28 {
  padding-top: 28px;
}
.pr28 {
  padding-right: 28px;
}
.pb28 {
  padding-bottom: 28px;
}
.pl28 {
  padding-left: 28px;
}
.px28 {
  padding-left: 28px;
  padding-right: 28px;
}
.py28 {
  padding-top: 28px;
  padding-bottom: 28px;
}
.p32 {
  padding: 32px;
}
.pt32 {
  padding-top: 32px;
}
.pr32 {
  padding-right: 32px;
}
.pb32 {
  padding-bottom: 32px;
}
.pl32 {
  padding-left: 32px;
}
.px32 {
  padding-left: 32px;
  padding-right: 32px;
}
.py32 {
  padding-top: 32px;
  padding-bottom: 32px;
}
.p44 {
  padding: 44px;
}
.pt44 {
  padding-top: 44px;
}
.pr44 {
  padding-right: 44px;
}
.pb44 {
  padding-bottom: 44px;
}
.pl44 {
  padding-left: 44px;
}
.px44 {
  padding-left: 44px;
  padding-right: 44px;
}
.py44 {
  padding-top: 44px;
  padding-bottom: 44px;
}
.p48 {
  padding: 48px;
}
.pt48 {
  padding-top: 48px;
}
.pr48 {
  padding-right: 48px;
}
.pb48 {
  padding-bottom: 48px;
}
.pl48 {
  padding-left: 48px;
}
.px48 {
  padding-left: 48px;
  padding-right: 48px;
}
.py48 {
  padding-top: 48px;
  padding-bottom: 48px;
}
.p56 {
  padding: 56px;
}
.pt56 {
  padding-top: 56px;
}
.pr56 {
  padding-right: 56px;
}
.pb56 {
  padding-bottom: 56px;
}
.pl56 {
  padding-left: 56px;
}
.px56 {
  padding-left: 56px;
  padding-right: 56px;
}
.py56 {
  padding-top: 56px;
  padding-bottom: 56px;
}
.p64 {
  padding: 64px;
}
.pt64 {
  padding-top: 64px;
}
.pr64 {
  padding-right: 64px;
}
.pb64 {
  padding-bottom: 64px;
}
.pl64 {
  padding-left: 64px;
}
.px64 {
  padding-left: 64px;
  padding-right: 64px;
}
.py64 {
  padding-top: 64px;
  padding-bottom: 64px;
}
.p72 {
  padding: 72px;
}
.pt72 {
  padding-top: 72px;
}
.pr72 {
  padding-right: 72px;
}
.pb72 {
  padding-bottom: 72px;
}
.pl72 {
  padding-left: 72px;
}
.px72 {
  padding-left: 72px;
  padding-right: 72px;
}
.py72 {
  padding-top: 72px;
  padding-bottom: 72px;
}
.p96 {
  padding: 96px;
}
.pt96 {
  padding-top: 96px;
}
.pr96 {
  padding-right: 96px;
}
.pb96 {
  padding-bottom: 96px;
}
.pl96 {
  padding-left: 96px;
}
.px96 {
  padding-left: 96px;
  padding-right: 96px;
}
.py96 {
  padding-top: 96px;
  padding-bottom: 96px;
}
.p117 {
  padding: 117px;
}
.pt117 {
  padding-top: 117px;
}
.pr117 {
  padding-right: 117px;
}
.pb117 {
  padding-bottom: 117px;
}
.pl117 {
  padding-left: 117px;
}
.px117 {
  padding-left: 117px;
  padding-right: 117px;
}
.py117 {
  padding-top: 117px;
  padding-bottom: 117px;
}
.p128 {
  padding: 128px;
}
.pt128 {
  padding-top: 128px;
}
.pr128 {
  padding-right: 128px;
}
.pb128 {
  padding-bottom: 128px;
}
.pl128 {
  padding-left: 128px;
}
.px128 {
  padding-left: 128px;
  padding-right: 128px;
}
.py128 {
  padding-top: 128px;
  padding-bottom: 128px;
}
.p140 {
  padding: 140px;
}
.pt140 {
  padding-top: 140px;
}
.pr140 {
  padding-right: 140px;
}
.pb140 {
  padding-bottom: 140px;
}
.pl140 {
  padding-left: 140px;
}
.px140 {
  padding-left: 140px;
  padding-right: 140px;
}
.py140 {
  padding-top: 140px;
  padding-bottom: 140px;
}
.p144 {
  padding: 144px;
}
.pt144 {
  padding-top: 144px;
}
.pr144 {
  padding-right: 144px;
}
.pb144 {
  padding-bottom: 144px;
}
.pl144 {
  padding-left: 144px;
}
.px144 {
  padding-left: 144px;
  padding-right: 144px;
}
.py144 {
  padding-top: 144px;
  padding-bottom: 144px;
}
.p150 {
  padding: 150px;
}
.pt150 {
  padding-top: 150px;
}
.pr150 {
  padding-right: 150px;
}
.pb150 {
  padding-bottom: 150px;
}
.pl150 {
  padding-left: 150px;
}
.px150 {
  padding-left: 150px;
  padding-right: 150px;
}
.py150 {
  padding-top: 150px;
  padding-bottom: 150px;
}
.p160 {
  padding: 160px;
}
.pt160 {
  padding-top: 160px;
}
.pr160 {
  padding-right: 160px;
}
.pb160 {
  padding-bottom: 160px;
}
.pl160 {
  padding-left: 160px;
}
.px160 {
  padding-left: 160px;
  padding-right: 160px;
}
.py160 {
  padding-top: 160px;
  padding-bottom: 160px;
}
.m32 {
  margin: 32px;
}
.mt32 {
  margin-top: 32px;
}
.mr32 {
  margin-right: 32px;
}
.mb32 {
  margin-bottom: 32px;
}
.ml32 {
  margin-left: 32px;
}
.mx32 {
  margin-left: 32px;
  margin-right: 32px;
}
.my32 {
  margin-top: 32px;
  margin-bottom: 32px;
}
.m36 {
  margin: 36px;
}
.mt36 {
  margin-top: 36px;
}
.mr36 {
  margin-right: 36px;
}
.mb36 {
  margin-bottom: 36px;
}
.ml36 {
  margin-left: 36px;
}
.mx36 {
  margin-left: 36px;
  margin-right: 36px;
}
.my36 {
  margin-top: 36px;
  margin-bottom: 36px;
}
.m37 {
  margin: 37px;
}
.mt37 {
  margin-top: 37px;
}
.mr37 {
  margin-right: 37px;
}
.mb37 {
  margin-bottom: 37px;
}
.ml37 {
  margin-left: 37px;
}
.mx37 {
  margin-left: 37px;
  margin-right: 37px;
}
.my37 {
  margin-top: 37px;
  margin-bottom: 37px;
}
.m45 {
  margin: 45px;
}
.mt45 {
  margin-top: 45px;
}
.mr45 {
  margin-right: 45px;
}
.mb45 {
  margin-bottom: 45px;
}
.ml45 {
  margin-left: 45px;
}
.mx45 {
  margin-left: 45px;
  margin-right: 45px;
}
.my45 {
  margin-top: 45px;
  margin-bottom: 45px;
}
.m46 {
  margin: 46px;
}
.mt46 {
  margin-top: 46px;
}
.mr46 {
  margin-right: 46px;
}
.mb46 {
  margin-bottom: 46px;
}
.ml46 {
  margin-left: 46px;
}
.mx46 {
  margin-left: 46px;
  margin-right: 46px;
}
.my46 {
  margin-top: 46px;
  margin-bottom: 46px;
}
.m48 {
  margin: 48px;
}
.mt48 {
  margin-top: 48px;
}
.mr48 {
  margin-right: 48px;
}
.mb48 {
  margin-bottom: 48px;
}
.ml48 {
  margin-left: 48px;
}
.mx48 {
  margin-left: 48px;
  margin-right: 48px;
}
.my48 {
  margin-top: 48px;
  margin-bottom: 48px;
}
.m56 {
  margin: 56px;
}
.mt56 {
  margin-top: 56px;
}
.mr56 {
  margin-right: 56px;
}
.mb56 {
  margin-bottom: 56px;
}
.ml56 {
  margin-left: 56px;
}
.mx56 {
  margin-left: 56px;
  margin-right: 56px;
}
.my56 {
  margin-top: 56px;
  margin-bottom: 56px;
}
.m62 {
  margin: 62px;
}
.mt62 {
  margin-top: 62px;
}
.mr62 {
  margin-right: 62px;
}
.mb62 {
  margin-bottom: 62px;
}
.ml62 {
  margin-left: 62px;
}
.mx62 {
  margin-left: 62px;
  margin-right: 62px;
}
.my62 {
  margin-top: 62px;
  margin-bottom: 62px;
}
.m72 {
  margin: 72px;
}
.mt72 {
  margin-top: 72px;
}
.mr72 {
  margin-right: 72px;
}
.mb72 {
  margin-bottom: 72px;
}
.ml72 {
  margin-left: 72px;
}
.mx72 {
  margin-left: 72px;
  margin-right: 72px;
}
.my72 {
  margin-top: 72px;
  margin-bottom: 72px;
}
.m88 {
  margin: 88px;
}
.mt88 {
  margin-top: 88px;
}
.mr88 {
  margin-right: 88px;
}
.mb88 {
  margin-bottom: 88px;
}
.ml88 {
  margin-left: 88px;
}
.mx88 {
  margin-left: 88px;
  margin-right: 88px;
}
.my88 {
  margin-top: 88px;
  margin-bottom: 88px;
}
.m214 {
  margin: 214px;
}
.mt214 {
  margin-top: 214px;
}
.mr214 {
  margin-right: 214px;
}
.mb214 {
  margin-bottom: 214px;
}
.ml214 {
  margin-left: 214px;
}
.mx214 {
  margin-left: 214px;
  margin-right: 214px;
}
.my214 {
  margin-top: 214px;
  margin-bottom: 214px;
}
.container-1600 {
  max-width: 1600px;
  width: 100%;
  margin-inline: auto;
}
.container-1456 {
  max-width: 1456px;
  width: 100%;
  margin-inline: auto;
}
.container-1164 {
  max-width: 1164px;
  width: 100%;
  margin-inline: auto;
}
.container-1152 {
  max-width: 1152px;
  width: 100%;
  margin-inline: auto;
}
.container-1120 {
  max-width: 1120px;
  width: 100%;
  margin-inline: auto;
}
.container-1090 {
  max-width: 1090px;
  width: 100%;
  margin-inline: auto;
}
.text-xs {
  font-size: 12px;
  line-height: 1.3333;
}
.text-sm {
  font-size: 14px;
  line-height: 1.4286;
}
.text-base {
  font-size: 16px;
  line-height: 1.5;
}
.text-medium {
  font-size: 18px;
  line-height: 1.5556;
}
.text-lg {
  font-size: 20px;
  line-height: 1.4;
}
.text-2xl {
  font-size: 24px;
  line-height: 1.3333;
}
.text-3xl {
  font-size: 28px;
  line-height: 1.2;
}
.text-4xl {
  font-size: 32px;
  line-height: 1.15;
}
.text-5xl {
  font-size: 36px;
  line-height: 1.1111;
}
.text-6xl {
  font-size: 40px;
  line-height: 1;
}
.text-7xl {
  font-size: 60px;
  line-height: 1;
}
.text-8xl {
  font-size: 72px;
  line-height: 1;
}
.text-9xl {
  font-size: 96px;
  line-height: 1;
}
.text-10xl {
  font-size: 128px;
  line-height: 1;
}
.leading-none {
  line-height: 1;
}
.leading-tight {
  line-height: 1.25;
}
.leading-snug {
  line-height: 1.375;
}
.leading-normal {
  line-height: 1.5;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-loose {
  line-height: 2;
}
.vertical-align-baseline {
  vertical-align: baseline;
}
.vertical-align-text-bottom {
  vertical-align: text-bottom;
}
.letter-spacing-2per {
  letter-spacing: 0.02em;
}
.font-helvetica-neue {
  font-family: Helvetica Neue;
}
.side-nav-top {
  top: 177px;
}
.center-y {
  top: 50%;
  transform: translateY(-50%);
}
.t-full {
  top: 100%;
}
.bn84 {
  bottom: -84px;
}
.min-w-0 {
  min-width: 0;
}
.min-w-60 {
  min-width: 60px;
}
.min-w-136 {
  min-width: 136px;
}
.min-w-160 {
  min-width: 160px;
}
.min-w-170 {
  min-width: 170px;
}
.min-w-200 {
  min-width: 200px;
}
.min-w-208 {
  min-width: 208px;
}
.min-w-600 {
  min-width: 600px;
}
.min-w-900 {
  min-width: 900px;
}
.min-w-1024 {
  min-width: 1024px;
}
.min-w-1600 {
  min-width: 1600px;
}
.max-w-193 {
  max-width: 193px;
}
.max-w-240 {
  max-width: 240px;
}
.max-w-264 {
  max-width: 264px;
}
.max-w-284 {
  max-width: 284px;
}
.max-w-286 {
  max-width: 286px;
}
.max-w-346 {
  max-width: 346px;
}
.max-w-373 {
  max-width: 373px;
}
.max-w-400 {
  max-width: 400px;
}
.max-w-960 {
  max-width: 960px;
}
.max-w-500 {
  max-width: 500px;
}
.max-w-525 {
  max-width: 525px;
}
.max-w-936 {
  max-width: 936px;
}
.min-h-vh {
  min-height: 100vh;
}
.min-h-74 {
  min-height: 74px;
}
.min-h-226 {
  min-height: 226px;
}
.max-h-578 {
  max-height: 578px;
}
.border {
  border-color: var(--meltline-color-base-stroke-default);
}
.gap-32 {
  gap: 32px;
}
.gap-36 {
  gap: 36px;
}
.gap-40 {
  gap: 40px;
}
.gap-48 {
  gap: 48px;
}
.gap-56 {
  gap: 56px;
}
.gap-64 {
  gap: 64px;
}
.gap-72 {
  gap: 72px;
}
.gap-80 {
  gap: 80px;
}
.gap-96 {
  gap: 96px;
}
.gap-112 {
  gap: 112px;
}
.gap-24-0 {
  gap: 24px 0px;
}
.gap-8-16 {
  gap: 8px 16px;
}
.gap-8-24 {
  gap: 8px 24px;
}
.gap-32-24 {
  gap: 32px 24px;
}
.shadow-md {
  box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -1px rgba(0, 0, 0, 0.6);
}
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
input {
  width: 100%;
  height: auto;
  font-size: 14px;
  line-height: 150%;
}
input:focus-visible {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.focus-white:focus-visible {
  outline: 2px solid var(--meltline-color-base-container-default);
  outline-offset: 2px;
}
.input {
  border: 1px solid var(--meltline-color-base-stroke-default);
  padding: 12px !important;
  border-radius: 0px !important;
  background-color: var(--meltline-color-base-container-default);
  transition: background 0.3s;
}
.input:hover {
  background-color: var(--meltline-color-base-container-default-inverse-90);
}
.input.is-error {
  border-color: var(--meltline-color-destructive);
}
.search-wrapper {
  height: 40px;
}
.search-wrapper:focus-within {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.site-language{padding-top:2px;}
.search-wrapper input.input-header:focus,
.search-wrapper input.input-header:focus-visible {
  outline: none;
}
li {
  list-style-type: none;
}
.li-marker {
  padding-left: 1.5rem;
}
.li-marker li {
  list-style-type: disc;
}
.grid-autofit-160 {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
.grid-autofit-180 {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.grid-autofit-200 {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.grid-autofit-230 {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.grid-autofit-250 {
  grid-template-columns: repeat(4, minmax(250px, 1fr));
}
.grid-autofit-280 {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.grid-autofit-300 {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.grid-autofit-325 {
  grid-template-columns: repeat(auto-fit, minmax(325px, 1fr));
}
.grid-autofit-360 {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}
.grid-autofill-300 {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.grid-autofill-325 {
  grid-template-columns: repeat(auto-fill, minmax(325px, 1fr));
}
.grid-autofill-360 {
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
.bg-image-none {
  background-image: none;
}
.hover-opacity-80 {
  transition: opacity 0.3s;
}
.hover-opacity-80:hover {
  opacity: 0.8;
}
.hover-opacity-70 {
  transition: opacity 0.3s;
}
.hover-opacity-70:hover {
  opacity: 0.7;
}
.hover-accent-inverse-90:hover {
  background-color: var(--meltline-color-base-container-accent-inverse-90) !important;
  transition: background 0.3s;
}
.hover-footer-underline {
  background: linear-gradient(var(--meltline-color-base-foreground-on-fill), var(--meltline-color-base-foreground-on-fill));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size 0.3s, color 0.3s;
}
.hover-footer-underline:hover {
  background-size: 100% 1px;
}
.hover-bg-base-container-accent:hover {
  background-color: #f9fbfc !important;
  transition: background 0.3s;
}
.hover-bg-base-container-default:hover {
  background-color: rgba(255, 255, 255, 0.9) !important;
  transition: background 0.3s;
}
.hover-color-primary:hover * {
  color: #0a539d !important;
  transition: color 0.3s;
}
.hover-menu-link p,
.hover-menu-link span {
  position: relative;
  transition: color 0.3s;
}
.hover-menu-link p::before,
.hover-menu-link span::before {
  content: '';
  position: absolute;
  inset-inline: 0;
  bottom: 0px;
  height: 1px;
  background-color: var(--meltline-color-primary);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s;
}
.hover-menu-link:hover span,
.hover-menu-link:hover p {
  color: #0a539d !important;
}
.hover-menu-link:hover span::before,
.hover-menu-link:hover p::before {
  transform: scaleX(1);
  transform-origin: left;
}
.hover-menu-link:hover .link-circle-dot {
  transform: scale(1.2);
}
.hover-menu-link-none p::before,
.hover-menu-link-none span::before {
  content: none !important;
}
.hover-product-nav {
  transition: transform 0.3s;
  z-index: 0;
  position: relative;
}
.hover-product-nav:hover {
  transform: scale(1.05);
  z-index: 1;
}
.hover-product-nav:hover .link-circle-dot {
  transform: scale(1.2);
}
.link-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--meltline-color-primary);
  border-radius: 50%;
  flex-grow: 0;
  flex-shrink: 0;
}
.link-circle.on-fill {
  border-color: #ffffff !important;
}
.link-circle.on-fill .link-circle-dot {
  background-color: #ffffff !important;
}
.link-circle.primary {
  border-color: var(--meltline-color-primary);
}
.link-circle.primary .link-circle-dot {
  background-color: var(--meltline-color-primary);
}
.link-circle-large {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--meltline-color-primary);
  border-radius: 50%;
  flex-grow: 0;
  flex-shrink: 0;
}
.link-circle-dot {
  width: 6px;
  height: 6px;
  background-color: var(--meltline-color-primary);
  border-radius: 50%;
  transition: transform 0.3s;
}
.upper-menu {
  position: relative;
  transition: opacity 0.3s;
}
.upper-menu::before {
  content: '';
  position: absolute;
  inset-inline: 0;
  bottom: 10px;
  height: 1px;
  background-color: var(--meltline-color-primary);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s;
}
.upper-menu:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}
.upper-menu:hover p {
  color: var(--meltline-color-primary);
}
.upper-menu:hover path {
  fill: var(--meltline-color-primary);
}
.current-menu {
  position: relative;
}
.current-menu::before {
  content: '';
  position: absolute;
  bottom: -1px;
  inset-inline: 0;
  width: 100%;
  height: 4px;
  background-color: var(--meltline-color-primary);
}
.arrow {
  position: relative;
}
.arrow::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -1px;
  width: 8px;
  height: 7px;
  left: 50%;
  transform: translateX(-50%);
  background-image: url('../../smcimage/common/arrow-bottom-triangle.svg');
  background-size: 8px 7px;
  margin-inline: auto;
  transition: bottom 0.3s ease;
}
.header-menu {
  position: relative;
}
.header-menu::before {
  content: '';
  position: absolute;
  bottom: -1px;
  inset-inline: 0;
  height: 4px;
  background-color: var(--meltline-color-primary);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.header-menu.current-menu::before,
.header-menu:hover::before {
  opacity: 1;
}
.header-menu:hover {
  color: var(--meltline-color-primary);
}
.header-menu.arrow::after {
  transition: bottom 0.3s ease;
}
.header-menu.arrow:hover::after {
  bottom: 2px;
}
.mega-menu-rows {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 48px 56px;
}
.mega-menu-rows ul:has(li) {
  padding-top: 20px;
}
.js-panel {
  position: absolute;
  top: 100%;
  left: 0;
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0.25s;
}
.js-menu.is-mega-menu-open .js-panel {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s;
}
.js-menu.is-mega-menu-open .header-menu::before {
  opacity: 1;
}
.js-menu.is-mega-menu-open .header-menu.arrow::after {
  bottom: 2px;
}
.js-close-bg {
  position: absolute;
  top: 100%;
  left: 0;
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  visibility: hidden;
}
:has(.is-mega-menu-open) .js-close-bg {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s;
}
:has(.is-hamburger-open).js-close-bg {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s;
}
.hamburger-btn {
  width: 44px;
  height: 44px;
  padding: 15px 12px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
}
.hamburger-bar {
  width: 100%;
  height: 2px;
  background-color: var(--meltline-color-primary);
  border-radius: 9999px;
  transition: transform 0.25s ease, opacity 0.2s ease, background-color 0.25s ease;
  transform-origin: center;
}
.hamburger-bar :nth-child(1) {
  transform: translateY(0) rotate(0);
}
.hamburger-bar :nth-child(2) {
  opacity: 1;
}
.hamburger-bar :nth-child(3) {
  transform: translateY(0) rotate(0);
}
.h-vh-n56 {
  height: calc(100svh - 56px);
}
.header.is-hamburger-open .hamburger-btn .hamburger-bar:nth-child(1) {
  transform: translateY(6px) rotate(-45deg);
}
.header.is-hamburger-open .hamburger-btn .hamburger-bar:nth-child(2) {
  opacity: 0;
}
.header.is-hamburger-open .hamburger-btn .hamburger-bar:nth-child(3) {
  transform: translateY(-6px) rotate(45deg);
}
.hamburger-menu {
  position: absolute;
  inset-inline: 0;
  z-index: 0;
  background-color: #ffffff !important;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-100%);
  transition: all 0.3s;
}
.hamburger-menu-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 8px;
  gap: 10px;
  width: 100%;
  border-bottom: 1px solid var(--meltline-color-base-stroke-default);
}
.hamburger-menu-item {
  position: absolute;
  top: 0;
  right: 0;
  transform: translateX(100%);
  transition: transform 0.25s ease;
  width: 100%;
  height: 100%;
  background-color: var(--meltline-color-base-container-default);
  overflow-y: auto;
  overflow-x: hidden;
}
.hamburger-menu-item.is-open {
  transform: translateX(0);
}
.hamburger-menu-item.is-left {
  transform: translateX(-100%);
}
.hamburger-menu-back {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: 20px 8px;
  border-bottom: 1px solid var(--meltline-color-base-stroke-default);
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4286;
  line-height: 1.25;
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
  border-radius: 0px;
  flex-shrink: 0;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  /* variants.size: small/medium/large */
  /* variants.isSquare */
}
.button:focus-visible {
  outline-width: 0.125rem;
  outline-style: solid;
  outline-offset: 0.125rem;
  outline-color: var(--meltline-color-primary);
}
.button.focus-white:focus-visible {
  outline: 2px solid var(--meltline-color-base-container-default);
  outline-offset: 2px;
}
.button.small {
  min-height: 36px;
  padding: 8px 12px;
}
.button.medium {
  min-height: 40px;
  padding: 10px 16px;
}
.button.large {
  min-height: 44px;
  padding: 12px 32px;
}
.button.is-square {
  aspect-ratio: 1 / 1;
  padding: 0 !important;
}
.button.is-square.small {
  width: 36px;
  min-height: 36px;
}
.button.is-square.medium {
  width: 40px;
  min-height: 40px;
}
.button.is-square.large {
  width: 44px;
  min-height: 44px;
}
.button.primary.solid {
  border: 0 !important;
  background-color: #0a539d !important;
  color: #ffffff !important;
}
.button.primary.solid:hover {
  background-color: var(--meltline-color-primary-inverse-90) !important;
}
.button.primary.solid:active {
  background-color: var(--meltline-color-primary-inverse-80) !important;
}
.button.primary.solid:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.button.primary.ghost {
  border: 0 !important;
  background-color: transparent !important;
  color: #0a539d !important;
}
.button.primary.ghost:hover {
  background-color: var(--meltline-color-base-container-default-dark-90) !important;
}
.button.primary.ghost:active {
  background-color: var(--meltline-color-base-container-default-dark-80) !important;
}
.button.primary.ghost:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.button.secondary.solid {
  border-style: solid;
  border-width: 1px;
  border-color: #d6d6d6 !important;
  background-color: #ffffff !important;
  color: #0a539d !important;
}
.button.secondary.solid:hover {
  background-color: var(--meltline-color-base-container-default-dark-90) !important;
}
.button.secondary.solid:active {
  background-color: var(--meltline-color-base-container-default-dark-80) !important;
  border-color: var(--meltline-color-base-container-default) !important;
}
.button.secondary.solid:disabled {
  opacity: 0.5;
  pointer-events: none;
  background: var(--base-container-default, #FFF) !important;
  border: 1px solid var(--base-stroke-default, #D6D6D6) !important;
  color: #0a539d !important;
}
.button.secondary.ghost {
  border: 0 !important;
  background-color: #ffffff !important;
  color: #0a539d !important;
}
.button.secondary.ghost:hover {
  background-color: var(--meltline-color-base-container-default-dark-90) !important;
}
.button.secondary.ghost:active {
  background-color: var(--meltline-color-base-container-default-dark-80) !important;
}
.button.secondary.ghost:disabled {
  opacity: 0.5;
  pointer-events: none;
  background: var(--base-container-default, #FFF) !important;
  border: 1px solid var(--base-stroke-default, #D6D6D6) !important;
  color: #0a539d !important;
}
.button.success.solid {
  border: 0 !important;
  background-color: #16a34a !important;
  color: #f0fdf4 !important;
}
.button.success.solid:hover {
  background-color: var(--meltline-color-success-inverse-90) !important;
  border-color: var(--meltline-color-success-inverse-10) !important;
}
.button.success.solid:active {
  background-color: var(--meltline-color-success-inverse-80) !important;
  border-color: var(--meltline-color-success-inverse-80) !important;
}
.button.success.solid:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.button.success.ghost {
  border: 0 !important;
  background-color: transparent !important;
  color: #16a34a !important;
}
.button.success.ghost:hover {
  background-color: var(--meltline-color-base-container-default-dark-90) !important;
}
.button.success.ghost:active {
  background-color: var(--meltline-color-base-container-default-dark-80) !important;
}
.button.success.ghost:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.button.danger.solid {
  border: 0 !important;
  background-color: #ef4444 !important;
  color: #fef2f2 !important;
}
.button.danger.solid:hover {
  background-color: var(--meltline-color-destructive-inverse-90) !important;
}
.button.danger.solid:active {
  background-color: var(--meltline-color-destructive-inverse-80) !important;
}
.button.danger.solid:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.button.danger.ghost {
  background-color: transparent !important;
  color: #ef4444 !important;
}
.button.danger.ghost:hover {
  background-color: var(--meltline-color-base-container-default-dark-90) !important;
}
.button.danger.ghost:active {
  background-color: var(--meltline-color-base-container-default-dark-80) !important;
}
.button.danger.ghost:disabled {
  background: var(--meltline-color-base-container-muted, #F1F1F1) !important;
  border-color: transparent !important;
  border-width: 0 !important;
  opacity: 0.5;
  pointer-events: none;
  color: #0a539d !important;
}
.checkbox-container {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.checkbox-container:hover .checkbox-border {
  box-shadow: 0 0 0 2px var(--meltline-color-primary-inverse-20);
}
.checkbox-container.is-disabled {
  pointer-events: none;
}
.checkbox-container.is-error .checkbox-border {
  border-color: var(--meltline-color-destructive);
}
.checkbox-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}
.checkbox-input:checked + .checkbox-border {
  border-color: var(--meltline-color-primary);
}
.checkbox-input:focus-visible + .checkbox-border {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.checkbox-input:disabled + .checkbox-border {
  opacity: 0.5;
  background-color: var(--meltline-color-base-container-muted);
  border: 1px solid var(--meltline-color-base-stroke-default);
}
.checkbox-container.is-error .checkbox-input:checked + .checkbox-border {
  border-color: var(--meltline-color-destructive);
}
.checkbox-border {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid var(--meltline-color-base-stroke-default);
  border-radius: 2px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.checkbox-circle {
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 2px;
  pointer-events: none;
  background-color: var(--meltline-color-base-container-default);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  object-fit: contain;
}
.checkbox-input:checked + .checkbox-border .checkbox-circle {
  border-radius: 0%;
  background-color: var(--meltline-color-primary);
  background-image: url('../../smcimage/common/check.svg');
}
.checkbox-container.is-error .checkbox-input:checked + .checkbox-border .checkbox-circle {
  background-color: var(--meltline-color-destructive);
}
.checkbox-input:disabled + .checkbox-border .checkbox-circle {
  background-color: var(--meltline-color-base-container-muted);
  border-radius: 2px;
}
.checkbox-input.is-indeterminate:checked + .checkbox-border .checkbox-circle {
  background-image: url('/assets/smcimage/minus.svg');
}
.radio-container {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.radio-container.is-error .radio-border {
  border-color: var(--meltline-color-destructive);
}
.radio-container.is-error .radio-circle {
  background-color: var(--meltline-color-destructive);
}
.radio-container:hover .radio-border {
  box-shadow: 0 0 0 2px var(--meltline-color-primary-inverse-20);
}
.radio-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}
.radio-input:checked + .radio-border .radio-circle {
  transform: scale(1);
  pointer-events: none;
}
.radio-input:focus-visible + .radio-border {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.radio-border {
  position: relative;
  width: 16px;
  height: 16px;
  border: 1px solid var(--meltline-color-base-stroke-default);
  background-color: var(--meltline-color-base-container-default);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.radio-circle {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--meltline-color-primary);
  transform: scale(0);
  cursor: pointer;
}
select {
  width: 100%;
  height: auto;
  padding: 8px 28px 8px 12px;
}
select:focus {
  outline: none;
}
select:focus-visible {
  outline: none;
}
select:has(option:checked[value=""]) {
  color: var(--meltline-color-base-foreground-muted);
}
.select {
  width: 100%;
  position: relative;
  min-height: 40px;
  border: 1px solid var(--meltline-color-base-stroke-default);
  border-radius: 0px;
  background-color: var(--meltline-color-base-container-default);
  font-size: 14px;
  line-height: 1.4286;
  line-height: 1.5;
  transition: background 0.3s;
}
.select::after {
  content: '';
  position: absolute;
  inset-block: 0;
  right: 8px;
  width: 16px;
  height: 100%;
  background-image: url('../../smcimage/common/arrow-bottom-gray.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  pointer-events: none;
}
.select:hover {
  background-color: var(--meltline-color-base-container-default-inverse-90);
}
.select.is-error {
  border-color: var(--meltline-color-destructive);
}
.select:focus-within {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}
dialog.dialog {
  border: none;
  background: transparent;
  margin: auto;
  overflow: visible;
  width: 100%;
}
dialog.dialog::backdrop {
  background: rgba(0, 0, 0, 0.4);
  transition: opacity 0.3s;
  opacity: 1;
}
dialog.dialog.show-dialog .dialog-inner {
  transform: scale(0.9);
  opacity: 0;
}
dialog.dialog.show-dialog::backdrop {
  opacity: 0;
}
dialog.dialog.hide-dialog .dialog-inner {
  transform: scale(0.9);
  opacity: 0;
}
dialog.dialog.hide-dialog::backdrop {
  opacity: 0;
}
.dialog-inner {
  max-width: 672px;
  max-height: 90vh;
  transition: transform 0.3s, opacity 0.3s;
  transform: scale(1);
  opacity: 1;
  margin: auto;
}
.dialog-img-only {
  object-fit: contain;
  width: auto;
  height: 100%;
  max-height: 70vh;
}
.sidebar-navigation {
  background-color: var(--meltline-color-base-container-default);
  transition: background 0.3s;
}
.sidebar-navigation:hover {
  background-color: var(--meltline-color-base-container-default-dark-90);
}
.sidebar-navigation:active {
  background-color: var(--meltline-color-base-container-default-dark-80);
}
.sidebar-navigation.disabled {
  opacity: 0.5;
  pointer-events: none;
  color: #1e1e1e !important;
}
.sidebar-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  color: var(--meltline-color-primary);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.4;
  line-height: 1.25;
  text-decoration: none;
  cursor: pointer;
}
.sidebar-label:hover .hover-primary-underline {
  background-size: 100% 1px;
}
.sidebar-separator {
  background-color: #eaeaea !important;
  height: 2px;
}
.accordion summary {
  list-style: none;
  cursor: pointer;
}
.accordion.is-current[open] > div > .accordion-content > ul > li > details.accordion > summary.accordion-title {
  background-color: #f9fbfc !important;
}
.accordion-title {
  background-color: #ffffff !important;
  padding: 16px;
  font-size: 14px;
  line-height: 1.4286;
  line-height: 1.25;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  color: var(--meltline-color-base-foreground-default);
  transition: background-color 0.3s, color 0.3s;
}
.accordion-title:hover {
  color: #0a539d !important;
}
.accordion-title:focus-visible {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
}
.accordion-title.level-1 {
  padding-left: 16px;
}
.accordion-title.level-2 {
  padding-left: 32px;
}
.accordion-title.level-3 {
  padding-left: 48px;
}
.accordion-icon {
  transition: transform 0.3s;
}
.accordion.is-current > summary .accordion-icon--toggle {
  transform: rotate(180deg) !important;
}
.accordion.is-current:not(:has(.accordion.is-current)) > summary.accordion-title {
  background-color: #0a539d !important;
  color: #ffffff !important;
}
.accordion.is-current:not(:has(.accordion.is-current)) > summary.accordion-title:hover {
  background-color: #2364A7 !important;
}
.accordion.is-current:not(:has(.accordion.is-current)) > summary .accordion-icon--right {
  filter: brightness(0) invert(1);
}
.accordion.is-current:not(:has(.accordion.is-current)) > summary .accordion-icon--toggle {
  filter: brightness(0) invert(1);
}
details[open] > summary .accordion-icon--toggle {
  transform: rotate(180deg);
}
.breadcrumb {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  padding: 4px 0px;
  color: var(--meltline-color-base-foreground-muted);
  flex-wrap: wrap;

  ol {
    flex-wrap: wrap;
  }
}

.breadcrumb::-webkit-scrollbar {
  display: none;
}
.breadcrumb-item {
  color: var(--meltline-color-primary);
  background: linear-gradient(var(--meltline-color-primary), var(--meltline-color-primary));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size 0.3s, color 0.3s;
}
.breadcrumb-item:hover {
  background-size: 100% 1px;
}
.breadcrumb-item:focus-visible {
  outline: 2px solid var(--meltline-color-primary);
  outline-offset: 2px;
  border-radius: 4px;
}
.breadcrumb-item.is-disabled {
  color: var(--meltline-color-base-foreground-muted) !important;
  pointer-events: none;
  cursor: default;
  background-size: 0 1px;
}
.breadcrumb ol > li:last-child .breadcrumb-item {
  color: var(--meltline-color-base-foreground-default);
  pointer-events: none;
  background-size: 0 1px;
}
.breadcrumb-separator {
  color: var(--meltline-color-base-foreground-muted);
  user-select: none;
  width: 16px;
  height: 16px;
}
.table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--meltline-color-base-stroke-default);
}
.table:has(.th-sticky) {
  border: none;
}
.table tbody tr > th.th-sticky + td {
  border-left: none;
}
.th {
  position: relative;
  padding: 10px 12px;
  background-color: var(--meltline-color-base-container-muted);
  border: 1px solid var(--meltline-color-base-stroke-default);
  font-weight: 500;
  white-space: pre-wrap;
  font-size: 14px;
  line-height: 1.4286;
  line-height: 1.25;
}
.th.th-sticky {
  border-left: none;
  border-right: none;
  position: sticky;
  left: 0;
  z-index: 2;
}
.th.th-sticky::before {
  content: "";
  position: absolute;
  inset: 0;
  border-left: solid;
  border-right: solid;
  border-width: 1px;
  border-color: var(--meltline-color-base-stroke-default);
  width: 100%;
  height: 100%;
  z-index: 3;
}
.td {
  padding: 14px 12px;
  background-color: var(--meltline-color-base-container-default);
  border: 1px solid var(--meltline-color-base-stroke-default);
  font-weight: 500;
}
.badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0px 10px;
  font-weight: 500;
  line-height: 1;
  border-radius: 9999px;
  flex-shrink: 0;
}
.badge.small {
  font-size: 12px;
  height: 24px;
}
.badge.large {
  font-size: 16px;
  height: 28px;
}
.badge.filled {
  background-color: var(--meltline-color-primary);
  color: var(--meltline-color-base-foreground-on-fill);
}
.badge.outlined {
  border: 1px solid var(--meltline-color-primary);
}
.hover-primary-underline {
  background: linear-gradient(var(--meltline-color-primary), var(--meltline-color-primary));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size 0.3s ease, color 0.3s ease;
}
.hover-primary-underline:hover {
  background-size: 100% 1px;
}
.flex-1 {
  flex: 1 1 0%;
}
.js-mylist-btn img {
  transition: opacity 0.2s;
}
.js-mylist-btn .js-icon-check {
  display: none;
}
.js-mylist-btn:hover img {
  opacity: 0.9;
}
.js-mylist-btn:active img {
  opacity: 0.8;
}
.js-mylist-btn.is-added .js-icon-plus {
  display: none;
}
.js-mylist-btn.is-added .js-icon-check {
  display: block;
}
.js-mylist-btn.is-added:hover img,
.js-mylist-btn.is-added:active img {
  opacity: 1;
}
.js-mylist-btn .tooltip-text {
  position: absolute;
  bottom: 100%;
  margin-bottom: 8px;
  right: 50%;
  transform: translateX(50%);
  z-index: 9999;
  height: 22px;
  padding: 6px 12px;
  background-color: var(--meltline-color-base-container-deep);
  color: var(--meltline-color-base-foreground-on-fill);
  border-radius: 6px;
  font-weight: 500;
  white-space: nowrap;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  font-size: 12px;
  line-height: 1.3333;
  line-height: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}
span.tooltip-text:hover img  {
  opacity: 1;
}
span.tooltip-text {
  position: absolute;
  bottom: 100%;
  margin-bottom: 8px;
  right: 50%;
  transform: translateX(50%);
  z-index: 9999;
  height: 22px;
  padding: 6px 12px;
  background-color: var(--meltline-color-base-container-deep);
  color: var(--meltline-color-base-foreground-on-fill);
  border-radius: 6px;
  font-weight: 500;
  white-space: nowrap;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  font-size: 12px;
  line-height: 1.3333;
  line-height: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}
.js-mylist-btn:hover .tooltip-text,
.js-mylist-btn.is-showing-message .tooltip-text {
  visibility: visible;
  opacity: 1;
}
.info-separator {
  margin: 16px 0px;
}
.info-separator:has(+ .info-description) {
  margin: 8px 0px;
}
.text-responsive {
  font-size: clamp(20px, 2.5vw, 36px);
}
.flex-160 {
  flex: 0 0 160px;
}
.flex-200 {
  flex: 0 0 200px;
}
.flex-auto-500 {
  flex: 1 1 500px;
}
.flex-auto-600 {
  flex: 1 1 600px;
}
.video-container {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.video-container iframe {
  width: 100% !important;
  height: 100% !important;
  border: none;
}
.inline-flex {
  display: inline-flex;
}
@media screen and (max-width: 1023px) {
  .m-w26 {
    width: 26px !important;
  }
  .m-h26 {
    height: 26px !important;
  }
  .m-s26 {
    width: 26px !important;
    height: 26px !important;
  }
  .m-w52 {
    width: 52px !important;
  }
  .m-h52 {
    height: 52px !important;
  }
  .m-s52 {
    width: 52px !important;
    height: 52px !important;
  }
  .m-w92 {
    width: 92px !important;
  }
  .m-h92 {
    height: 92px !important;
  }
  .m-s92 {
    width: 92px !important;
    height: 92px !important;
  }
  .m-w358 {
    width: 358px !important;
  }
  .m-h358 {
    height: 358px !important;
  }
  .m-s358 {
    width: 358px !important;
    height: 358px !important;
  }
  .m-w310 {
    width: 310px !important;
  }
  .m-h310 {
    height: 310px !important;
  }
  .m-s310 {
    width: 310px !important;
    height: 310px !important;
  }
  .m-p6 {
    padding: 6px !important;
  }
  .m-pt6 {
    padding-top: 6px !important;
  }
  .m-pr6 {
    padding-right: 6px !important;
  }
  .m-pb6 {
    padding-bottom: 6px !important;
  }
  .m-pl6 {
    padding-left: 6px !important;
  }
  .m-px6 {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  .m-py6 {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  .m-p10 {
    padding: 10px !important;
  }
  .m-pt10 {
    padding-top: 10px !important;
  }
  .m-pr10 {
    padding-right: 10px !important;
  }
  .m-pb10 {
    padding-bottom: 10px !important;
  }
  .m-pl10 {
    padding-left: 10px !important;
  }
  .m-px10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .m-py10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .m-p44 {
    padding: 44px !important;
  }
  .m-pt44 {
    padding-top: 44px !important;
  }
  .m-pr44 {
    padding-right: 44px !important;
  }
  .m-pb44 {
    padding-bottom: 44px !important;
  }
  .m-pl44 {
    padding-left: 44px !important;
  }
  .m-px44 {
    padding-left: 44px !important;
    padding-right: 44px !important;
  }
  .m-py44 {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
  .m-p48 {
    padding: 48px !important;
  }
  .m-pt48 {
    padding-top: 48px !important;
  }
  .m-pr48 {
    padding-right: 48px !important;
  }
  .m-pb48 {
    padding-bottom: 48px !important;
  }
  .m-pl48 {
    padding-left: 48px !important;
  }
  .m-px48 {
    padding-left: 48px !important;
    padding-right: 48px !important;
  }
  .m-py48 {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .m-m36 {
    margin: 36px !important;
  }
  .m-mt36 {
    margin-top: 36px !important;
  }
  .m-mr36 {
    margin-right: 36px !important;
  }
  .m-mb36 {
    margin-bottom: 36px !important;
  }
  .m-ml36 {
    margin-left: 36px !important;
  }
  .m-mx36 {
    margin-left: 36px !important;
    margin-right: 36px !important;
  }
  .m-my36 {
    margin-top: 36px !important;
    margin-bottom: 36px !important;
  }
  .m-m48 {
    margin: 48px !important;
  }
  .m-mt48 {
    margin-top: 48px !important;
  }
  .m-mr48 {
    margin-right: 48px !important;
  }
  .m-mb48 {
    margin-bottom: 48px !important;
  }
  .m-ml48 {
    margin-left: 48px !important;
  }
  .m-mx48 {
    margin-left: 48px !important;
    margin-right: 48px !important;
  }
  .m-my48 {
    margin-top: 48px !important;
    margin-bottom: 48px !important;
  }
  .m-text-xs {
    font-size: 12px;
    line-height: 1.3333;
  }
  .m-text-sm {
    font-size: 14px;
    line-height: 1.4286;
  }
  .m-text-base {
    font-size: 16px;
    line-height: 1.5;
  }
  .m-text-medium {
    font-size: 18px;
    line-height: 1.5556;
  }
  .m-text-lg {
    font-size: 20px;
    line-height: 1.4;
  }
  .m-text-2xl {
    font-size: 24px;
    line-height: 1.3333;
  }
  .m-text-3xl {
    font-size: 28px;
    line-height: 1.2;
  }
  .m-text-4xl {
    font-size: 32px;
    line-height: 1.15;
  }
  .m-text-5xl {
    font-size: 36px;
    line-height: 1.1111;
  }
  .m-text-6xl {
    font-size: 40px;
    line-height: 1;
  }
  .m-text-7xl {
    font-size: 60px;
    line-height: 1;
  }
  .m-text-8xl {
    font-size: 72px;
    line-height: 1;
  }
  .m-text-9xl {
    font-size: 96px;
    line-height: 1;
  }
  .m-text-10xl {
    font-size: 128px;
    line-height: 1;
  }
  .m-leading-none {
    line-height: 1;
  }
  .m-leading-tight {
    line-height: 1.25;
  }
  .m-leading-snug {
    line-height: 1.375;
  }
  .m-leading-normal {
    line-height: 1.5;
  }
  .m-leading-relaxed {
    line-height: 1.625;
  }
  .m-leading-loose {
    line-height: 2;
  }
  .m-align-self-baseline {
    align-self: baseline !important;
  }
  .m-fclm {
    flex-direction: column !important;
  }
  .m-fbw {
    justify-content: space-between;
  }
  .m-fm-reset {
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    align-items: stretch;
  }
  .m-gap-8 {
    gap: 8px;
  }
  .m-gap-16 {
    gap: 16px;
  }
  .m-gap-24 {
    gap: 24px;
  }
  .m-gap-32 {
    gap: 32px;
  }
  .m-gap-36 {
    gap: 36px;
  }
  .m-gap-40 {
    gap: 40px;
  }
  .m-h56 {
    height: 56px;
  }
  .m-h160 {
    height: 160px;
  }
  .m-h234 {
    height: 234px;
  }
  .m-max-w-none {
    max-width: none;
  }
  .m-max-width-358 {
    max-width: 358px;
  }
  .m-min-w-100 {
    min-width: 100px;
  }
  .m-fw6 {
    font-weight: 600 !important;
  }
  .m-fw5 {
    font-weight: 500 !important;
  }
  .m-border-none {
    border: none;
  }
  .m-max-width-358 {
    max-width: 358px;
  }
  .m-gcol1 {
    grid-template-columns: repeat(1, 1fr);
  }
  header.is-hamburger-open .hamburger-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  header.is-hamburger-open + .js-close-bg {
    opacity: 1;
    visibility: visible;
    background-color: #ffffff !important;
  }
  .min-w-680 {
    min-width: 680px;
  }
  .m-min-w-700 {
    min-width: 700px;
  }
  .button.m-is-square {
    aspect-ratio: 1 / 1;
    padding: 0 !important;
  }
  .button.m-is-square.m-small {
    width: 36px;
    min-height: 36px;
  }
  .button.m-is-square.m-medium {
    width: 40px;
    min-height: 40px;
  }
  .button.m-is-square.m-large {
    width: 44px;
    min-height: 44px;
  }
  .m-grid-none {
    grid: none;
  }
  .m-grid-autofit-180 {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
  .m-grid-autofit-230 {
    grid-template-columns: 1fr;
  }
  .grid-autofit-360 {
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  }
  .m-grid-autofit-500 {
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
  }
  .m-border-bottom {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: var(--meltline-color-base-stroke-default);
  }
  .m-border-right-none {
    border-right: none !important;
  }
  .m-border-left-none {
    border-left: none;
  }
  .m-border-bottom-not-last:last-child {
    border: none;
  }
  .m-bg-image-none {
    background-image: none;
  }
  .m-flex-none {
    flex: none;
  }
  .m-flex-auto {
    flex: 1 1 auto;
  }
  .js-mylist-btn .tooltip-text {
    right: 0%;
    transform: none;
    margin-right: 0px;
  }
  .js-mylist-btn:hover .tooltip-text {
    visibility: hidden;
    opacity: 0;
  }
  .js-mylist-btn.is-showing-message .tooltip-text {
    visibility: visible;
    opacity: 1;
  }
  .link-circle-large {
    width: 24px;
    height: 24px;
  }
}
@media screen and (max-width: 767px) {
  .s-w52 {
    width: 52px !important;
  }
  .s-h52 {
    height: 52px !important;
  }
  .s-s52 {
    width: 52px !important;
    height: 52px !important;
  }
  .s-w92 {
    width: 92px !important;
  }
  .s-h92 {
    height: 92px !important;
  }
  .s-s92 {
    width: 92px !important;
    height: 92px !important;
  }
  .s-p48 {
    padding: 48px !important;
  }
  .s-pt48 {
    padding-top: 48px !important;
  }
  .s-pr48 {
    padding-right: 48px !important;
  }
  .s-pb48 {
    padding-bottom: 48px !important;
  }
  .s-pl48 {
    padding-left: 48px !important;
  }
  .s-px48 {
    padding-left: 48px !important;
    padding-right: 48px !important;
  }
  .s-py48 {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .s-m36 {
    margin: 36px !important;
  }
  .s-mt36 {
    margin-top: 36px !important;
  }
  .s-mr36 {
    margin-right: 36px !important;
  }
  .s-mb36 {
    margin-bottom: 36px !important;
  }
  .s-ml36 {
    margin-left: 36px !important;
  }
  .s-mx36 {
    margin-left: 36px !important;
    margin-right: 36px !important;
  }
  .s-my36 {
    margin-top: 36px !important;
    margin-bottom: 36px !important;
  }
  .s-m48 {
    margin: 48px !important;
  }
  .s-mt48 {
    margin-top: 48px !important;
  }
  .s-mr48 {
    margin-right: 48px !important;
  }
  .s-mb48 {
    margin-bottom: 48px !important;
  }
  .s-ml48 {
    margin-left: 48px !important;
  }
  .s-mx48 {
    margin-left: 48px !important;
    margin-right: 48px !important;
  }
  .s-my48 {
    margin-top: 48px !important;
    margin-bottom: 48px !important;
  }
  .s-text-xs {
    font-size: 12px;
    line-height: 1.3333;
  }
  .s-text-sm {
    font-size: 14px;
    line-height: 1.4286;
  }
  .s-text-base {
    font-size: 16px;
    line-height: 1.5;
  }
  .s-text-medium {
    font-size: 18px;
    line-height: 1.5556;
  }
  .s-text-lg {
    font-size: 20px;
    line-height: 1.4;
  }
  .s-text-2xl {
    font-size: 24px;
    line-height: 1.3333;
  }
  .s-text-3xl {
    font-size: 28px;
    line-height: 1.2;
  }
  .s-text-4xl {
    font-size: 32px;
    line-height: 1.15;
  }
  .s-text-5xl {
    font-size: 36px;
    line-height: 1.1111;
  }
  .s-text-6xl {
    font-size: 40px;
    line-height: 1;
  }
  .s-text-7xl {
    font-size: 60px;
    line-height: 1;
  }
  .s-text-8xl {
    font-size: 72px;
    line-height: 1;
  }
  .s-text-9xl {
    font-size: 96px;
    line-height: 1;
  }
  .s-text-10xl {
    font-size: 128px;
    line-height: 1;
  }
  .s-leading-none {
    line-height: 1;
  }
  .s-leading-tight {
    line-height: 1.25;
  }
  .s-leading-snug {
    line-height: 1.375;
  }
  .s-leading-normal {
    line-height: 1.5;
  }
  .s-leading-relaxed {
    line-height: 1.625;
  }
  .s-leading-loose {
    line-height: 2;
  }
  .s-align-self-baseline {
    align-self: baseline !important;
  }
  .s-fclm {
    flex-direction: column;
  }
  .s-fbw {
    justify-content: space-between;
  }
  .s-gap-8 {
    gap: 8px;
  }
  .s-gap-36 {
    gap: 36px !important;
  }
  .s-gap-24 {
    gap: 24px;
  }
  .s-gap-16 {
    gap: 16px;
  }
  .s-gap-32 {
    gap: 32px;
  }
  .s-gap-40 {
    gap: 40px;
  }
  .s-h56 {
    height: 56px;
  }
  .s-h160 {
    height: 160px;
  }
  .s-h234 {
    height: 234px;
  }
  .s-max-w-none {
    max-width: none;
  }
  .s-min-w-100 {
    min-width: 100px;
  }
  .s-fw6 {
    font-weight: 600 !important;
  }
  .s-fw5 {
    font-weight: 500 !important;
  }
  .s-border-none {
    border: none;
  }
  .s-border-bottom {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: var(--meltline-color-base-stroke-default);
  }
  .s-border-right-none {
    border-right: none;
  }
  .s-border-left-none {
    border-left: none;
  }
  .s-border-bottom-not-last:last-child {
    border: none;
  }
  .button.s-is-square {
    aspect-ratio: 1 / 1;
    padding: 0 !important;
  }
  .button.s-is-square.s-small {
    width: 36px;
    min-height: 36px;
  }
  .button.s-is-square.s-medium {
    width: 40px;
    min-height: 40px;
  }
  .button.s-is-square.s-large {
    width: 44px;
    min-height: 44px;
  }
  .s-grid-autofit-160 {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }
  .s-grid-autofit-230 {
    grid-template-columns: 1fr;
  }
  .s-grid-autofit-260 {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  }
  .s-gcol1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .s-gcol2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .s-grid-none {
    grid: none;
  }
  .s-bg-image-none {
    background-image: none;
  }
  .s-flex-none {
    flex: none;
  }
  .s-flex-auto {
    flex: 1 1 auto;
  }
}
@media screen and (max-width: 1218px) {
  .side-nav-top {
    top: 233px;
  }
}


/* =====================
 2603追加 TOPIX
===================== */

.topix-modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
display:none;
z-index:9999;
}

.topix-modal.active{
display:block;
}

.topics-modal-bg{
position:absolute;
inset:0;
background:rgba(0,0,0,0.7);
}

.topics-modal-wrap{
position:relative;
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
padding:40px;
}

.topics-modal-box{
position:relative;
width:100%;
max-width:1200px;
}

.topics-modal-close{
position:absolute;
top:-40px;
right:-10px;
font-size:36px;
color:#fff;
cursor:pointer;
}


.topics-inner{
border:16px solid #dcdcdc;
background:#fff;
padding:30px;
min-height:560px;
position:relative;
}

.topics-title{
font-size:26px;
font-weight:700;
color:#0073c5;
margin-bottom:20px;
}


.topics-title_w {
    width: 100%;
    height: 43px;
    margin: 0 auto;
    background: url(../../smc_img/top/top_line_w.png) top 0 right -920px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom:6px;
}


.topics-content{
display:flex;
gap:40px;
}

.topics-left{
width:46%;
}

.topics-right{
width:54%;
display:flex;
gap:20px;
}

.topics-btn-col{
width:50%;
}

.popup_txt{
font-size:14px;
line-height:1.4;
}


.popup_contents_btn{
margin-bottom:10px;
}

.popup_contents_btn a{
display:block;
padding:12px 16px;
border:1px solid #0072C1;
background:#fff;
color:#000;
position:relative;
}

.popup_contents_btn a:hover{
background:#cde2f1;
}

.popup_contents_btn a:after{
content:"";
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
width:8px;
height:13px;
background:url(../../smc_img/common/arrow_blue01.png) no-repeat center;
background-size:contain;
}

.inner_ams{
background:
url(../../smc_img/popup/electropneumatic_regulator_img/air_management_system_products.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/electropneumatic_regulator_img/air_management_system_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_vba{
background:
url(../../smc_img/popup/vba_img/vba_products01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/vba_img/vba_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_temp{
background:
url(../../smc_img/popup/temp_img/temp_products.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/temp_img/temp_back.jpg) no-repeat center center;
background-size:cover;
min-height:700px;
}

.inner_electric{
background:
url(../../smc_img/popup/electric_img/electric_products_01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/electric_img/electric_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_vacuum{
background:
url(../../smc_img/popup/vacuum_img/vacuum_products_01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/vacuum_img/vacuum_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_static{
background:
url(../../smc_img/popup/static_img/static_products_01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/static_img/static_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_link{
background:
url(../../smc_img/popup/link_img/link_products_01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/link_img/link_back.jpg) no-repeat center center;
background-size:cover;
}

.inner_valves{
background:
url(../../smc_img/popup/process_valves_img/process_valves_products_01.png) no-repeat left 10% bottom 10%,
url(../../smc_img/popup/process_valves_img/process_valves_back.jpg) no-repeat center center;
background-size:cover;
}




@media screen and (max-width: 767px) {

  .topix-modal{
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .topics-modal-wrap{
    display: block;
    height: auto;
    min-height: 100%;
    padding: 16px;
  }

  .topics-modal-box{
    max-width: none;
    width: 100%;
    margin: 40px 0 24px;
  }

  .topics-modal-close{
    top: -34px;
    right: 0;
    font-size: 28px;
    line-height: 1;
  }

  .topics-inner{
    padding: 16px;
    border-width: 8px;
    min-height: auto;
  }

  .topics-title{
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 12px;
  }

  .topics-title_w{
    min-width: 0;
    width: 100%;
    height: auto;
    padding: 0 0 8px;
    background-position: top 0 right -1130px;
    background-size: cover;
    margin-bottom: 12px;
  }

  .topics-content{
    display: block;
  }

  .topics-left,
  .topics-right{
    width: 100%;
  }

  .topics-left{
    margin-bottom: 16px;
  }

  .topics-right{
    display: block;
  }

  .topics-btn-col{
    width: 100%;
  }

  .popup_txt{
    font-size: 12px;
    line-height: 1.5;
  }

  .popup_contents_btn{
    margin-bottom: 8px;
  }

  .popup_contents_btn a{
    padding: 10px 34px 10px 12px;
    font-size: 12px;
    line-height: 1.5;
  }

  .popup_contents_btn a:after{
    right: 10px;
    width: 7px;
    height: 11px;
  }

  .inner_ams,
  .inner_vba,
  .inner_temp,
  .inner_electric,
  .inner_vacuum,
  .inner_static,
  .inner_link,
  .inner_valves{
    background-position: 66% bottom 6px, center center;
    background-size: 145%, cover;
  }

  .inner_ams,
  .inner_vba,
  .inner_electric,
  .inner_vacuum,
  .inner_static,
  .inner_link,
  .inner_valves{
    padding-bottom: 220px;
  }

  .inner_temp{
    min-height: auto;
    padding-bottom: 240px;
    background-size: 145%, cover;
  }
}


/* ==================================
 2603追加 WEBCatalogダミー
================================== */
.tile-grid-wrap{
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
}

.tile-grid-fixed{
  grid-template-columns: repeat(3, 370px);
}

.tile-grid-wrap_4{
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
}

.tile-grid-fixed_4{
  grid-template-columns: repeat(4, 276px);
}


.tile-dummy{
  min-height: 1px;
  background: transparent;
}

@media screen and (max-width: 767px){
  .tile-grid-wrap{
    display: block;
    width: 100%;
  }

  .tile-grid-fixed{
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }

  .tile-grid-wrap_4{
    display: block;
    width: 100%;
  }

  .tile-grid-fixed_4{
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }
}


.tools-grid{
  grid-template-columns: repeat(auto-fit, minmax(266px, max-content));
  justify-content: start;
}

.tools-grid_w{
  grid-template-columns: repeat(auto-fit, minmax(256px, max-content));
  justify-content: start;
}



@media screen and (max-width: 767px){
  .tools-grid{
    grid-template-columns: 1fr;
  }
  .tools-grid_w{
    grid-template-columns: 1fr;
  }
}

.button-manifold{
  background: #ffe34d;
  border: 1px solid #0b67b2;
  color: #0b67b2;
}

.button-manifold:hover{
  background: #ffdb1f;
}


.mega-close-btn{
  font-size: 32px;
  line-height: 1;
  padding: 4px 14px;
  position: relative;
 margin-left: 16px;
}

.overflow-wrap-break-word {
  overflow-wrap: break-word;
}

/* ==================================
 2604追加 選定プログラムボタン
================================== */

.tools-grid-2col{
  grid-template-columns: 420px 420px;
  justify-content: center;
}



/* ==================================
 2604追加 langage 吹き出し
================================== */

.lang-menu {
    position: relative;
    list-style: none;
}

.lang-menu > a {
    display: flex;
    text-decoration: none;
}

.lang-menu > a:hover {
    background: rgba(0,114,193,0.08);
}

.lang-menu .lang-submenu {
    position: absolute;
    top: 46px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    margin: 0;
    padding: 10px 0 0;
    list-style: none;
}

.lang-menu .lang-submenu li {
    display: none;
    height: 0;
    background: #0a539d;
    color: #fff;
    white-space: nowrap;
    position: relative;
    border-bottom: 1px solid #f2f2f2;
}

.lang-menu .lang-submenu li:last-child {
    border-bottom: none;
}

.lang-menu .lang-submenu li:first-child::before {
    content: "";
    position: absolute;
    top: -16px;
    left: 50%;
    margin-left: -8px;
    border: 8px solid transparent;
    border-bottom: 8px solid #0a539d;
}

.lang-menu .lang-submenu li a {
    display: block;
    color: #fff;
    padding: 0 34px;
    line-height: 32px;
    text-decoration: none;
    text-align: center;
    font-size: 15px;
}

.lang-menu .lang-submenu li a:hover {
    background: rgba(255,255,255,0.18);
    color: #fff;
}

.lang-menu:hover .lang-submenu li {
    display: block;
    height: 32px;
}

.hero { position: relative; overflow: hidden; min-height: 390px; display: grid; align-items: center; background: linear-gradient(90deg,rgba(2,21,49,.94) 0%,rgba(2,37,84,.9) 44%,rgba(0,70,155,.9) 100%);}
.hero::after { content: ""; position: absolute; inset: auto 0 0 auto; width: 38%; height: 76%; background: linear-gradient(135deg, transparent 0 42%, rgb(15 67 131 / 90%) 42% 100%); }
.hero__inner { position: relative; z-index: 1; max-width: 1456px; margin: 0 auto; padding: 82px 72px; color: #fff; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 18px; color: #20a3ff; font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 34px; height: 3px; border-radius: 999px; background: #20a3ff; }
.hero h1 { margin: 0; font-size: clamp(42px,6vw,82px); line-height: .95; font-weight: 800; }
.hero p { max-width: 820px; margin: 28px 0 0; font-size: 18px; line-height: 1.9; font-weight: 600; }
.bg-motif{background-attachment: fixed;
    background-image: url(../../image/common/motif-background.png);
    background-repeat: no-repeat;
    background-position: center center;
    object-fit: cover;
    background-size: 100%;}

    @media screen and (max-width: 1024px){
  .tools-grid-2col{
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (max-width: 767px){
  .tools-grid-2col{
    grid-template-columns: 1fr;
  }
  .bg-motif{background-image: url(../../image/common/motif-background2.png);}
}