@charset "UTF-8";
body {
  margin: 0; }

.wrapper {
  line-height: 1; }
  .wrapper div,
  .wrapper span,
  .wrapper object,
  .wrapper iframe,
  .wrapper h1,
  .wrapper h2,
  .wrapper h3,
  .wrapper h4,
  .wrapper h5,
  .wrapper h6,
  .wrapper p,
  .wrapper blockquote,
  .wrapper pre,
  .wrapper abbr,
  .wrapper address,
  .wrapper cite,
  .wrapper code,
  .wrapper del,
  .wrapper dfn,
  .wrapper em,
  .wrapper img,
  .wrapper q,
  .wrapper samp,
  .wrapper strong,
  .wrapper sub,
  .wrapper sup,
  .wrapper var,
  .wrapper b,
  .wrapper i,
  .wrapper dl,
  .wrapper dt,
  .wrapper dd,
  .wrapper ol,
  .wrapper ul,
  .wrapper li,
  .wrapper fieldset,
  .wrapper form,
  .wrapper label,
  .wrapper legend,
  .wrapper table,
  .wrapper caption,
  .wrapper tbody,
  .wrapper tfoot,
  .wrapper thead,
  .wrapper tr,
  .wrapper th,
  .wrapper td,
  .wrapper article,
  .wrapper aside,
  .wrapper canvas,
  .wrapper details,
  .wrapper figcaption,
  .wrapper figure,
  .wrapper footer,
  .wrapper header,
  .wrapper hgroup,
  .wrapper menu,
  .wrapper nav,
  .wrapper section,
  .wrapper summary,
  .wrapper time,
  .wrapper mark,
  .wrapper audio,
  .wrapper video {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    border: 0;
    outline: 0;
    box-sizing: border-box; }
  .wrapper article,
  .wrapper aside,
  .wrapper details,
  .wrapper figcaption,
  .wrapper figure,
  .wrapper footer,
  .wrapper header,
  .wrapper hgroup,
  .wrapper menu,
  .wrapper nav,
  .wrapper section {
    display: block; }
  .wrapper ol,
  .wrapper ul {
    list-style: none; }
  .wrapper blockquote,
  .wrapper q {
    quotes: none; }
  .wrapper blockquote:before,
  .wrapper blockquote:after,
  .wrapper q:before,
  .wrapper q:after {
    content: "";
    content: none; }
  .wrapper a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline; }
  .wrapper mark {
    font-style: italic;
    font-weight: bold;
    color: #000;
    background-color: #ff9; }
  .wrapper del {
    text-decoration: line-through; }
  .wrapper table {
    border-collapse: collapse;
    border-spacing: 0; }
  .wrapper hr {
    display: block;
    height: 1px;
    margin: 1em 0;
    padding: 0;
    border: 0;
    border-top: 1px solid #ccc; }
  .wrapper input,
  .wrapper select {
    vertical-align: middle; }
  .wrapper img {
    font-size: 0;
    line-height: 0;
    vertical-align: top; }

/* ------------------------------------------------------------
 easing
------------------------------------------------------------ */
:root {
  --easeInSine: cubic-bezier(0.47, 0, 0.745, 0.715);
  --easeOutSine: cubic-bezier(0.39, 0.575, 0.565, 1 );
  --easeInOutSine: cubic-bezier(0.445, 0.05, 0.55, 0.95 );
  --easeInQuad: cubic-bezier(0.55, 0.085, 0.68, 0.53 );
  --easeOutQuad: cubic-bezier(0.25, 0.46, 0.45, 0.94 );
  --easeInOutQuad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  --easeInCubic: cubic-bezier(0.55, 0.055, 0.675, 0.19 );
  --easeOutCubic: cubic-bezier(0.215, 0.61, 0.355, 1 );
  --easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1 );
  --easeInQuart: cubic-bezier(0.895, 0.03, 0.685, 0.22 );
  --easeOutQuart: cubic-bezier(0.165, 0.84, 0.44, 1 );
  --easeInOutQuart: cubic-bezier(0.77, 0, 0.175, 1 );
  --easeInQuint: cubic-bezier(0.755, 0.05, 0.855, 0.06 );
  --easeOutQuint: cubic-bezier(0.23, 1, 0.32, 1 );
  --easeInOutQuint: cubic-bezier(0.86, 0, 0.07, 1 );
  --easeInExpo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
  --easeOutExpo: cubic-bezier(0.19, 1, 0.22, 1 );
  --easeInOutExpo: cubic-bezier(1, 0, 0, 1 );
  --easeInCirc: cubic-bezier(0.6, 0.04, 0.98, 0.335);
  --easeOutCirc: cubic-bezier(0.075, 0.82, 0.165, 1 );
  --easeInOutCirc: cubic-bezier(0.785, 0.135, 0.15, 0.86 );
  --easeInBack: cubic-bezier(0.6, -0.28, 0.735, 0.045);
  --easeOutBack: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --easeInOutBack: cubic-bezier(0.68, -0.55, 0.265, 1.55 ); }

html.modal__active,
body.modal__active,
html.nav__active,
body.nav__active {
  overflow: hidden;
  height: auto; }

div, span, a {
  box-sizing: border-box; }

/**
 * clamp()関数を生成するSCSS関数 (LibSass版)
 * @param {Number} $min-size - 最小フォントサイズ (例: 1rem, 16px)
 * @param {Number} $max-size - 最大フォントサイズ (例: 2.5rem, 40px)
 * @return {String} - CSSのclamp()関数
 */
:root {
  --infiniteloop-item-length:0; }

html {
  font-size: 62.5%;
  scroll-behavior: smooth; }

.wrapper {
  position: relative;
  margin: 0 auto;
  line-height: 1.8;
  font-family: "Noto Sans JP" , "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color: #180000;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "palt";
  font-optical-sizing: auto;
  min-width: 1000px;
  font-weight: 500; }
  @media screen and (max-width: 768px) {
    .wrapper {
      min-width: auto; } }
  .wrapper.--bg-black {
    background: #18191C; }

.wrapper {
  /* ハンバーガーボタンのスタイル */
  /* 全画面ナビゲーションのスタイル */ }
  .wrapper .mt-0 {
    margin-top: 0px !important; }
  .wrapper .mb-0 {
    margin-bottom: 0px !important; }
  .wrapper .m-0 {
    margin: 0px !important; }
  .wrapper .mt-8 {
    margin-top: 8px !important; }
  .wrapper .mb-8 {
    margin-bottom: 8px !important; }
  .wrapper .m-8 {
    margin: 8px !important; }
  .wrapper .mt-16 {
    margin-top: 16px !important; }
  .wrapper .mb-16 {
    margin-bottom: 16px !important; }
  .wrapper .m-16 {
    margin: 16px !important; }
  .wrapper .mt-24 {
    margin-top: 24px !important; }
  .wrapper .mb-24 {
    margin-bottom: 24px !important; }
  .wrapper .m-24 {
    margin: 24px !important; }
  .wrapper .mt-32 {
    margin-top: 32px !important; }
  .wrapper .mb-32 {
    margin-bottom: 32px !important; }
  .wrapper .m-32 {
    margin: 32px !important; }
  .wrapper .mt-40 {
    margin-top: 40px !important; }
  .wrapper .mb-40 {
    margin-bottom: 40px !important; }
  .wrapper .m-40 {
    margin: 40px !important; }
  .wrapper .mt-48 {
    margin-top: 48px !important; }
  .wrapper .mb-48 {
    margin-bottom: 48px !important; }
  .wrapper .m-48 {
    margin: 48px !important; }
  .wrapper .mt-56 {
    margin-top: 56px !important; }
  .wrapper .mb-56 {
    margin-bottom: 56px !important; }
  .wrapper .m-56 {
    margin: 56px !important; }
  .wrapper .mt-64 {
    margin-top: 64px !important; }
  .wrapper .mb-64 {
    margin-bottom: 64px !important; }
  .wrapper .m-64 {
    margin: 64px !important; }
  .wrapper .mt-72 {
    margin-top: 72px !important; }
  .wrapper .mb-72 {
    margin-bottom: 72px !important; }
  .wrapper .m-72 {
    margin: 72px !important; }
  .wrapper .mt-80 {
    margin-top: 80px !important; }
  .wrapper .mb-80 {
    margin-bottom: 80px !important; }
  .wrapper .m-80 {
    margin: 80px !important; }
  .wrapper .pt-0 {
    padding-top: 0px !important; }
  .wrapper .pb-0 {
    padding-bottom: 0px !important; }
  .wrapper .p-0 {
    padding: 0px !important; }
  .wrapper .pt-8 {
    padding-top: 8px !important; }
  .wrapper .pb-8 {
    padding-bottom: 8px !important; }
  .wrapper .p-8 {
    padding: 8px !important; }
  .wrapper .pt-16 {
    padding-top: 16px !important; }
  .wrapper .pb-16 {
    padding-bottom: 16px !important; }
  .wrapper .p-16 {
    padding: 16px !important; }
  .wrapper .pt-24 {
    padding-top: 24px !important; }
  .wrapper .pb-24 {
    padding-bottom: 24px !important; }
  .wrapper .p-24 {
    padding: 24px !important; }
  .wrapper .pt-32 {
    padding-top: 32px !important; }
  .wrapper .pb-32 {
    padding-bottom: 32px !important; }
  .wrapper .p-32 {
    padding: 32px !important; }
  .wrapper .pt-40 {
    padding-top: 40px !important; }
  .wrapper .pb-40 {
    padding-bottom: 40px !important; }
  .wrapper .p-40 {
    padding: 40px !important; }
  .wrapper .pt-48 {
    padding-top: 48px !important; }
  .wrapper .pb-48 {
    padding-bottom: 48px !important; }
  .wrapper .p-48 {
    padding: 48px !important; }
  .wrapper .pt-56 {
    padding-top: 56px !important; }
  .wrapper .pb-56 {
    padding-bottom: 56px !important; }
  .wrapper .p-56 {
    padding: 56px !important; }
  .wrapper .pt-64 {
    padding-top: 64px !important; }
  .wrapper .pb-64 {
    padding-bottom: 64px !important; }
  .wrapper .p-64 {
    padding: 64px !important; }
  .wrapper .pt-72 {
    padding-top: 72px !important; }
  .wrapper .pb-72 {
    padding-bottom: 72px !important; }
  .wrapper .p-72 {
    padding: 72px !important; }
  .wrapper .pt-80 {
    padding-top: 80px !important; }
  .wrapper .pb-80 {
    padding-bottom: 80px !important; }
  .wrapper .p-80 {
    padding: 80px !important; }
  .wrapper a {
    text-decoration: none; }
  .wrapper .text-center {
    text-align: center; }
  .wrapper .text-marker {
    background: linear-gradient(transparent 70%, #FFDD00 70%); }
  .wrapper .text-underline {
    text-decoration: underline; }
  .wrapper .text-large {
    font-size: 120%; }
    @media screen and (max-width: 768px) {
      .wrapper .text-large {
        font-size: 110%; } }
  .wrapper .text-xlarge {
    font-size: 150%; }
    @media screen and (max-width: 768px) {
      .wrapper .text-xlarge {
        font-size: 120%; } }
  .wrapper .text-small {
    font-size: 12px; }
  .wrapper .text-muted {
    opacity: .7; }
  .wrapper .text-red {
    color: #e70012; }
  .wrapper .text-blue {
    color: #1C2C92; }
  .wrapper .text-green {
    color: #00A06E; }
  .wrapper .text-purple {
    color: #b200b8; }
  .wrapper .max-width100 {
    max-width: 100%; }
  @media screen and (max-width: 768px) {
    .wrapper .pc-only {
      display: none !important; } }
  @media screen and (min-width: 768px) {
    .wrapper .sp-only {
      display: none !important; } }
  .wrapper .youtube iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    border-radius: 8px;
    border: solid 1px #CDD6DD; }
  .wrapper .hamburger-button {
    position: fixed;
    /* 画面に固定 */
    /*    top: 248px;
        right: 84px;*/
    top: 20px;
    right: 20px;
    z-index: 1005;
    width: 80px;
    height: 80px;
    background: url("../../common/images/hamburger-button_bg.png");
    background-size: 100%;
    border: none;
    border-radius: 0;
    cursor: pointer;
    padding: 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: top 0.3s ease, right 0.3s ease;
    /* スクロール時のスタイル */
    /* ボタンの3本ライン */ }
    .wrapper .hamburger-button.scrolled {
      top: 20px;
      right: 20px; }
      @media screen and (max-width: 768px) {
        .wrapper .hamburger-button.scrolled {
          top: 5vw !important;
          right: 3vw !important; } }
    @media screen and (max-width: 768px) {
      .wrapper .hamburger-button {
        width: 13.020833333333334vw;
        height: 13.020833333333334vw;
        border-radius: 0;
        /*        top: 47vw;
                right: 1vw;*/
        top: 5vw !important;
        right: 3vw !important;
        /* スクロール時のスタイル */ }
        .wrapper .hamburger-button.scrolled {
          top: 20px;
          right: 20px; } }
    .wrapper .hamburger-button span {
      display: block;
      position: absolute;
      width: 36px;
      height: 4px;
      left: 22px;
      background-color: #000000;
      border-radius: 2px;
      transition: all 0.4s ease-in-out;
      /* アニメーションの変化を滑らかに */
      /* 各ラインの初期位置 */ }
      @media screen and (max-width: 768px) {
        .wrapper .hamburger-button span {
          width: 7vw;
          height: 0.6vw;
          left: 3vw; } }
      .wrapper .hamburger-button span:nth-child(1) {
        top: 28px; }
        @media screen and (max-width: 768px) {
          .wrapper .hamburger-button span:nth-child(1) {
            top: 3.90625vw; } }
      .wrapper .hamburger-button span:nth-child(2) {
        top: 38px; }
        @media screen and (max-width: 768px) {
          .wrapper .hamburger-button span:nth-child(2) {
            top: 6.510416666666667vw; } }
      .wrapper .hamburger-button span:nth-child(3) {
        top: 48px; }
        @media screen and (max-width: 768px) {
          .wrapper .hamburger-button span:nth-child(3) {
            top: 9.114583333333332vw; } }
    .wrapper .hamburger-button.active span:nth-child(1) {
      top: 28px;
      transform: rotate(45deg); }
      @media screen and (max-width: 768px) {
        .wrapper .hamburger-button.active span:nth-child(1) {
          top: 6.510416666666667vw; } }
    .wrapper .hamburger-button.active span:nth-child(2) {
      opacity: 0; }
    .wrapper .hamburger-button.active span:nth-child(3) {
      top: 28px;
      transform: rotate(-45deg); }
      @media screen and (max-width: 768px) {
        .wrapper .hamburger-button.active span:nth-child(3) {
          top: 6.510416666666667vw; } }
  .wrapper .fullscreen-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../../common/images/bg.png);
    background-position: center;
    background-size: contain;
    z-index: 1005;
    /* 初期状態では非表示 */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0.5s;
    display: flex;
    align-items: center;
    justify-content: center;
    /* ナビゲーションがアクティブになったら表示 */
    /* 閉じるボタンのスタイル */
    /* ナビゲーションのメニューリスト */ }
    @media screen and (max-width: 768px) {
      .wrapper .fullscreen-nav {
        background-size: auto; } }
    .wrapper .fullscreen-nav.active {
      opacity: 1;
      visibility: visible; }
    .wrapper .fullscreen-nav .close-button {
      position: fixed;
      top: 1.04vw;
      right: 1.04vw;
      width: 80px;
      height: 80px;
      background: url("../../common/images/hamburger-button_bg.png");
      background-size: 100%;
      border: none;
      border-radius: 0;
      cursor: pointer;
      padding: 0;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
      z-index: 1006;
      /* ×印のスタイル */ }
      @media screen and (max-width: 768px) {
        .wrapper .fullscreen-nav .close-button {
          width: 13.020833333333334vw;
          height: 13.020833333333334vw;
          border-radius: 0;
          top: 5vw;
          right: 3vw; } }
      .wrapper .fullscreen-nav .close-button span {
        display: block;
        position: absolute;
        width: 36px;
        height: 4px;
        left: 22px;
        background-color: #000000;
        border-radius: 2px;
        top: 38px; }
        @media screen and (max-width: 768px) {
          .wrapper .fullscreen-nav .close-button span {
            width: 10.416666666666668vw;
            height: 0.65104167vw;
            left: 1.3020833333333335vw;
            top: 6.510416666666667vw; } }
        .wrapper .fullscreen-nav .close-button span:nth-child(1) {
          transform: rotate(45deg); }
        .wrapper .fullscreen-nav .close-button span:nth-child(2) {
          transform: rotate(-45deg); }
    .wrapper .fullscreen-nav .nav-logo {
      width: 18.2291vw;
      max-width: 350px;
      text-align: center;
      margin: 2vw auto 2vw; }
      @media screen and (max-width: 768px) {
        .wrapper .fullscreen-nav .nav-logo {
          width: 60.67708vw;
          max-width: 466px;
          padding: 0;
          margin-bottom: 14.322916vw; } }
      .wrapper .fullscreen-nav .nav-logo img {
        width: 100%;
        height: auto; }
    .wrapper .fullscreen-nav .nav-links__list {
      text-align: center;
      line-height: 1; }
      .wrapper .fullscreen-nav .nav-links__list li {
        margin: 0 0 1.8vw; }
        @media screen and (max-width: 768px) {
          .wrapper .fullscreen-nav .nav-links__list li {
            margin: 0 0 9.765625vw; } }
        .wrapper .fullscreen-nav .nav-links__list li a {
          font-family: "vdl-lineg", sans-serif;
          font-weight: 200;
          font-style: normal;
          color: #fff;
          text-decoration: none;
          font-size: 1.6vw;
          font-weight: unset;
          transition: color 0.3s; }
          .wrapper .fullscreen-nav .nav-links__list li a span.pink {
            color: #ffdbee; }
          .wrapper .fullscreen-nav .nav-links__list li a span.blue {
            color: #ddd3ff; }
          @media screen and (max-width: 768px) {
            .wrapper .fullscreen-nav .nav-links__list li a {
              font-size: 6.25vw; } }
          .wrapper .fullscreen-nav .nav-links__list li a:hover span {
            color: #fff !important; }
            .wrapper .fullscreen-nav .nav-links__list li a:hover span::before {
              background-color: #fff !important; }
    .wrapper .fullscreen-nav .nav-top-nanana {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 5.2083vw;
      max-height: 100px; }
      .wrapper .fullscreen-nav .nav-top-nanana img {
        width: 100%;
        height: auto;
        object-fit: cover; }
      @media screen and (max-width: 768px) {
        .wrapper .fullscreen-nav .nav-top-nanana {
          height: 17.578125vw;
          max-height: 135px;
          overflow: hidden; }
          .wrapper .fullscreen-nav .nav-top-nanana img {
            width: auto;
            height: 100%; } }
    .wrapper .fullscreen-nav .nav-bottom-nanana {
      position: fixed;
      bottom: 0;
      left: 0;
      width: 100%;
      max-height: 100px; }
      .wrapper .fullscreen-nav .nav-bottom-nanana img {
        width: 100%;
        height: auto;
        object-fit: cover; }
      @media screen and (max-width: 768px) {
        .wrapper .fullscreen-nav .nav-bottom-nanana {
          height: 17.578125vw;
          max-height: 135px;
          overflow: hidden; }
          .wrapper .fullscreen-nav .nav-bottom-nanana img {
            width: auto;
            height: 100%; } }

.wrapper .more-button-container {
  position: relative;
  z-index: 10;
  width: 290px;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    .wrapper .more-button-container {
      width: 65.10416vw;
      max-width: none; } }
.wrapper .more-button {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border: 4px solid #000;
  border-radius: 100px;
  color: #000;
  font-size: 22px;
  font-family: "vdl-lineg", sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.075em;
  padding: 5px 0 5px 0; }
  @media screen and (max-width: 768px) {
    .wrapper .more-button {
      font-size: 4.6875vw;
      padding: 3.125vw;
      border-radius: 100px; } }

/* iOS Safari用の最適化 */
.left-nanana .bg,
.bottom-nanana .bg,
.top-nanana .bg {
  will-change: transform;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

/* 音声プレーヤーの最適化 */
.profile-info-voice__player {
  contain: layout style; }

.wrapper .common-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid #CDD6DD; }
  .wrapper .common-table.--sp-block th, .wrapper .common-table.--sp-block td {
    display: block;
    width: 100%; }
  .wrapper .common-table th, .wrapper .common-table td {
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid #CDD6DD;
    font-size: 1.6rem; }
    @media screen and (max-width: 768px) {
      .wrapper .common-table th, .wrapper .common-table td {
        padding: 12px;
        font-size: 1.4rem; } }
  .wrapper .common-table th {
    background-color: #F0F3F5;
    font-weight: bold;
    width: 25%;
    text-align: center;
    vertical-align: middle; }
    @media screen and (max-width: 768px) {
      .wrapper .common-table th {
        font-size: 1.2rem; } }
  .wrapper .common-table tr:nth-child(even) th {
    background-color: #f6f8f9; }

.wrapper .common-pagetop {
  padding: 0 0 64px 0; }
  @media screen and (max-width: 768px) {
    .wrapper .common-pagetop {
      padding: 16px 0 64px 0; } }
  .wrapper .common-pagetop a {
    display: block;
    color: #707F89;
    font-weight: 700;
    border-radius: 8px;
    padding: 16px 32px;
    font-size: 1.6rem;
    text-decoration: none;
    transition: background 0.2s;
    max-width: 400px;
    margin: 32px auto;
    text-align: center;
    border: solid 1px #CDD6DD; }
    @media screen and (max-width: 768px) {
      .wrapper .common-pagetop a {
        font-size: 1.4rem;
        width: fit-content;
        padding: 16px 64px;
        margin: 0 auto; } }
    .wrapper .common-pagetop a:hover {
      color: #5c00b8; }

#tbcms_footer-container-wrap {
  position: relative; }