@charset "UTF-8";

@font-face { font-family: "Open Sans"; font-weight: 700; src: url("/assets-common/font/OpenSans-Bold.ttf") format("ttf"), url("/assets-common/font/OpenSans-Bold.ttf") format("truetype"); font-display: swap; }

@font-face { font-family: "Meiryo Neue"; font-weight: 400; src: local("Meiryo"); descent-override: 32%; }
@font-face { font-family: "Meiryo Neue"; font-weight: 700; src: local("Meiryo Bold"); descent-override: 32%; }

[lang="en"] {
  .corporateCommonParts {
    font-family: 'Open Sans','Arial', sans-serif;

    & .languageSwitch {
      .languageSwitch-knob {
        left: 49px;
      }
    }
  }
}
[lang="zh-cn"] {
  .corporateCommonParts {
    & .languageSwitch {
      .languageSwitch-knob {
        left: 95px;
      }
    }
  }
}

a.cct-blockSkip:focus + .corporateCommonParts:has(.corporateHeader),
a[href="#main_Content"]:focus + .corporateCommonParts:has(.corporateHeader) {
  margin-top: 52px;
}

.corporateCommonParts {
  /* Common variables */
  --pageWidth-desktop: 1220px;
  --pageSidePadding-desktop: 20px;

  --animatedUnderlineOffset: -2px;

  --gradatedPatternForNavigationForDesktop: linear-gradient(90deg, rgba(1, 86, 161, 0.97) 0%, rgba(0, 98, 194, 0.97) 8%, rgba(0, 112, 224, 0.97) 24%, rgba(0, 112, 224, 0.97) 76%, rgba(0, 98, 194, 0.97) 92%, rgba(1, 86, 161, 0.97) 100%);
  --gradatedPatternForNavigationForMobile:  linear-gradient(90deg, rgba(1, 86, 161, 0.97) 0%, rgba(0, 98, 194, 0.97) 15%, rgba(0, 112, 224, 0.97) 35%, rgba(0, 112, 224, 0.97) 65%, rgba(0, 98, 194, 0.97) 85%, rgba(1, 86, 161, 0.97) 100%);

  /* Additional reset for Corporate Common Parts */
  position: relative;
  box-sizing: border-box;
  * { box-sizing: border-box; }

  :is(ul, ol) {
    list-style: none;
  }

  a[href], button, input, select, textarea {
    cursor: pointer;

    &:focus-visible {
      outline: 2px solid #8c8c8c;
    }
  }

  img[data-src-hover] {
    background-size: contain;
  }

  /* Text settings */
  --Name-Sans: "Meiryo Neue";
  font-family: 'Open Sans', 'Arial', var(--Name-Sans), 'メイリオ', Meiryo, sans-serif;

  text-underline-offset: 2px;

  header a:link,
  footer a:link,
  header a:hover,
  footer a:hover,
  header a:visited,
  footer a:visited {
    color: unset;
  }

  & {
    color: #333;
  }
  :where(a),
  :where(a:link),
  :where(a:hover),
  :where(a:visited) {
    color: #333;
  }

  /* Utility classes */
  &.desktopOnly,
  .desktopOnly {
    @media screen and (max-width: 1200px) {
      display: none !important;
    }
  }
  &.mobileOnly,
  .mobileOnly {
    @media screen and (min-width: 1201px) {
      display: none !important;
    }
  }
  &.overSmallPhone,
  .overSmallPhone {
    @media screen and (max-width: 719px) {
      display: none !important;
    }
  }

  &.corporateHeaderBracket {
    position: relative;
    z-index: 65539; /* .l-header を上回る必要がある / コンテンツ側コンポーネントを上回る・ローカルナビを上回る必要がある */
  }

  /* ---------------------------------------------------- 企業サイトヘッダー */
  .corporateHeader {
    position: relative;
    container-type: inline-size;

    margin: 0 auto;
    padding: 0;
    background: #FFF;

    color: #333;
    font-weight: 400;

    .corporateHeader-content {
      margin: 0 auto;
      max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
      padding: 0 var(--pageSidePadding-desktop);

      display: flex;
      align-items: center;
      justify-content: space-between;

      @media screen and (max-width: 1200px) {
        flex-direction: column;
        align-items: flex-start;
        padding: 0;
      }
    }

    /* ---------------------------------------------------- 企業ロゴ */
    .corporateHeader-corporateLogo {
      width: 238px;
      margin-left: -13px; /* ロゴ画像自体の余白吸収・ロゴイメージの円形の左端視覚差異吸収 */

      @media screen and (max-width: 1200px) {
        width: 200px;
        margin: 2px 0 2px 5px;
      }

      @media screen and (max-width: 750px) {
        width: 177px;
        margin: 5px 0 4px 5px;
      }

      .corporateHeader-corporateLogo-content {
        display: block;
        width: 100%;
      }

      .corporateHeader-corporateLogo-img {
        display: block;
        width: 100%;
      }
    }

    /* ---------------------------------------------------- サイト内検索トリガー */
    .corporateHeader-searchContainer {
      position: absolute;
      left: calc(50% + var(--pageWidth-desktop) / 2 - 20px);
      bottom: 16px;

      @media screen and (max-width: 1260px) {
      left: calc(100% - 40px);
      }

      @media screen and (max-width: 1200px) {
        top: 0;
        bottom: auto;
        left: auto;
        right: 48px;
        width: 48px;
        aspect-ratio: 1;
        display: flex;
        justify-content: center;
        align-items: center;

        &:hover {
          background: #F3F8FD;
        }

        &:has(.currentActive) {
          border-bottom: 1px solid #348FDC;
          background: #0062C2;

          &:hover {
            background: #0062C2;
          }
        }
      }

      .corporateHeader-dropdown {
        width: 100cqw;
        right: auto;
        left: calc(-50cqw - var(--pageWidth-desktop) / 2 + var(--pageSidePadding-desktop));
        top: 36px;

        @media screen and (max-width: 1200px) {
          top: 48px;
          left: calc(-100cqw + 48px * 2);
          background: #0062C2
        }
      }
    }

    .corporateHeader-searchTrigger {
      position: relative;
      display: block;
      width: 20px;
      align-self: center;
      aspect-ratio: 1;
      cursor: pointer;
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;

      .corporateHeader-searchTrigger-icon {
        display: block;
        width: 100%;
        aspect-ratio: 1;
      }
      &.currentActive,
      &:hover {
        .corporateHeader-searchTrigger-icon {
          opacity: 0;
        }
      }

      &::after {
        opacity: 0;
        content: '';
        display: block;
        width: 8px;
        aspect-ratio:1;
        background-image: url(/assets/img/chevron-downward-blue.svg);
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        left: 50%;
        bottom: -10px;
        transform: translateX(-50%);
      }

      &.currentActive {
        @media screen and (max-width: 1200px) {
          background-image: none;
        }

        &::after {
          opacity: 1;
        }

        @media screen and (max-width: 1200px) {
          &::after {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 50%;
            top: 50%;
            bottom: auto;
            transform: translate(-50%, -50%);
            background-image: url(/assets/img/icon-cancel-white.svg);
          }
        }
      }
    }

    /* ---------------------------------------------------- モバイルビュー メニュー展開（ハンバーガーメニュー） */
    .corporateHeader-hambergerMenuTrigger {
      display: none;

      position: absolute;
      right: 0;
      top: 0;
      width: 48px;
      aspect-ratio: 1;
      padding: 14px;
      background: none;
      border: none;
      cursor: pointer;
      overflow: hidden;
      backface-visibility: hidden;

      @media screen and (max-width: 1200px) {
        display: flex;

        &:before {
          content: '';
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          left: 0;
          width: 1px;
          height: 66.7%;
          background: #CCC;
        }
      }

      &:hover {
        background: #F3F8FD;
      }

      &.currentActive {
        border-bottom: 1px solid #348FDC;
        background: #0062C2;

        &::before {
          content: none;
        }

        &:hover {
          background: #0062C2;
        }

        .corporateHeader-hambergerMenuTrigger-bar {
          background: #fff;
          height: 1.8px;
          width: calc(18px * sqrt(2));

          &:nth-of-type(1) {
            top: 22px;
            transform: translateX(-50%) rotate(calc(45deg + 180deg));
          }
          &:nth-of-type(2) {
            opacity: 0;
          }
          &:nth-of-type(3) {
            top: 22px;
            transform: translateX(-50%) rotate(calc(-45deg - 180deg));
          }
        }

      }

      .corporateHeader-hambergerMenuTrigger-label {
        position: absolute;
        left: -200vw;
      }

      .corporateHeader-hambergerMenuTrigger-bar {
        display: block;
        position: absolute;
        left: 50%;
        transform: translateX(-50%) rotate(.3deg) translateZ(0);
        width: 18px;
        height: 2px;
        border-radius: 100px;
        background: #333;
        transition: transform .2s ease-out, top .2s ease-out, opacity .2s ease-out, background .2s ease-out;
        backface-visibility: hidden;

        &:nth-of-type(1) {
          top: 16px;
        }
        &:nth-of-type(2) {
          top: 22px;
        }
        &:nth-of-type(3) {
          top: 28.4px; /* Windows 描画もやけ対策 */
        }
      }
    }

    .corporateHeader-nav {
      display: flex;
      flex-direction: column-reverse;

      @media screen and (max-width: 1200px) {
        --topSpace: calc(30px + 16px * 2);
        flex-direction: column;
        padding-top: var(--topSpace);
        width: 100%;
        height: calc(100dvh - 48px);

        background: #0062C2;
        backdrop-filter: blur(6px);
        transition: height .4s cubic-bezier(.76,0,.24,1),min-height .4s cubic-bezier(.76,0,.24,1),padding .4s cubic-bezier(.76,0,.24,1),opacity .2s cubic-bezier(.76,0,.24,1);

        overflow: auto;
      }

      .corporateHeader-nav-row {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding: 0;
  
        @media screen and (max-width: 1200px) {
          justify-content: unset;
        }

        &:has(.corporateHeader-nav-main) {
          gap: 28px;
        }
        &:has(.corporateHeader-nav-sub) {
          padding-top: 11px;
          gap: 20px;
          min-height: calc(30px + 11px);

          @media screen and (max-width: 1200px) {
            min-height: fit-content;
          }
        }
      }

      &.inactive {
        @media screen and (max-width: 1200px) {
          height: 0;
          min-height: 0;
          padding: 0;
          opacity: 0;
          transition: height .4s cubic-bezier(.76,0,.24,1),padding .4s cubic-bezier(.76,0,.24,1),opacity .4s cubic-bezier(.76,0,.24,1);
        }
      }

      /* ---------------------------------------------------- 主要コンテンツカテゴリナビゲーション */
      .corporateHeader-nav-main {
        margin-right: 53px;

        @media screen and (max-width: 1200px) {
          width: 100%;
          margin-right: unset;
        }

        .corporateHeader-nav-main-series {
          display: flex;
          gap: 28px;

          @media screen and (max-width: 1200px) {
            flex-direction: column;
            gap: 0;
            border-top: 1px solid #9BC4F0;
          }
        }
        .corporateHeader-nav-main-item {
          .corporateHeader-nav-main-item-content {
            display: block;
            padding: 14px 0;
            font-size: 16px;
            line-height: 1.4;

            @media screen and (max-width: 1200px) {
              padding: 16px 10px 16px 16px;
              color: #FFF;
              border-bottom: 1px solid #9BC4F0;
              font-size: 20px;
            }
          }

          a.corporateHeader-nav-main-item-content,
          button.corporateHeader-nav-main-item-content {
            position: relative;
            &::before {
              content: '';
              position: absolute;
              left: 0;
              bottom: calc(14px + 0.2em + var(--animatedUnderlineOffset));
              width: 0;
              height: 1px;
              background-color: #0062C2;
              transition: width 0.12s ease-out;

              @media screen and (max-width: 1200px) {
                content: none;
              }
            }

            &:hover {
              color: #0062C2;
              &::before {
                width: 100%;
              }

              @media screen and (max-width: 1200px) {
                color: #FFF;
              }
            }

            &::after {
              opacity: 0;
              content: '';
              display: block;
              width: 8px;
              aspect-ratio:1;
              background-image: url(/assets/img/chevron-downward-blue.svg);
              background-size: contain;
              background-repeat: no-repeat;
              position: absolute;
              left: 50%;
              bottom: 4px;
              transform: translateX(-50%);

              @media screen and (max-width: 1200px) {
                width: 14px;
                background-image: url(/assets/img/icon-bullet-link-w.svg);
                left: auto;
                right: 16px;
                bottom: 50%;
                transform: translateY(50%);
                opacity: 1;
              }
            }

            &[target="_blank"] {
              display: flex;
              column-gap: 4px;
              align-items: center;

              @media screen and (max-width: 1200px) {
                display: block;
              }

              &:hover::before {
                width: calc(100% - 14px - 4px); /* アイコン分の余白を引く */
              }

              &:after {
                opacity: 1;
                content: '別ウィンドウが開きます';
                text-indent: -200vw;
                overflow: hidden;
                background-image: url(/assets/img/new_window_icon2024.svg);
                width: 14px;
                left: auto;
                bottom: auto;
                position: relative;
                transform: none;

                @media screen and (max-width: 1200px) {
                  position: absolute;
                  width: 14px;
                  background-image: url(/assets/img/new_window_icon2024-w.svg);
                  left: auto;
                  right: calc(16px + 4px);
                  bottom: 50%;
                  transform: translateY(50%);
                  opacity: 1;
                }
              }
              &:hover::after {
                background-image: url(/assets/img/new_window_icon2024-hover.svg);

                @media screen and (max-width: 1200px) {
                  background-image: url(/assets/img/new_window_icon2024-w.svg);
                }
              }
            }

            &.currentActive {
              color: #0062C2;

              &::after {
                opacity: 1;
              }

              @media screen and (max-width: 1200px) {
                color: #FFF;
              }
            }
          }
        }
      }

       /* ---------------------------------------------------- ユーティリティナビゲーション */
      .corporateHeader-nav-sub {
        display: flex;

        .corporateHeader-nav-sub-series {
          display: flex;
          gap: 20px;

          @media screen and (max-width: 1200px) {
            flex-direction: column;

            padding: 24px 20px 48px;
          }
        }
        .corporateHeader-nav-sub-item {
          .corporateHeader-nav-sub-item-content {
            display: flex;
            column-gap: 4px;
            align-items: center;
            font-size: 14px;
            line-height: 1.0;
            padding: 4px 0; /* クリックエリア確保 */

            @media screen and (max-width: 1200px) {
              padding: 0;
              color: #FFF;
              font-size: 14px;
              line-height: 1.4;
            }

            &::after,
            .corporateHeader-nav-sub-item-content-icon {
              position: relative;
              display: block;
              width: 16px;
              aspect-ratio: 1;
              background-size: contain;

              img {
                position: absolute;
                display: block;
                width: 100%;
                height: 100%;
              }
            }
            &[target="_blank"]::after {
              content: '別ウィンドウが開きます';
              text-indent: -200vw;
              overflow: hidden;
              background-image: url(/assets/img/new_window_icon2024.svg), url(/assets/img/new_window_icon2024-hover.svg);

              @media screen and (max-width: 1200px) {
                background-image: url(/assets/img/new_window_icon2024-w.svg);
              }
            }
            &:hover {
              color: #0062C2;

              @media screen and (max-width: 1200px) {
                color: #FFF;
              }

              .corporateHeader-nav-sub-item-content-icon img {
                opacity: 0;

                @media screen and (max-width: 1200px) {
                  opacity: 1;
                }
              }

              &[target="_blank"]::after {
                background-image: url(/assets/img/new_window_icon2024-hover.svg);

                @media screen and (max-width: 1200px) {
                  background-image: url(/assets/img/new_window_icon2024-w.svg);
                }
              }
            }
          }

          a.corporateHeader-nav-sub-item-content {
            &:hover {
              color: #0062C2;

              @media screen and (max-width: 1200px) {
                color: #FFF;
              }
            }
            &:hover .corporateHeader-nav-sub-item-content-label::before {
              width: 100%;
            }

            .corporateHeader-nav-sub-item-content-label {
              position: relative;

              &::before {
                content: '';
                position: absolute;
                left: 0;
                bottom: var(--animatedUnderlineOffset);
                width: 0;
                height: 1px;
                background-color: #0062C2;
                transition: width 0.12s ease-out;

                @media screen and (max-width: 1200px) {
                  content: none;
                }
              }
            }
          }
        }
      }
    }
  }

  /* ---------------------------------------------------- メガドロップダウン */
  /* transition分岐 - ドロップダウンが1枚以上展開している場合は「垂直スライドフェード」無し */
  .corporateHeader.dropdown-opened {
    .corporateHeader-dropdown {
      @starting-style {
        transform: translateY(0px);
        opacity: 1;
      }

      &.inactive {
        transform: translateY(0px);
        opacity: 0;

        .corporateHeader-dropdown-sectionContainer {
          opacity: 0;
        }
      }

      .corporateHeader-dropdown-sectionContainer {
        transition: opacity .2s ease-in-out;
        opacity: 1;

        @starting-style {
          opacity: 0;
        }
      }
    }
  }

  /* ドロップダウン本体 */
  .corporateHeader-dropdown {
    display: block;
    position: absolute;
    z-index: 4;
    top: 100%;
    left: 0;
    width: 100%;
    overflow-y: auto;
    max-height: calc(100dvh - 48px - 36px); /* ビューポート高さ - ヘッダー高さ - ドロップダウン上部余白 */

    &::-webkit-scrollbar {
      width: 8px;
    }
    &::-webkit-scrollbar-thumb {
      background: #4E9DE1;
      border-radius: 100px;
    }
    &::-webkit-scrollbar-track {
      background: transparent;
    }
    @-moz-document url-prefix() {
      scrollbar-color: #4E9DE1 transparent;
      scrollbar-width: thin;
    }

    background: var(--gradatedPatternForNavigationForDesktop);
    @media screen and (max-width: 1200px) {
      background: var(--gradatedPatternForNavigationForMobile);
    }

    backdrop-filter: blur(6px);

    color: #fff;

    transform: translateY(0px);

    opacity: 1;

    transition: opacity .1s ease-out, transform .2s ease-out, display .2s ease-out;
    transition-behavior: allow-discrete;

    @starting-style {
      display: block;
      transform: translateY(-5px);
      opacity: 0;
    }

    &.inactive {
      display: none;
      transform: translateY(-5px);
      opacity: 0;
    }

    &#corporateHeader-searchDropdown {
      overflow: visible;

      @media screen and (max-width: 1200px) {
        .corporateHeader-dropdown-content {
          min-height: unset;
          padding: 16px 16px 20px;
        }
      }
    }

    .corporateHeader-dropdown-content {
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      margin: 0 auto;
      max-width: 976px;
      min-height: 285px;
      padding: 31px 20px 20px;
      &:has(.corporateHeader-dropdown-lead) {
        padding-top: 46px;
      }

      .corporateHeader-dropdown-lead {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #fff;
        font-size: 14px;
        line-height: 1.4;

        .corporateHeader-dropdown-lead-icon {
          display: block;
          width: 18px;
          aspect-ratio: 1;
        }
      }

      .corporateHeader-dropdown-sectionContainer {
        .corporateHeader-dropdown-categoryTitle {
          padding-bottom:9px;
          border-bottom: 1px solid #9BC4F0;

          .corporateHeader-dropdown-categoryTitle-content {
            position: relative;
            display: inline-flex;
            align-items: center;
            column-gap: 8px;
            font-size: 20px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.4;
            text-decoration: none;
            color: #fff;
          }
          a.corporateHeader-dropdown-categoryTitle-content {
            &:hover {
              text-decoration: underline;
            }

            &::after {
              content: '';
              width: 14px;
              aspect-ratio: 1;
              display: block;
              text-indent: -200vw;
              overflow: hidden;
              background-image: url(/assets/img/icon-bullet-link-w.svg);
              background-size: contain;
              background-repeat: no-repeat;
              background-position: center;
            }
            &[target="_blank"]::after {
              content: '別ウィンドウが開きます';
              background-image: url(/assets/img/new_window_icon2024-w.svg);
            }
          }
        }

        .corporateHeader-dropdown-paragraphTitle {
          .corporateHeader-dropdown-paragraphTitle-content {
            display: inline-flex;
            align-items: center;
            column-gap: 6px;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.4;
            text-decoration: none;
            color: #fff;

            &::before {
              content: '';
              width: 2px;
              height: 14px;
              background: #9BC4F0;
            }
          }
        }
        * + .corporateHeader-dropdown-paragraphTitle {
          margin-top: 22px;
        }

        .corporateHeader-dropdown-linksBundler-main {
          display: flex;
          flex-wrap: wrap;
          --horizontalGap: 32px;
          gap: 0 var(--horizontalGap);

          .corporateHeader-dropdown-linksBundler-item {
            width: calc(100% / 3 - var(--horizontalGap) * 2 / 3);
          }

          .corporateHeader-dropdown-linksBundler-item-content {
            display: flex;
            align-items: center;
            column-gap: 8px;
            justify-content: space-between;

            padding: 8px 13px 8px 0;
            height: 100%;
            min-height: calc(48px + 16px);
            border-bottom: 1px solid #348FDC;

            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.4;
            text-decoration: none;
            color: #fff;

            &:hover {
              text-decoration: underline;
            }
          }
          a.corporateHeader-dropdown-linksBundler-item-content {
            &::after {
              content: '';
              width: 14px;
              aspect-ratio: 1;
              display: block;
              text-indent: -200vw;
              overflow: hidden;
              flex-shrink: 0;
              background-image: url(/assets/img/icon-bullet-link-w.svg);
              background-size: contain;
              background-repeat: no-repeat;
              background-position: center;
            }
            &[target="_blank"]::after {
              content: '別ウィンドウが開きます';
              background-image: url(/assets/img/new_window_icon2024-w.svg);
            }

            &:hover {
              text-decoration: underline;
            }
          }
        }
      }

      .corporateHeader-dropdown-linksBundler-trailer {
        display: flex;
        flex-wrap: wrap;
        --horizontalGap: 24px;
        gap: 0 var(--horizontalGap);

        .corporateHeader-dropdown-linksBundler-item-content {
          display: flex;
          align-items: center;
          column-gap: 4px;
          justify-content: flex-start;
          padding: 6px 0 4px;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.4;
          text-decoration: none;
          color: #fff;

          .corporateHeader-dropdown-linksBundler-item-content-icon {
            content: '';
            width: 14px;
            aspect-ratio: 1;
            object-fit: contain;
            display: inline-block;
            transform: translateY(1px);
          }
        }
        a.corporateHeader-dropdown-linksBundler-item-content {
            &::after {
              content: '';
              width: 14px;
              aspect-ratio: 1;
              display: block;
              text-indent: -200vw;
              overflow: hidden;
              flex-shrink: 0;
              background-image: url(/assets/img/chevron-rightward-narrow-white.svg);
              background-size: contain;
              background-repeat: no-repeat;
              background-position: center;
              transform: translateY(1px);
            }
            &[target="_blank"]::after {
              content: '別ウィンドウが開きます';
              background-image: url(/assets/img/new_window_icon2024-w.svg);
            }

          &:hover {
            text-decoration: underline;
          }
        }
      }
    }

    .corporateHeader-dropdown-closeBtn {
      display: flex;
      flex-direction: row-reverse;
      margin: 24px auto 0;
      width: 280px;
      height: 40px;
      padding: 0 86px;
      justify-content: center;
      align-items: center;
      gap: 4px;

      font-size: 14px;
      line-height: 1.4;
      border-radius: 4px;
      border: 1px solid #9BC4F0;

      cursor: pointer;
      transition: background .1s ease-out, border .1s ease-out;

      @media screen and (max-width: 1200px) {
        display: none;
      }

      &:hover {
        border-radius: 4px;
        border: 1px solid #9BC4F0;
        background: #0062C2;
      }

      .corporateHeader-dropdown-closeBtn-icon {
        width: 16px;
        aspect-ratio: 1;
        object-fit: contain;
      }
    }

    /* サイト内検索 */
    .mf_finder_searchBox {
      margin: 0;
    }
    .mf_finder_searchBox_query_input {
      cursor: text;

      border-radius: 4px 0 0 4px;
      background: #FFF;
      padding: 13px 10px;

      color: #4D4D4D;
      height: 56px;
      font-size: 16px;
      line-height: 1.4;
      border: 1px solid #9BC4F0;
      border-width: 1px 0 1px 1px;

      &::placeholder {
        color: #747474;
      }
      &:focus::placeholder {
        color: transparent;
      }
    }
    .mf_finder_searchBox_submit {
      width: 120px;
      border-radius: 0 4px 4px 0;
      border: 1px solid #9BC4F0;
      background: #014880;

      text-align: center;
      color: #fff;
      font-weight: 700;

      &:hover {
        background: #013A67;
      }

      @media screen and (max-width: 1200px) {
        width: 80px;
      }
    }

    .mf_finder_searchBox_items {
      padding: 0;
    }

    .corporateHeader-dropdown-lead + .mf_finder_searchBox {
      margin-top: 8px;
    }

    .mf_finder_searchBox_suggest_items {
      border: none;
      border-radius: 4px;
      background: var(--Tertiary-ContainerAlpha, rgba(1, 72, 128, 0.95));
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
      backdrop-filter: blur(3px);

      max-height: 400px;
      overflow-y: auto;

      &::-webkit-scrollbar {
        width: 8px;
      }
      &::-webkit-scrollbar-thumb {
        background: #4E9DE1;
        border-radius: 100px;
      }
      &::-webkit-scrollbar-track {
        background: transparent;
      }
      @-moz-document url-prefix() {
        scrollbar-color: #4E9DE1 transparent;
        scrollbar-width: thin;
      }
    }

    .mf_finder_searchBox_suggest_item {
      border-top: 1px solid #0075D2;
    }
    .mf_finder_searchBox_suggest_item:first-child {
      border-top: none
    }

    .mf_finder_searchBox_suggest_item a {
      display: inline-block;
      width: 100%;
      padding: 16px 10px;

      text-decoration: none;
      color: #fff;

      font-size: 16px;
      font-style: normal;
      font-weight: 400;
      line-height: 1.4;
    }

    .mf_finder_searchBox_suggest_item_cur,
    .mf_finder_searchBox_suggest_item_hover {
      background: #015FA9;
    }

    .mf_finder_searchBox_links .mf_finder_searchBox_category,
    .mf_finder_searchBox_links .mf_finder_searchBox_imgsize,
    .mf_finder_searchBox_links .mf_finder_searchBox_pagemax,
    .mf_finder_searchBox_links .mf_finder_searchBox_sort {
      padding: .5rem 0;
      border-bottom: 1px solid #015FA9;
    }
  }


  /* ---------------------------------------------------- 言語切替 */
  .corporateHeader .languageSwitch {
    @media screen and (max-width: 1200px) {
      position: absolute;
      top: calc((30px + 16px * 2) / 2);
      transform: translateY(-50%);
      right: 10px;

      background: #014880;
    }
  }

  .localNav .languageSwitch {
    display: none;

    @media screen and (max-width: 1200px) {
      display: flex;
      position: absolute;
      bottom: 11px;
      right: 10px;

      background: #014880;
    }
  }

  .languageSwitch {
    --transitionDuration: .2s;
    --insetPadding: 3px;

    display: flex;
    justify-content: flex-end;
    position: relative;
    font-size: 12px;
    padding: 3px;
    border-radius: 100px;
    background: #eee;

    &:has(:focus-visible) {
      outline: 2px solid #8c8c8c;
    }

    .languageSwitch-knob {
      position: absolute;
      z-index: 0;
      left: var(--insetPadding);
      top: var(--insetPadding);
      background: #fff;
      transition: left var(--transitionDuration);
      pointer-events: none;

      @media screen and (max-width: 1200px) {
        background: #0062C2;
      }
    }
    .languageSwitch-bundler {
      display: flex;
      position: relative;
      z-index: 1;
      gap: 2px;
    }
    .languageSwitch-knob,
    .languageSwitch-selection-touchpoint {
      border-radius: 100px;
      display: flex;
      width: 44px;

      --padding-top-bottom: 6px;
      height: calc(1em + var(--padding-top-bottom) * 2);
      padding: var(--padding-top-bottom) 0;

      align-items: center;
      justify-content: center;
    }
    .languageSwitch-selection-text {
      line-height: 1.0;
    }
    .languageSwitch-selection {
      flex-grow: 0;
    }
    .languageSwitch-selection-touchpoint {
      position: relative;
      z-index: 1;
      cursor: pointer;
      flex-grow: 0;
      -webkit-tap-highlight-color: transparent;
      transition: color var(--transitionDuration);
      color: #4D4D4D;

      .languageSwitch-selection-text {
        position: relative;
        &::before {
          content: '';
          position: absolute;
          left: -3px;
          bottom: var(--animatedUnderlineOffset);
          width: 0;
          height: 1px;
          background-color: #0062C2;
          transition: width 0.12s ease-out;

          @media screen and (max-width: 1200px) {
            content: none;
          }
        }
      }

      &:hover {
        color: #0062C2;

        .languageSwitch-selection-text {
          &::before {
            width: calc(100% + 6px); /* 左右の余白分を足す */
          }
        }
      }
      &:has(:checked) {
        font-weight: 700;
        cursor: unset;

        &:hover {
          color: #4D4D4D;

          .languageSwitch-selection-text {
            &::before {
              content: none;
              background-color: #4D4D4D;
            }
          }
        }
      }

      @media screen and (max-width: 1200px) {
        color: #FFF;

        &:is(&:hover) {
          color: #FFF;
        }
      }
    }

    .languageSwitch-selection-input {
      display: block;
      appearance: none;
      width: 0;
      height: 0;
    }
    .languageSwitch-selection:has(.languageSwitch-selection-input[disabled]) {
      .languageSwitch-selection-touchpoint {
        cursor: default;
      }
      .languageSwitch-selection-text {
        opacity: .5;
      }
    }
  }

  /* ---------------------------------------------------- カテゴリローカルナビ */
  &.localNavBracket {
    position: sticky;
    top: 0;
    left: 0;

    z-index: 65538; /* .l-header を上回る必要がある */
    /* z-index: 3; */ /* コンテンツ側コンポーネントを上回る・ローカルナビを上回る必要がある */

    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.03), 0 0 8px 0 rgba(0, 0, 0, 0.06);
  }

  &.localNavBracket.staticPosition {
      position: relative;
      &:has(.localNav-toggle.currentActive) {
        position: sticky;
    }
  }
      
  .localNav {
    box-sizing: border-box;
    * {
      box-sizing: border-box;
    }

    :is(ul, ol) {
      list-style: none;
    }

    container-type: inline-size;
    background: var(--gradatedPatternForNavigationForDesktop);
    backdrop-filter: blur(20px);

    .localNav-content {
      display: flex;
      align-items: center;
      column-gap: 12px;
      padding: 9px var(--pageSidePadding-desktop);
      max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
      margin: 0 auto;
    }

    .localNav-title {
      position: relative;
      font-size: 20px;
      font-style: normal;
      font-weight: 700;
      line-height: 1.4;
      color: #fff;

      @media screen and (max-width: 1200px) {
        padding: 8px 0;
      }

      &:focus-visible {
        outline: 2px solid #A6A6A6;
      }
    }
    a.localNav-title {
      &:hover {
        text-decoration: underline;
      }
    }

    @media screen and (max-width: 1200px) {
      background: var(--gradatedPatternForNavigationForMobile);

      .localNav-content {
        width: 100%;
        padding: 0 0 0 16px;
        column-gap: 16px;
      }
    }

    .localnav-detail {
      flex: 1;

      @media screen and (max-width: 1200px) {
        display: flex;
        flex-direction: column;
        background: var(--gradatedPatternForNavigationForMobile);
        position: absolute;
        left: 0;
        top: 100%;
        width: 100%;

        height: calc(100dvh - 48px - 56px); /* ヘッダー、ローカルナビ高さ分を引く */
        &[data-header-stored] {
          height: calc(100dvh - 56px); /* ローカルナビ高さ分を引く */
        }

        padding: 0 0 50px 10px;

        transition: height .4s cubic-bezier(.76,0,.24,1), min-height .4s cubic-bezier(.76,0,.24,1), padding .4s cubic-bezier(.76,0,.24,1), opacity .3s cubic-bezier(.76,0,.24,1);
        transition-behavior: allow-discrete;
        flex: revert;

        @starting-style {
          padding: 0;
          height: 0;
          opacity: 0;
        }

        &.inactive {
          height: 0;
          opacity: 0;
          padding-top: 0;
          padding-bottom: 0;
          transition: height .4s cubic-bezier(.76,0,.24,1), min-height .4s cubic-bezier(.76,0,.24,1), padding .4s cubic-bezier(.76,0,.24,1), opacity .2s .2s cubic-bezier(.76,0,.24,1);

          &.initialRender {
            transition: none;
          }
        }
      }
    }

    .localNav-detail-series {
      list-style: none;
      display: flex;
      flex-wrap: wrap;

      @media screen and (max-width: 1200px) {
        flex-direction: column;
        flex-wrap: nowrap;
        height: 100%;
        border-radius: 4px 0 0 4px;
        background: var(--Tertiary-ContainerAlpha, rgba(1, 72, 128, 0.95));
        padding: 0 8px 8px 28px;
        width: 100%;
        overflow-x: hidden;
        overflow-y: auto;

        ul {
          padding-right: 22px;
        }
      }

      .localNav-item {
        .localNav-item-content {
          display: block;
          padding: 3px 9px;
          border: 1px solid transparent;
          border-radius: 100px;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.4;
          color: #fff;
          text-decoration: none;
          white-space: nowrap;
          transition: border-color .2s ease-out, color .2s ease-out;

          &:hover {
            text-decoration: underline;
          }

          &.currentActive {
            font-weight: 700;
            border-color: #FFF;

            @media screen and (max-width: 1200px) {
              border-color: #0075D2;
              border-width: 0 0 1px 0;
            }

            &:hover {
              text-decoration: none;
            }

            &::before {
              @media screen and (max-width: 1200px) {
                content: '';
                display: block;
                position: absolute;
                left: calc(-8px - 7px);
                top: 50%;
                transform: translateY(-50%);
                width: 8px;
                height: 8px;
                border-radius: 100%;
                background: #FFF;
              }
            }
          }
          &:focus-visible {
            outline: 2px solid #A6A6A6;
          }

          @media screen and (max-width: 1200px) {
            border-radius: 0;
            padding: 16px 10px 16px 0;
            color: #FFF;
            border-bottom-color: #0075D2;
            font-size: 16px;
            position: relative;

            &:hover {
              text-decoration: none;
            }

            &::before {
              content: '';
              position: absolute;
              left: 0;
              bottom: calc(14px + 0.2em - 2px);
              width: 0;
              height: 1px;
              background-color: #0062C2;
              transition: width 0.12s ease-out;

              @media screen and (max-width: 1200px) {
                content: none;
              }
            }

            &:hover {
              color: #0062C2;

              @media screen and (max-width: 1200px) {
                color: #FFF;
              }
            }
          }
        }
        a.localNav-item-content {
          display: flex;
          position: relative;
          column-gap : 4px;
          align-items: center;

          &::after {
            content: none;
            width: 14px;
            aspect-ratio: 1;
            display: inline-block;
            background-size: contain;
            background-repeat: no-repeat;

            @media screen and (max-width: 1200px) {
              opacity: 1;
              content: '';
              display: block;
              width: 14px;
              aspect-ratio:1;
              background-image: url(/assets/img/icon-bullet-link-w.svg);
              background-size: contain;
              background-repeat: no-repeat;
              position: absolute;
              left: auto;
              right: 6px;
              bottom: 50%;
              transform: translateY(50%);
            }
          }

          &[target="_blank"]::after {
            content: '別ウィンドウが開きます';
            text-indent: -200vw;
            overflow: hidden;
            background-image: url(/assets/img/new_window_icon2024-white.svg);

            @media screen and (max-width: 1200px) {
              transform: translateY(50%);
            }
          }
        }
      }

      .localNav-item:has(.localNav-subItem) + .localNav-item .localNav-item-content {
        @media screen and (max-width: 1200px) {
          border-top-color: #0075D2;
        }
      }
    }

    .localNav-subItem {
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;

      left: 0;
      top: 100%;
      width: 100cqw;
      background: #F3F8FD;
      padding: 8px 0;
      border-bottom: 1px solid #E1E1E1;

      @media screen and (max-width: 1200px) {
        position: static;
        width: 100%;
        padding: 0;
        padding-left: 16px;
        background: transparent;
        border-bottom: none;
      }

      .localNav-subItem-series {
        display: flex;
        flex-wrap: wrap;
        padding: 0 calc(var(--pageSidePadding-desktop) - 1px);
        gap: 0 10px;

        max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
        width: 100%;

        @media screen and (max-width: 1200px) {
          margin-left: 0;
          flex-direction: column;
          width: 100%;
          gap: 0;
          background: #014880;
          padding: 0;
        }

        .localNav-subItem-item {
          @media screen and (max-width: 1200px) {
            width: 100%;
          }
        }
 
        .localNav-subItem-item:last-child .localNav-item-content {
          @media screen and (max-width: 1200px) {
            border-bottom: none;
          }
        }

        & .localNav-subItem-item {
          .localNav-item-content,
          .localNav-item-content.currentActive {
            @media screen and (max-width: 1200px) {
              border-bottom-color: #015DB5;
            }
          }
        } 

        .localNav-item-content {
          color: #333;
          display: flex;
          align-items: center;
          flex-wrap: nowrap;
          border: 1px solid var(--Text-Icon, transparent);
          padding: 3px 0;
          font-size: 14px;
          gap: 4px;

          @media screen and (max-width: 1200px) {
            padding: 16px 30px 16px 0;
            font-size: 16px;
            color: #FFF;
            white-space: normal;

            border: none;
            border-bottom: 1px solid #0075D2;
          }

          &.currentActive {
            border: 1px solid #8C8C8C;
            padding: 3px 9px;

            &::after {
              content: none;
            }

            &:hover {
              text-decoration: none;
            }

            @media screen and (max-width: 1200px) {
              border: none;
              border-bottom: 1px solid #0075D2;
              color: #FFF;

              padding: 16px 30px 16px 0;

              &:after {
                content: '';
              }
            }
          }
        }
        a.localNav-item-content {
          background-color: transparent;

          &::after {
            content: '';
            width: 14px;
            aspect-ratio: 1;
            background-image: url(/assets/img/chevron-rightward-narrow-gray.svg);
            background-size: contain;
            background-repeat: no-repeat;

            @media screen and (max-width: 1200px) {
              opacity: 1;
              content: '';
              display: block;
              background-image: url(/assets/img/icon-bullet-link-w.svg);
              position: absolute;
              left: auto;
              right: 6px;
              bottom: 50%;
              transform: translateY(50%);
            }
          }
          &[target="_blank"]::after {
            content: '別ウィンドウが開きます';
            text-indent: -200vw;
            overflow: hidden;
            background-image: url(/assets/img/new_window_icon2024-gray.svg);

            @media screen and (max-width: 1200px) {
              background-image: url(/assets/img/new_window_icon2024-white.svg);
              transform: translate(-4px, 50%);
            }
          }
        }
      }
    }

    .localNav-toggle {
      display: none;
      margin-left: auto;

      @media screen and (max-width: 1200px) {
        position: relative;
        right: 0;
        top: 0;
        display: flex;
        column-gap: 4px;
        align-self: stretch;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        border: none;
        background: #014880;
        padding: 20px 18px;
        text-transform: uppercase;

        color: #fff;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.4;

        &::before {
          position: absolute;
          content: none;
          left: -1px;
          top: 50%;
          transform: translateY(-50%);
          width: 1px;
          height: 100%;
          background: #9BC4F0;
        }

        &.currentActive {
          background: #014880;

          &::after {
            content: '';
            position: absolute;
            left: 50%;
            bottom: 0;
            transform: translateX(-50%);
            display: block;
            height: 1px;
            width: calc(100% - 16px);

            background: #015DB5;
          }
          .localNav-toggle-icon {
            background-image: url(/assets/img/icon-cancel-white.svg);
          }
        }

        .localNav-toggle-icon {
          text-indent: -200%;
          overflow: hidden;
          display: block;
          width: 12px;
          margin-left: auto;
          aspect-ratio: 1;
          background-image: url(/assets/img/chevron-downward-white.svg), url(/assets/img/icon-cancel-white.svg);
          background-size: contain, 0;
          background-repeat: no-repeat;
        }

        .localNav-additional-guide-text {
          text-indent: -200vw;
        }
      }
    }
  }

  /* ---------------------------------------------------- パンくずリスト */
  .pagePath {
    box-sizing: border-box;
    max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
    margin: 14px auto 0;
    padding: 0 var(--pageSidePadding-desktop);

    @media screen and (max-width: 1200px) {
      padding: 0 16px;
    }

    &[data-placement="pageBottom"] {
      margin-top: 0;
      padding: 13px 10px 12px;
      border-top: 1px solid #CCC;;
    }

    .pagePath-series {
      list-style: none;
      display: flex;
      column-gap: 4px;
      row-gap: 8px;
      flex-wrap: wrap;
      margin-left: -4px;

      .pagePath-item {
        display: flex;
        column-gap: 4px;
        font-size: 12px;

        &::after {
          content: '/';
          color: #CCC;
          font-size: 12px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.35
        }
        &:last-child {
          &::after {
            content: none;
          }

          .pagePath-item-content {
            color: #333;
            font-weight: 700;
          }
        }


        .pagePath-item-content {
          display: inline-block;
          padding: 0 4px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.35;
          color: #4D4D4D;
          text-decoration: none;
          white-space: nowrap;

        }
        a.pagePath-item-content {

          &:hover {
            text-decoration: underline;
          }
        }
      }
    }
  }
  &:has(.pagePath) + *:not(:has(.pageTitle, footer)) {
    margin-top: 14px;
  }
  &:has(.pagePath) + *:has(.pageTitle) {
    margin-top: 0;
  }
  &:has(.pagePath) + .footer#km-footer {
    margin-top: 0;
  }

  /* eg. IR Annual Report */
  &:has(.pagePath) + #anchorContents:not(:has(.pageTitle)) {
    @media screen and (min-width: 1201px) {
      margin-top: 14px !important;
    }
  }

  /* ---------------------------------------------------- ページタイトル H1 */
  .pageTitle {
    box-sizing: border-box;
    max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
    margin: 0 auto;
    padding: 0 var(--pageSidePadding-desktop);

    color: #333;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.4;

    @media screen and (max-width: 1200px) {
      padding: 0 10px;
    }

    .pageTitle-shoulder {
      display: block;
      font-size: 16px;
      margin-top: calc(38px * (0.2));
      padding-bottom: .0625em;
    }
  }

  &:has(.pagePath) + * .pageTitle {
    padding-top: 34px;

    @media screen and (max-width: 1200px) {
      padding-bottom: 14px;
    }
  }


  &:has(.pageTitle) + * {
    margin-top: 14px;
  }


  /* ---------------------------------------------------- 企業サイトフッター */
  .corporateFooter {

    .corporateFooter-nav-main-bracket {
      background: #EEE;
      padding: 32px 0 24px;

      @media screen and (max-width: 1200px) {
        padding: 10px;
      }

      .corporateFooter-nav-main {
        margin: 0 auto;
        max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
        padding: 0 var(--pageSidePadding-desktop);

        display: flex;
        column-gap: 40px;
        justify-content: space-between;
        flex-wrap: nowrap;

        @media screen and (max-width: 1200px) {
          display: none;
        }

        .corporateFooter-nav-main-section {
          flex: 1;
        }
      }
    }

    .corporateFooter-nav-main-section {
      .corporateFooter-nav-main-section-title {
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.4;
        position: relative;
        display: flex;
        align-items: center;
        column-gap: 4px;
        white-space: nowrap;

        &::after {
          content: '';
          width: 14px;
          aspect-ratio: 1;
          background-image: url(/assets/img/chevron-rightward-narrow-gray.svg);
          background-size: contain;
          background-repeat: no-repeat;
        }
      }
      .corporateFooter-nav-main-section-title:has(a) {
        &:hover {
          text-decoration: underline;
        }
      }
      .corporateFooter-nav-main-section-title:has(a[target="_blank"]) {
        &::after {
          content: '別ウィンドウが開きます';
          text-indent: -200vw;
          overflow: hidden;
          width: 14px;
          display: inline-block;
          aspect-ratio: 1;
          background-image: url(/assets/img/new_window_icon2024.svg);
          background-size: contain;
          background-repeat: no-repeat;
        }
      }
      .corporateFooter-nav-main-section-item-series {
        margin-top: 16px;
        display: flex;
        flex-direction: column;
        row-gap: 4px;

        .corporateFooter-nav-main-section-item {
          .corporateFooter-nav-main-section-item-content {
            padding: 4px 0;

            font-size: 12px;
            display: flex;
            align-items: center;
            column-gap: 4px;
            font-size: 12px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.35;

            &[target="_blank"]::after {
              content: '別ウィンドウが開きます';
              text-indent: -200vw;
              overflow: hidden;
              width: 14px;
              display: inline-block;
              aspect-ratio: 1;
              background-image: url(/assets/img/new_window_icon2024-gray.svg);
              background-size: contain;
              background-repeat: no-repeat;
            }
          }
          a.corporateFooter-nav-main-section-item-content {
            &:hover {
              text-decoration: underline;
            }
          }
        }

        + .corporateFooter-nav-main-section-item-series {
          margin-top: 8px;
          border-top: 1px solid #CCC;
          padding-top: 8px;
        }
      }

      &:not(:has(.corporateFooter-nav-main-section-item-series)) {
        .corporateFooter-nav-main-section-title a {
          font-weight: 400;
        }
      }
    }

    .corporateFooter-nav-trailer {
      margin: 24px auto 0;
      max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
      padding: 0 var(--pageSidePadding-desktop);
      display: flex;
      align-items: center;
      justify-content: space-between;

      @media screen and (max-width: 1200px) {
        margin-top: 0;
        padding: 0;
        max-width: none;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        row-gap: 16px;
      }

      .corporateFooter-nav-trailer-textItem {
        .corporateFooter-nav-trailer-textItem-content {
          padding: 2px 0;
          display: flex;
          align-items: center;
          column-gap: 4px;
          font-size: 14px;
          font-style: normal;
          font-weight: 700;
          line-height: 1.4;

          @media screen {
            margin-top: 6px;
          }

          &:hover {
            text-decoration: underline;
          }

          &::after {
            content: '';
            width: 14px;
            aspect-ratio: 1;
            background-image: url(/assets/img/chevron-rightward-narrow-gray.svg);
            background-size: contain;
            background-repeat: no-repeat;
          }

          &[target="_blank"]::after {
            content: '別ウィンドウが開きます';
            text-indent: -200vw;
            overflow: hidden;
            width: 14px;
            display: inline-block;
            aspect-ratio: 1;
            background-image: url(/assets/img/new_window_icon2024-gray.svg);
            background-size: contain;
            background-repeat: no-repeat;
          }
        }
      }
      .corporateFooter-nav-trailer-rectItem {
        margin-left: auto;

        @media screen and (max-width: 1200px) {
          width: auto;
          margin-left: auto;
        }

        .corporateFooter-nav-trailer-rectItem-content {
          display: flex;
          height: 40px;
          padding: 0 20px;
          justify-content: center;
          align-items: center;
          gap: 4px;
          border-radius: 4px;
          border: 1px solid #747474;
          background: var(--General-WhiteAlpha, rgba(255, 255, 255, 0.97));

          color: #333;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.4;
          transition: boder-color .2s ease-out, color .2s ease-out;

          @media screen and (max-width: 1200px) {
            padding: 0 12px;
          }

          &:hover {
            color: #0062C2;
            border-color: #0062C2;
          }

          &[target="_blank"]::after {
            content: '別ウィンドウが開きます';
            text-indent: -200vw;
            overflow: hidden;
            width: 14px;
            display: inline-block;
            aspect-ratio: 1;
            background-image: url(/assets/img/new_window_icon2024.svg);
            background-size: contain;
            background-repeat: no-repeat;
            transition: background .2s ease-out;
          }
          &[target="_blank"]:hover::after {
            background-image: url(/assets/img/new_window_icon2024-hover.svg);
          }

          .corporateFooter-nav-trailer-rectItem-content-icon {
            width: 16px;
            aspect-ratio: 1;
            display: inline-block;
            background-size: contain;

            .corporateFooter-nav-trailer-rectItem-content-icon-img {
              display: block;
              width: 100%;
              height: 100%;
              object-fit: contain;
              transition: opacity .2s ease-out;
            }
          }
          &:hover .corporateFooter-nav-trailer-rectItem-content-icon-img {
            opacity: 0;
          }
        }
      }
    }

    .corporateFooter-nav-bottom-bracket {
      background: var(--gradatedPatternForNavigationForDesktop);

      @media screen and (max-width: 1200px) {
        background: var(--gradatedPatternForNavigationForMobile);
      }
    }

    .corporateFooter-nav-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin: 0 auto;
      max-width: calc(var(--pageWidth-desktop) + var(--pageSidePadding-desktop) * 2);
      padding: 10px var(--pageSidePadding-desktop);

      @media screen and (max-width: 1200px) {
        flex-direction: column;
        align-items: center;
        padding-inline: 10px;
      }

      .corporateFooter-nav-bottom-copyright {
        justify-self: flex-end;
        margin-left: auto;
        @media screen and (max-width: 1200px) {
          margin-left: 0;
        }
      }
    }

    .corporateFooter-nav-bottom-notice-series {
      display: flex;
      column-gap: calc(16px + 1px);

      @media screen and (max-width: 1200px) {
        flex-wrap: wrap;
        justify-content: center;
      }

      .corporateFooter-nav-bottom-notice-item {
        &:first-child .corporateFooter-nav-bottom-notice-item-content::before {
          content: none;
          display: none;
        }

        #ot-sdk-btn.ot-sdk-show-settings,
        .corporateFooter-nav-bottom-notice-item-content {
          display: block;
          position: relative;
          padding: 4px 0;

          font-size: 12px;
          font-style: normal;
          font-weight: 400;
          line-height: 1.35;
          color: #FFF;
          text-decoration: none;

          &::before {
            content: '';
            position: absolute;
            left: -9px;
            top: 50%;
            transform: translateY(-50%);
            width: 1px;
            height: 1em;
            background-color: #FFF;
          }

          &:hover {
            text-decoration: underline;
          }

          &[target="_blank"]::after {
            content: '別ウィンドウが開きます';
            text-indent: -200vw;
            overflow: hidden;
            width: 14px;
            display: inline-block;
            aspect-ratio: 1;
            background-image: url(/assets/img/new_window_icon2024-white.svg);
            background-size: contain;
            background-repeat: no-repeat;
          }
        }
      }
    }

    .corporateFooter-nav-bottom-copyright {
      color: #FFF;
      font-family: "Open Sans";
      font-size: 10px;
      font-style: normal;
      font-weight: 400;
      line-height: 1.6;
    }
  }

  /* ---------------------------------------------------- ページトップリンク */
  &.pagetopButtonBracket {
    display: block;
    position: sticky;
    left: calc(50vw + 1180px / 2 - 20px);
    top: auto;
    bottom: 20px;
    margin: 0 0 20px;
    margin-top: calc(-44px - 20px) !important; /* 自分の高さ分を引く */
    width: 44px;
    opacity: 1;
    transition: opacity .3s ease-out, display .3s;
    transition-behavior: allow-discrete;
    z-index: 65537; /* l-hedader を上回る必要がある */

    @media screen and (max-width: 1259px) {
      left: calc(100% - 10px - 44px);
    }

    @starting-style {
      display: block;
      opacity: 0;
    }

    &.invisible {
      display: none;
      opacity: 0;
    }

    .corporateFooter-pagetopButton {
      display: block;
      width: 100%;
      padding: 12px;
      aspect-ratio: 1;
      text-indent: -200vw;
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.50);
      background-color: #0062C2;

      &:hover {
        border: 1px solid rgba(255, 255, 255, 0.50);
        background: #0156A1;
      }

      .corporateFooter-pagetopButton-label {
        display: block;
        width: 0;
        height: 0;
        text-indent: -200vw;
        overflow: hidden;
      }

      .corporateFooter-pagetopButton-icon {
        display: block;
        width: 100%;
        aspect-ratio: 1;
        background-image: url(/assets/img/chevron-upward-white.svg);
        background-position: center;
        background-size: contain;
      }
    }
  }
}
