/* 3ページ共通のCSS。STUDIO書き出しのインライン<style>から抽出。
   ページ固有のCSS（.sd-N / .symbol-N__sd-N）は各HTMLにインラインのまま。
   読み込み位置は元のリセットCSSと同じ位置に固定してある。
   FontAwesome は廃止し、SNS アイコンは inline SVG にした（詳細は README の「アイコン」）。 */

/* 実際に使う 12 グリフだけに絞ったサブセット（110KB -> 1.4KB）。
   アイコン名は rlig の合字で解決されるので、名前を増やすときはサブセットを作り直すこと。 */
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Material Icons'), local('MaterialIcons-Regular'),
url('../material-icons/MaterialIcons-Regular.woff2')
  format('woff2');
}
.material-icons {
display: flex;
font-family: Material Icons;
font-size: 24px;
font-style: normal;
font-weight: 400;
letter-spacing: normal;
line-height: 1;
text-transform: none;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased
}

/* SNS アイコンは inline SVG（もと FontAwesome のアイコンフォント）。
   アイコンフォントと同じく .icon の font-size で大きさが決まるよう height を 1em にし、
   色は currentColor で .icon の color / :hover をそのまま引き継ぐ。
   アイコン 2 個のために 300KB 近いフォントを配っていたのをやめた形。 */
.icon > svg {
  height: 1em;
  width: auto;
  flex: none;
  fill: currentColor;
}

/* 本文の main ランドマーク。display:contents なのでレイアウトには一切影響しない
   （.sd-1 の flex の子は header / 各 section / footer のまま）。 */
.sd-main {
  display: contents;
}

html {
  height: 100%;
  padding: 0;
  margin: 0;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  display: block;

  min-height: 100vh;
  min-height: 100dvh;
  background: #fff;
  font-family: sans-serif;
  line-height: 1;
  transition: background 0.5s cubic-bezier(0.4, 0.4, 0, 1);
  padding: 0;
  margin: 0;
}

a {
  background: transparent;
  color: rgb(51, 51, 51);
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  border: none;
  text-decoration: none;
}

button {
  background: transparent;
  color: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  border: none;
}

button {
  pointer-events: all;
  cursor: pointer;
  user-select: none;
}

hr {
  border: 0;
  border-top: 1px solid #ccc;
  display: block;
  height: 1px;
  margin: 1em 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  color: rgb(51, 51, 51);
  line-height: 1;
}

.img,
.box,
.text,
.frame,
.section,
.section-inner,
.input,
.toggle,
.icon,
.video,
.video-container {
  border: 0;
  box-sizing: border-box;
  max-width: 100%;
  z-index: 0;
  position: relative;
  margin: 0;
  padding: 0;
  flex: none;
}

.img {
  height: auto;
}

.img,
.box,
.text,
.frame,
.section,
.section-inner,
.toggle,
.icon,
.video-container {
  transition: all 0.3s cubic-bezier(0.4, 0.4, 0, 1);
  transition-property: all, --g-angle, --g-color-0, --g-position-0, --g-color-1, --g-position-1, --g-color-2, --g-position-2, --g-color-3, --g-position-3, --g-color-4, --g-position-4, --g-color-5, --g-position-5, --g-color-6, --g-position-6, --g-color-7, --g-position-7, --g-color-8, --g-position-8, --g-color-9, --g-position-9, --g-color-10, --g-position-10, --g-color-11, --g-position-11;
  list-style: none;
  margin: 0;
  padding: 0;
  text-decoration: none;
  align-content: center;
}







.box,
.frame,
.section,
.toggle,
.video-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.img,
.text,
.icon {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: center;
  overflow-wrap: anywhere;
  word-break: break-word;
  z-index: 0;
}

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







dialog {
  border: none;
  background-color: transparent;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  max-width: none;
  max-height: none;
  box-sizing: border-box;

  overflow: visible;

&[open] {
    display: flex;
  }

&::backdrop {
    background: transparent;
  }
}

.modal-container {

  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}

.modal-container > * {
  pointer-events: auto;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}









.image__bg-container {
  container-type: size;
  container-name: image-container;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: -2;
  border-radius: inherit;
  transition: inherit;
}

.image__bg-container::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: var(--img-current);
  background-position: 50%;
  background-size: cover;
  border-radius: inherit;
  transition-duration: inherit;
  transition-timing-function: inherit;
  transition-delay: inherit;

  transition-property:
    filter, backdrop-filter, opacity, color,
    background-color, background-position, background-size,
    border, border-color, border-width, border-radius,
    outline, outline-color, outline-width, outline-offset,
    box-shadow, text-shadow, transform, transform-origin,
    width, height, margin, padding,
    top, left, right, bottom, z-index, gap,
    letter-spacing, word-spacing, line-height, font-size, font-weight,
    clip-path;
}

@media (min-resolution: 1.5dppx) {

  .image--horizontal .image__bg-container::before {
    --img-current: var(--img-small);
  }

  @container (aspect-ratio < 1) and (width < 300px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (aspect-ratio < 0.5) and (width < 300px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (300px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (300px <= width < 500px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (300px <= width < 500px) and (aspect-ratio < 0.5) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (500px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (500px <= width < 901px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (901px <= width) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }









}

@media (min-resolution: 1dppx) and (max-resolution: 1.5dppx) {

  .image--horizontal .image__bg-container::before {
    --img-current: var(--img-small);
  }

  @container (aspect-ratio < 1) and (width < 400px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (aspect-ratio < 0.5) and (width < 400px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (400px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (400px <= width < 667px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (400px <= width < 667px) and (aspect-ratio < 0.5) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (667px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (667px <= width < 1201px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (1201px <= width) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }









}

@media (max-resolution: 1dppx) {

  .image--horizontal .image__bg-container::before {
    --img-current: var(--img-small);
  }

  @container (aspect-ratio < 1) and (width < 600px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (aspect-ratio < 0.5) and (width < 600px) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (600px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-middle);
    }
  }

  @container (600px <= width < 1000px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (600px <= width < 1000px) and (aspect-ratio < 0.5) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (1000px <= width) and (aspect-ratio >= 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-regular);
    }
  }

  @container (1000px <= width < 1801px) and (aspect-ratio < 1) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }

  @container (1801px <= width) {
    .image--horizontal .image__bg-container::before {
      --img-current: var(--img-origin);
    }
  }









}






.text {

  -webkit-font-smoothing: antialiased;
  position: relative;
  line-height: 1;
  word-spacing: 1px;

}
















.sd-1 {

  min-height: 100vh;
  min-height: 100dvh;
  overflow: clip;
}

@property --g-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 180deg;
}
@property --g-color-0 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-0 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0.01%;
}
@property --g-color-1 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-1 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-2 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-2 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-3 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-3 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-4 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-4 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-5 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-5 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-6 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-6 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-7 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-7 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-8 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-8 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-9 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-9 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-10 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-10 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --g-color-11 {
  syntax: "<color>";
  inherits: false;
  initial-value: transparent;
}
@property --g-position-11 {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}




/* Google Tag Manager の noscript iframe。
   noscript の中身は JS 無効時にしか描画されないので、
   非表示化は CSS で行う必要がある（もと style 属性）。 */
.gtm-noscript-frame {
  display: none;
  visibility: hidden;
}

/* ---- 3 ページ共通のヘッダー / フッター / モーダル ----
   もとは各ページの CSS に同じ内容が 3 重に入っていた。base.css に集めることで、
   2 ページ目以降の遷移でこのぶんの再ダウンロードが起きなくなる。
   @media の中の上書きはページ CSS に残してある（ページ CSS の方が後に
   読まれるので、上書き関係は変わらない）。 */
body { background:#080404; }
.symbol-1 { align-content:center; align-items:center; background:rgba(0,0,0,0.0); flex:none; flex-direction:row; flex-wrap:nowrap; height:80px; justify-content:space-between; margin:0; padding:0px 20px; position:relative; width:100%; z-index:1; max-width:100%; }
.symbol-1__sd-1 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; padding:0px; }
.symbol-1__sd-2 { flex:none; height:35px; width:136px; max-width:100%; }
.symbol-1__sd-3 { display:none; font-size:24px; }
.modal-1__backdrop { background:rgba(0, 0, 0, 0.68); border-radius:0; }
.modal-1__container { height:100%; justify-content:center; margin:0; opacity:1; padding:0; width:100%; }
.modal-1__sd-1 { background:#FFFFFF; border-radius:10px; box-shadow:0px 6px 15px 0px rgba(0,0,0,0.2); flex:none; height:auto; margin:20px; opacity:1; padding:21px; width:400px; max-width:calc(100% - 40px); }
.modal-1__sd-2 { flex:none; height:auto; width:100px; max-width:100%; }
.modal-1__sd-2:before { background-repeat:no-repeat; background-size:contain; }
.modal-1__sd-3 { background:#bebdbd; flex:none; height:1px; margin:10px 0px; width:100%; max-width:100%; }
.modal-1__sd-4 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; padding:0px; }
.modal-1__sd-5 { color:#333; font-size:24px; height:24px; margin:0px; padding:0px; width:24px; max-width:100%; }
.modal-1__sd-6 { color:#333333; font-family:var(--s-font-44a3a023); font-size:16px; font-weight:400; height:auto; letter-spacing:0.1em; line-height:1.2; margin:0px 16px; padding:0px; text-align:center; width:auto; justify-content:center; max-width:calc(100% - 32px); }
.modal-1__sd-6:hover { color:#606060; }
.modal-1__sd-7 { background:#bebdbd; flex:none; height:1px; margin:10px 0px; width:100%; max-width:100%; }
.modal-1__sd-8 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; padding:0px; }
.modal-1__sd-9 { color:#333; font-size:24px; }
.modal-1__sd-10 { color:#333333; font-family:var(--s-font-44a3a023); font-size:16px; font-weight:400; height:auto; letter-spacing:0.1em; line-height:1.2; margin:0px 16px; padding:0px 1px 0px 0px; text-align:center; width:auto; justify-content:center; max-width:calc(100% - 32px); }
.modal-1__sd-10:hover { color:#606060; }
.modal-1__sd-11 { background:#bebdbd; flex:none; height:1px; margin:10px 0px; width:100%; max-width:100%; }
.modal-1__sd-12 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; padding:0px; }
.modal-1__sd-13 { color:#333; font-size:24px; padding:0px; }
.modal-1__sd-14 { color:#333333; font-family:var(--s-font-44a3a023); font-size:16px; font-weight:400; height:auto; letter-spacing:0.1em; line-height:1.2; margin:0px 16px; padding:0px; text-align:center; width:auto; justify-content:center; max-width:calc(100% - 32px); }
.modal-1__sd-14:hover { color:#606060; }
.modal-1__sd-15 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; height:22px; justify-content:center; padding:1px; }
.modal-1__sd-16 { color:#FFFFFF; font-size:15px; width:24px; max-width:100%; }
.modal-1__sd-17 { color:#FFFFFF; font-family:var(--s-font-bb8e9a58); font-size:14px; font-weight:900; height:auto; line-height:1.4; margin:0px 0px 0px 16px; padding:0px; text-align:center; width:auto; justify-content:center; max-width:calc(100% - 16px); }
.symbol-1__sd-4 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 40px 0px 0px; padding:0px; max-width:calc(100% - 40px); }
.symbol-1__sd-5 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 0px 0px 30px; mix-blend-mode:normal; padding:0px; max-width:calc(100% - 30px); }
.symbol-1__sd-5[data-current] { opacity:1; }
.symbol-1__sd-5:hover { opacity:1; }
.symbol-1__sd-6 { color:#EEEEEE; font-family:var(--s-font-b1ac8367); font-size:16px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-1__sd-5:hover .symbol-1__sd-6 { color:#029fc8; }
[data-current] .symbol-1__sd-6 { color:#029fc8; opacity:1; }
.symbol-1__sd-7 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-1__sd-5:hover .symbol-1__sd-7 { flex:none; width:100%; max-width:100%; }
.symbol-1__sd-8 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 0px 0px 30px; mix-blend-mode:normal; padding:0px; max-width:calc(100% - 30px); }
.symbol-1__sd-8[data-current] { opacity:1; }
.symbol-1__sd-8:hover { opacity:1; }
.symbol-1__sd-9 { color:#EEEEEE; font-family:var(--s-font-b1ac8367); font-size:16px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-1__sd-8:hover .symbol-1__sd-9 { color:#029fc8; }
[data-current] .symbol-1__sd-9 { color:#029fc8; opacity:1; }
.symbol-1__sd-10 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-1__sd-8:hover .symbol-1__sd-10 { flex:none; width:100%; max-width:100%; }
.symbol-1__sd-11 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 0px 0px 30px; mix-blend-mode:normal; padding:0px; max-width:calc(100% - 30px); }
.symbol-1__sd-11[data-current] { opacity:1; }
.symbol-1__sd-11:hover { opacity:1; }
.symbol-1__sd-12 { color:#EEEEEE; font-family:var(--s-font-b1ac8367); font-size:16px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-1__sd-11:hover .symbol-1__sd-12 { color:#029fc8; }
[data-current] .symbol-1__sd-12 { color:#029fc8; opacity:1; }
.symbol-1__sd-13 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-1__sd-11:hover .symbol-1__sd-13 { flex:none; width:100%; max-width:100%; }
.symbol-2 { align-content:center; align-items:center; background:#EEEEEE; flex:none; flex-direction:column; flex-wrap:nowrap; height:auto; justify-content:center; width:100%; max-width:100%; }
.symbol-2__sd-1 { align-content:flex-start; align-items:flex-start; background:#eeeeee; flex:none; flex-direction:column; flex-wrap:nowrap; height:auto; justify-content:flex-start; margin:0px; padding:40px; width:100%; max-width:100%; }
.symbol-2__sd-2 { align-content:flex-end; align-items:flex-end; flex-direction:row; flex-wrap:nowrap; justify-content:flex-start; margin:0px 0px 30px; padding:0px; max-width:100%; }
.symbol-2__sd-3 { flex:none; height:auto; margin:0px 15px 0px 0px; width:100px; max-width:calc(100% - 15px); }
.symbol-2__sd-3:before { background-repeat:no-repeat; background-size:contain; }
.symbol-2__sd-4 { color:#090f0f; font-family:var(--s-font-53bd3d95); font-size:16px; font-weight:700; height:auto; line-height:1; padding:0px; text-align:center; width:auto; justify-content:center; max-width:100%; }
.symbol-2__sd-5 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 40px 30px 0px; padding:0px; max-width:calc(100% - 40px); }
.symbol-2__sd-6 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px; mix-blend-mode:normal; padding:0px; max-width:100%; }
.symbol-2__sd-6[data-current] { opacity:1; }
.symbol-2__sd-6:hover { opacity:1; }
.symbol-2__sd-7 { color:#333333; font-family:var(--s-font-b1ac8367); font-size:14px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-2__sd-6:hover .symbol-2__sd-7 { color:#029fc8; }
[data-current] .symbol-2__sd-7 { color:#029fc8; opacity:1; }
.symbol-2__sd-8 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-2__sd-6:hover .symbol-2__sd-8 { flex:none; width:100%; max-width:100%; }
.symbol-2__sd-9 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 0px 0px 25px; mix-blend-mode:normal; padding:0px; max-width:calc(100% - 25px); }
.symbol-2__sd-9[data-current] { opacity:1; }
.symbol-2__sd-9:hover { opacity:1; }
.symbol-2__sd-10 { color:#333333; font-family:var(--s-font-b1ac8367); font-size:14px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-2__sd-9:hover .symbol-2__sd-10 { color:#029fc8; }
[data-current] .symbol-2__sd-10 { color:#029fc8; opacity:1; }
.symbol-2__sd-11 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-2__sd-9:hover .symbol-2__sd-11 { flex:none; width:100%; max-width:100%; }
.symbol-2__sd-12 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; margin:0px 0px 0px 25px; mix-blend-mode:normal; padding:0px; max-width:calc(100% - 25px); }
.symbol-2__sd-12[data-current] { opacity:1; }
.symbol-2__sd-12:hover { opacity:1; }
.symbol-2__sd-13 { color:#333333; font-family:var(--s-font-b1ac8367); font-size:14px; font-weight:500; height:auto; letter-spacing:0.05em; line-height:1.2; margin:0px; padding:0px; text-align:center; width:auto; z-index:1; justify-content:center; max-width:100%; }
.symbol-2__sd-12:hover .symbol-2__sd-13 { color:#029fc8; }
[data-current] .symbol-2__sd-13 { color:#029fc8; opacity:1; }
.symbol-2__sd-14 { background:#029fc8; bottom:-5px; flex:none; height:2px; left:0px; margin:0; overflow-x:visible; overflow-y:visible; position:absolute; right:0px; top:auto; width:0%; z-index:0; max-width:0%; }
.symbol-2__sd-12:hover .symbol-2__sd-14 { flex:none; width:100%; max-width:100%; }
.symbol-2__sd-15 { align-content:center; align-items:center; flex-direction:row; flex-wrap:nowrap; justify-content:center; padding:0px; }
.symbol-2__sd-16 { color:#666666; font-size:28px; margin:0px; padding:0px 10px 0px 0px; max-width:100%; }
.symbol-2__sd-16:hover { color:#029fc8; opacity:0.8; }
.symbol-2__sd-17 { color:#666666; font-size:28px; margin:0px; padding:0px 10px; max-width:100%; }
.symbol-2__sd-17:hover { color:#029fc8; opacity:0.8; }
.symbol-2__sd-18 { align-content:center; align-items:center; background:#080404; flex-direction:column; flex-wrap:nowrap; height:50px; justify-content:center; width:100%; max-width:100%; }
.symbol-2__sd-19 { color:#FFFFFF; font-family:var(--s-font-bb8e9a58); font-size:13px; font-weight:700; height:auto; letter-spacing:0.07em; line-height:1; text-align:center; width:auto; justify-content:center; max-width:100%; }
.symbol-1__sd-2 { --img-origin:url(../img/s-272x69_webp_1edd9625-756c-41fe-83c1-1bc858f20c71.webp); --img-small:url(../img/s-272x69_webp_1edd9625-756c-41fe-83c1-1bc858f20c71.webp); --img-middle:url(../img/s-272x69_webp_1edd9625-756c-41fe-83c1-1bc858f20c71.webp); --img-regular:url(../img/s-272x69_webp_1edd9625-756c-41fe-83c1-1bc858f20c71.webp); }