/* フォント読み込み - DIN */
    @font-face {
      font-family: 'DIN Alternate';
      font-weight: 700;
      font-style: normal;
      src: url('../fonts/DIN Alternate Bold.otf') format('opentype'),
           url('../fonts/DIN Alternate Bold.ttf') format('truetype');
      font-display: swap;
    }

    @font-face {
      font-family: 'DIN Alternate';
      font-weight: bold;
      font-style: normal;
      src: url('../fonts/DIN Alternate Bold.otf') format('opentype'),
           url('../fonts/DIN Alternate Bold.ttf') format('truetype');
      font-display: swap;
    }

    @font-face {
      font-family: 'DIN Condensed';
      font-style: normal;
      src: url('../fonts/DIN_Condensed_VF.otf') format('opentype');
      font-display: swap;
    }

    @font-face {
      font-family: 'DIN Narrow';
      font-weight: 600;
      font-style: normal;
      src: url('../fonts/DIN-2014_Narrow-Demi.otf') format('opentype');
      font-display: swap;
    }

    @font-face {
      font-family: 'DIN';
      font-weight: 700;
      font-style: normal;
      src: url('../fonts/DIN Alternate Bold.otf') format('opentype'),
           url('../fonts/DIN Alternate Bold.ttf') format('truetype');
      font-display: swap;
    }

    @font-face {
      font-family: 'DIN';
      font-weight: bold;
      font-style: normal;
      src: url('../fonts/DIN Alternate Bold.otf') format('opentype'),
           url('../fonts/DIN Alternate Bold.ttf') format('truetype');
      font-display: swap;
    }

    /* フォント読み込み - Noto Sans (英数字) */
    @font-face {
      font-family: 'Noto Sans';
      font-weight: 400;
      font-style: normal;
      src: url('../fonts/NotoSans-Regular.woff2') format('woff2'),
           url('../fonts/NotoSans-Regular.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans';
      font-weight: 500;
      font-style: normal;
      src: url('../fonts/NotoSans-Medium.woff2') format('woff2'),
           url('../fonts/NotoSans-Medium.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans';
      font-weight: 600;
      font-style: normal;
      src: url('../fonts/NotoSans-SemiBold.woff2') format('woff2'),
           url('../fonts/NotoSans-SemiBold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans';
      font-weight: 700;
      font-style: normal;
      src: url('../fonts/NotoSans-Bold.woff2') format('woff2'),
           url('../fonts/NotoSans-Bold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans';
      font-weight: 800;
      font-style: normal;
      src: url('../fonts/NotoSans-ExtraBold.woff2') format('woff2'),
           url('../fonts/NotoSans-ExtraBold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans';
      font-weight: 900;
      font-style: normal;
      src: url('../fonts/NotoSans-Black.woff2') format('woff2'),
           url('../fonts/NotoSans-Black.woff') format('woff');
      font-display: swap;
    }

    /* フォント読み込み - Noto Sans JP (日本語) */
    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 400;
      font-style: normal;
      src: url('../fonts/NotoSansJP-Regular.woff2') format('woff2'),
           url('../fonts/NotoSansJP-Regular.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 500;
      font-style: normal;
      src: url('../fonts/NotoSansJP-Medium.woff2') format('woff2'),
           url('../fonts/NotoSansJP-Medium.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 600;
      font-style: normal;
      src: url('../fonts/NotoSansJP-SemiBold.woff2') format('woff2'),
           url('../fonts/NotoSansJP-SemiBold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 700;
      font-style: normal;
      src: url('../fonts/NotoSansJP-Bold.woff2') format('woff2'),
           url('../fonts/NotoSansJP-Bold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 800;
      font-style: normal;
      src: url('../fonts/NotoSansJP-ExtraBold.woff2') format('woff2'),
           url('../fonts/NotoSansJP-ExtraBold.woff') format('woff');
      font-display: swap;
    }

    @font-face {
      font-family: 'Noto Sans JP';
      font-weight: 900;
      font-style: normal;
      src: url('../fonts/NotoSansJP-Black.woff2') format('woff2'),
           url('../fonts/NotoSansJP-Black.woff') format('woff');
      font-display: swap;
    }

    /* リセット */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    /* ページローダー */
    .page-loader {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #ffffff;
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
      transition: opacity 0.5s ease;
    }

    .page-loader.fade-out {
      opacity: 0;
    }

    .loader-spinner {
      width: 3.125rem; /* 50px */
      height: 3.125rem; /* 50px */
      border: 0.25rem solid #f3f4f6; /* 4px */
      border-top: 0.25rem solid #008080; /* ティール */
      border-radius: 50%;
      animation: spin 1s linear infinite;
    }

    @keyframes spin {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }

    /* vw単位でのフォントサイズ設定（画面幅に完全比例） */
    html {
      /* モバイル基準（375px幅で16px） */
      font-size: 4.267vw; /* 16 / 375 × 100 = 4.267vw */
      scroll-behavior: smooth; /* スムーススクロール */
    }

    @media (min-width: 640px) {
      html {
        /* タブレット小（640px幅で16px） */
        font-size: 2.5vw; /* 16 / 640 × 100 = 2.5vw */
      }
    }

    @media (min-width: 768px) {
      html {
        /* PC表示（768px～1599px）：vwベースで比率を保って縮小 */
        /* 1600pxで19.2pxになるように設定 */
        font-size: 1.2vw; /* 19.2 / 1600 × 100 = 1.2vw */
      }
    }

    @media (min-width: 1600px) {
      html {
        /* デスクトップ（1600px以上）：19.2px固定 */
        /* この設定で1.625rem = 31.2px（ヒーローのフォントサイズ） */
        /* レイアウト幅も固定（725px、450px、320px） */
        font-size: 19.2px;
      }
    }

    body {
      font-family: "Noto Sans", "Noto Sans JP", -apple-system, BlinkMacSystemFont, sans-serif;
      color: #000000;
      background-color: #ffffff;
      line-height: 1;
      -webkit-font-smoothing: antialiased;
    }

    img {
      max-width: 100%;
      height: auto;
      display: block;
    }


    /* メインコンテンツラッパー - モバイル専用 */
    .main-content-wrapper {
      overflow: hidden;
      padding-top: 3.5rem; /* ヘッダーの高さ分のスペース確保 */
    }

    /* スクロールアニメーション */
    .fade-in {
      opacity: 0;
      transform: translateY(2rem);
      transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }

    .fade-in.visible {
      opacity: 1;
      transform: translateY(0);
    }

    .fade-in-card {
      opacity: 0;
      transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }

    /* 奇数番目のカード: 左から出る */
    .fade-in-card:nth-child(odd) {
      transform: translateX(-3rem);
    }

    /* 偶数番目のカード: 右から出る */
    .fade-in-card:nth-child(even) {
      transform: translateX(3rem);
    }

    .fade-in-card.visible {
      opacity: 1;
      transform: translateX(0);
    }

    /* カードの遅延アニメーション */
    .fade-in-card:nth-child(1) { transition-delay: 0.1s; }
    .fade-in-card:nth-child(2) { transition-delay: 0.2s; }
    .fade-in-card:nth-child(3) { transition-delay: 0.3s; }
    .fade-in-card:nth-child(4) { transition-delay: 0.4s; }
    .fade-in-card:nth-child(5) { transition-delay: 0.5s; }
    .fade-in-card:nth-child(6) { transition-delay: 0.6s; }

    /* ヘッダー */
    .header {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      background: #ffffff;
      border-bottom: 0.0625rem solid #e5e5e5; /* 1px */
      padding: 0.875rem 1rem; /* 14px 16px */
      display: flex;
      justify-content: space-between;
      align-items: center;
      z-index: 1000;
    }

    .header__logo {
      display: flex;
      align-items: center;
      gap: 0.5rem; /* 8px */
      font-size: 1.25rem; /* 20px */
      font-weight: 700;
      color: #333333;
    }

    .header__logo-icon {
      width: 12.375rem; /* 198px */
      height: auto;
      display: block;
    }

    .header__menu {
      width: 1.875rem; /* 30px */
      height: 1.875rem; /* 30px */
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 0.3125rem; /* 5px */
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
    }

    .header__menu-line {
      width: 100%;
      height: 0.1875rem; /* 3px */
      background: #333333;
      border-radius: 0.125rem; /* 2px */
      transition: all 0.3s ease;
    }

    /* モバイルメニュー */
    .mobile-menu {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      background: #ffffff;
      z-index: 2000;
      overflow-y: auto;
      opacity: 0;
      visibility: hidden;
      transform: scale(0.95);
      transition: opacity 0.4s ease, transform 0.4s ease, visibility 0.4s ease;
      padding: 0 1.375rem; /* 22px */
    }

    .mobile-menu.active {
      opacity: 1;
      visibility: visible;
      transform: scale(1);
    }

    .mobile-menu__overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      background: rgba(0, 0, 0, 0.5);
      z-index: 1500;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.4s ease, visibility 0.4s ease;
    }

    .mobile-menu__overlay.active {
      opacity: 1;
      visibility: visible;
    }

    .mobile-menu__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1rem 0;
    }

    .mobile-menu__logo {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      font-size: 1.125rem; /* 18px */
      font-weight: 700;
      color: #333333;
    }

    .mobile-menu__logo-icon {
      width: 12.375rem; /* 198px */
      height: auto;
      display: block;
    }

    .mobile-menu__close {
      width: 2rem; /* 32px */
      height: 2rem;
      display: flex;
      align-items: center;
      justify-content: center;
      background: none;
      border: none;
      font-size: 1.5rem; /* 24px */
      color: #333333;
      cursor: pointer;
      padding: 0;
    }

    .mobile-menu__list {
      list-style: none;
      padding: 0;
      margin: 2.5rem 0 0 0; /* 40px */
    }

    .mobile-menu__item {
      border-bottom: 0.0625rem solid #000000; /* 1px */
    }
    .mobile-menu__item:first-child {
      border-top: 0.0625rem solid #000000; /* 1px */
    }

    .mobile-menu__link {
      display: block;
      padding: 1.25rem 0 1.25rem 0.53125rem; /* 上 右 下 左8.5px */
      color: #333333;
      text-decoration: none;
      font-size: 1rem; /* 16px */
      font-weight: 500;
      transition: background 0.2s ease;
      position: relative;
    }

    .mobile-menu__link::after {
      content: "\f054";
      font-family: "Font Awesome 6 Free";
      font-weight: 900;
      position: absolute;
      right: 0.625rem; /* 10px */
      top: 50%;
      transform: translateY(-50%);
      font-size: 1rem; /* 16px */
    }

    .mobile-menu__link:hover {
      background: #f5f5f5;
    }

    .mobile-menu__cta {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      background: #06c755;
      color: #ffffff;
      text-decoration: none;
      padding: 1rem;
      margin: 1.5rem 0;
      border-radius: 0.5rem;
      font-size: 1.125rem; /* 18px */
      font-weight: 700;
      transition: background 0.3s ease;
    }

    .mobile-menu__cta:hover {
      background: #05b04c;
    }

    .mobile-menu__cta i {
      font-size: 1rem;
    }

    /* ヒーローセクション */

    .hero__main-image {
      width: 100%;
      display: block;
    }

    /* CTAカード（画像付き） */
    .cta-cards {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .cta-card {
      position: relative;
      height: 10rem; /* 160px */
      display: flex;
      align-items: center;
      overflow: hidden;
    }

    .cta-card--teal {
      height: 18.75rem; /* 300px */
    }

    .cta-card .hero__title {
      position: absolute;
      top: 2.5rem; /* 40px */
      left: 0;
      right: 0;
      font-size: 1.625rem; /* 26px */
      font-weight: 700; /* bold */
      line-height: 2.8125rem; /* 45px */
      color: #000000;
      padding: 0 1.25rem; /* 0 20px */
      z-index: 2;
    }

    .cta-card__bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 0;
    }

    .cta-card__overlay {
      position: absolute;
      left: 1.25rem; /* 20px */
      top: 50%;
      transform: translateY(-50%);
      padding: 1.25rem 0 1.25rem 0.625rem; /* 20px 24px 20px 10px */
      width: 13.75rem; /* 220px */
      height: 6.25rem; /* 100px */
      z-index: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .cta-card--teal .cta-card__overlay {
      background: rgba(0, 128, 128, 0.8); /* #008080 透過率80% */
      top: 10.625rem; /* 170px タイトル(40px) + タイトル高さ(約90px) + 間隔(40px) */
      transform: none;
    }

    .cta-card--navy .cta-card__overlay {
      background: rgba(0, 51, 102, 0.8); /* #003366 透過率80% */
    }

    .cta-card--gold .cta-card__overlay {
      background: rgba(245, 180, 20, 0.8); /* #F5B414 透過率80% */
    }

    .cta-card__text {
      font-size: 0.8125rem; /* 13px */
      font-weight: 700; /* bold */
      color: #ffffff;
      padding-bottom: 0.6875rem; /* 11px */
      line-height: 1.5;
    }

    .cta-card__action {
      font-size: 1.45rem; /* 22px */
      font-weight: 700; /* bold */
      color: #ffffff;
      line-height: 1.3;
    }

    /* 収入計算セクション - PDF完全準拠 */
    .income-section {
      background: #ffffff;
      padding: 5rem 1.25rem 2.5rem;
      text-align: center;
    }

    .income-boxes {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 1rem;
      margin-bottom: 1.5rem;
    }
    .income-boxes-title {
      font-size: 1.5rem;
      line-height: 2.125rem;
      margin-top: -.3125rem;
      font-weight: 900;
      margin-bottom: 2.5rem;
    }

    .income-box {
      width: 5rem;
      height: 5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #ffffff;
      font-size: 1.125rem;
      font-weight: 900;
      border-radius: 0;
    }

    .income-box--teal {
      background: #008080;
    }

    .income-box--navy {
      background: #1e3a5f;
    }

    .income-box--gold {
      background: #F5B414;
    }

    .income-plus {
      position: relative;
      width: 0.75rem;
      height: 0.9375rem;
      font-size: 0;
      color: transparent;
    }

    .income-plus::before,
    .income-plus::after {
      content: '';
      position: absolute;
      background: #000000;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    .income-plus::before {
      width: 0.1875rem;
      height: 0.9375rem;
    }

    .income-plus::after {
      width: 0.9375rem;
      height: 0.1875rem;
    }

    .income-total {
      display: flex;
      justify-content: center;
      align-items: flex-end;
      margin-bottom: 1.125rem;
    }

    .income-total__label {
      font-size: 1.25rem;
      font-weight: 700;
    }
    .income-total__label span {
      font-size: 1.725rem;
      font-weight: 800;
    }

    .income-total__amount {
      font-family: 'DIN Narrow', 'DIN', 'DIN Alternate', sans-serif;
      font-size: 2.7225rem;  /* 43.56px */
      font-weight: 800;
      color: #000000;
      line-height: .75;
      letter-spacing: 0.05em;
      text-align: left;
    }

    .income-total__amount-yen {
      font-size: 1.5425rem;
    }

    .income-note {
      font-size: 1.125rem;
      color: #000000;
      margin-bottom: 1.875rem;
      font-weight: 700;
    }

    .income-arrow-icon {
      display: block;
      width: 0;
      height: 0;
      border-left: 1.875rem solid transparent;
      border-right: 1.875rem solid transparent;
      border-top: 1.25rem solid #000000;
      margin: 0 auto 1.25rem;
    }
    .income-arrow-icon-text {
      font-size: .9375rem;
      font-weight: 700;      
      margin-bottom: .625rem;

    }

    .income-banner {
      background: #F5B414;
      color: #ffffff;
      padding:  0;
      margin: 0 0 0.625rem;
    }

    .income-banner__title {
      font-size: 1.25rem;
      font-weight: 700;
      text-align: center;
      line-height: 3.125rem;
    }

    .income-description {
      font-size: 1rem;
      color: #000000;
      line-height: 1.4375rem;
      padding: 0;
      margin-top: -0.21875rem;
    }

    /* 家賃・光熱費セクション */
    .cost-section {
      background: #ffffff;
      padding: 2.5rem 0.9375rem;
    }

    .cost-section__title {
      font-size: 1.5rem;
      font-weight: 800;
      text-align: center;
      margin-bottom: 1.25rem;
    }

    .cost-section__title-zero {
      font-size: 2.125rem; /* 34px */
      font-weight: 900; /* black */
    }

    .cost-section__header {
      background: #008080;
      color: #ffffff;
      text-align: center;
      font-size: 1.25rem;
      line-height: 2;
      font-weight: 700;
      margin-bottom: 0.625rem;
    }

    .cost-table {
      display: grid;
      gap: 0.625rem;
      margin-bottom: 1.1875rem;
    }

    .cost-row {
      display: flex;
      border: 0.125rem solid #333333;
      min-height: 3.125rem;
      padding: 0.9375rem 0;
    }


    .cost-row--total {
      background: #F5B414;
    }

    .cost-row--total .cost-amount-num {
      font-size: 1.275rem;
    }

    .cost-row--total .cost-amount-yen {
      font-size: 0.975rem;
    }

    .cost-label {
      width: 6.875rem;
      padding: 0 1rem;
      font-size: 1.25rem;
      font-weight: 700;
      text-align: justify;
      text-align-last: justify;
      border-right: 0.09375rem solid #333333;
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 1.5;
    }

    .cost-data {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 1.5rem;
    }

    .cost-item {
      display: flex;
    }

    .cost-period {
      width: 6.0625rem;
      font-size: 0.875rem;
      font-weight: 700;
      text-align: center;
      align-self: flex-end;
    }

    .cost-amount {
      font-weight: 600;
    }

    .cost-amount-num {
      font-size: 1.0625rem;
    }

    .cost-amount-yen {
      font-size: 0.8125rem;
    }

    .cost-note {
      font-size: 1.125rem;
      text-align: center;
      font-weight: 600;
    }

    .cost-note-highlight {
      color: #E4007F;
    }

    /* プライベート充実セクション */
    .private-section {
      background: #ffffff;
      padding: 2.5rem 0;
    }

    .private-section__title {
      font-size: 1.5rem;
      font-weight: 800;
      text-align: center;
      color: #333333;
      margin-bottom: 1.8125rem;
      padding: 0 20px;
    }

    .private-cards {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .private-card {
      position: relative;
      height: 17.5rem; /* 280px */
      overflow: hidden;
    }

    .private-card__image {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .private-card__label {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background: rgba(0, 0, 0, 0.7);
      color: #ffffff;
      padding: 0.625rem 0;
      text-align: center;
      font-size: 1.2rem;
      font-weight: 700;
    }

    /* 選ばれる理由セクション */
    .reason-section {
      padding: 2.5rem 0.78125rem 3.75rem;
    }

    .section-header {
      text-align: center;
      margin-bottom: 3.125rem;
    }

    .section-badge {
      display: inline-block;
      background: #008080;
      color: #ffffff;
      border-radius: 0.625rem;
      font-size: 1rem;
      line-height: 1.25rem;
      font-weight: 700;
      width: 6.25rem;
      letter-spacing: 0.1em;
      margin-bottom: 1.0625rem;
    }

    .section-subtitle {
      font-size: 1rem;
      margin-bottom: 0.625rem;
      font-weight: 500;
    }

    .section-title {
      font-size: 2.25rem;
      font-weight: 700;
    }

    .reason-cards {
      display: flex;
      flex-direction: column;
      gap: 2rem;
    }

    .reason-card {
      background: #ffffff;
      border-radius: 0.625rem;
      border: 0.1875rem solid #008080;
      padding: 1.875rem 1.125rem 1.375rem;
      position: relative;
    }

    .reason-card--navy {
      border-color: #1e3a5f;
    }

    .reason-card--gold {
      border-color: #d9a441;
    }

    .reason-card__number {
      position: absolute;
      top: -20px;
      left: 50%;
      transform: translateX(-50%);
      width: 2.75rem;  /* 44px */
      height: 2.75rem; /* 44px */
      border-radius: 50%;
      background: #008080;
      color: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'DIN Condensed', 'DIN', sans-serif;
      font-size: 1.25rem; /* 20px */
      font-weight: 700;
    }

    .reason-card--navy .reason-card__number {
      background: #1e3a5f;
    }

    .reason-card--gold .reason-card__number {
      background: #d9a441;
    }

    .reason-card__image {
      width: 100%;
      height: 5rem;
      object-fit: contain;
      margin: 0 0 1.375rem;
    }

    .reason-card__title {
      text-align: center;
      font-size: 1.25rem;
      font-weight: 700;
      color: #008080;
      margin-top: -0.15625rem;
      margin-bottom: 1rem;
      line-height: 1.5625rem;
      letter-spacing: -0.06em;
    }

    .reason-card--navy .reason-card__title {
      color: #1e3a5f;
    }

    .reason-card--gold .reason-card__title {
      color: #d9a441;
    }

    .reason-card__text {
      font-size: 0.875rem;
      line-height: 1.5rem;
      margin-top: -0.3125rem;
    }

    .reason-card__text--highlight {
      color: #008080;
    }

    /* LINE CTAセクション */
    .line-cta-section {
      background-image: url('../images/cta.jpg');
      background-position: center center;
      background-size: cover;
      background-repeat: no-repeat;
      padding: 1.5rem 0.9375rem;
      min-height: 15rem;
      margin-bottom: 1.5rem;
      position: relative;
    }

    .line-cta-container {
      width: 100%;
      padding-right: 0;
    }

    .line-cta-header {
      background: #06c755;
      color: #ffffff;
      width: 13.125rem;
      height: 1.5rem;
      border-radius: 0;
      font-size: 0.875rem;
      font-weight: 700;
      text-align: center;
      margin-bottom: 0.9375rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .line-cta-box__title {
      font-size: 1.5rem;
      font-weight: 800;
      color: #000000;
      margin-top: -0.3125rem;
      margin-bottom: 0.9375rem;
      line-height: 2.125rem;
    }

    .line-cta-box__list {
      list-style: none;
      display: grid;
      gap: 0.625rem;
      width: 13.75rem;
      margin-bottom: 0;
    }

    .line-cta-box__item {
      background: #ffffff;
      font-size: 0.84rem;
      color: #333333;
      padding-left: 0.375rem;
      border-radius: 0;
      box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.12);
      font-weight: 500;
      line-height: 1.375rem;
    }

    .line-cta-button {
      position: absolute;
      bottom: -1.5rem;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      align-items: center;
      justify-content: center;
      background: #06c755;
      color: #ffffff;
      text-decoration: none;
      width: 20.625rem; /* 330px */
      height: 3rem;
      border-radius: 0.3125rem; /* 5px */
      font-size: 1.1875rem; /* 19px */
      font-weight: 900; /* black */
      transition: all 0.3s ease;
      border: none;
      box-shadow: 0 0.25rem 0.75rem rgba(6, 199, 85, 0.35);
    }

    .line-cta-button:hover {
      background: #05b04c;
      box-shadow: 0 0.5rem 1.25rem rgba(6, 199, 85, 0.45);
      transform: translateX(-50%) translateY(-0.125rem);
    }

    .line-cta-button__arrow {
      position: absolute;
      right: 1.25rem; /* 20px */
      font-size: 1.1875rem; /* 19px */
    }

    /* 悩みチェックセクション */
    .case-section {
      padding: 3.75rem 0.9375rem;  /* 60px 15px */
    }

    .case-section__header {
      text-align: center;
      margin-bottom: 2.8125rem;
    }

    .case-section__badge {
      display: inline-block;
      background: #1e3a5f;
      color: #ffffff;
      border-radius: 0.625rem;  /* 10px */
      font-size: 1rem;  /* 16px */
      line-height: 1.25rem;  /* 20px */
      font-weight: 700;
      width: 6.25rem;  /* 100px */
      letter-spacing: 0.1em;
      margin-bottom: 1.0625rem;  /* 17px */
    }

    .case-section__subtitle {
      font-size: 1rem;  /* 16px */
      margin-bottom: 0.625rem;  /* 10px */
      font-weight: 500;
    }

    .case-section__title {
      font-size: 1.5rem;  /* 24px */
      font-weight: 700;
      margin-bottom: 0.75rem; /* 12px */
    }

    .case-section__title--highlight {
      background: #008080;
      color: #ffffff;
      font-size: 1.75rem;  /* 28px */
    }

    .case-section__description {
      font-size: 0.875rem; /* 14px */
      color: #e91e63;
      font-weight: 700;
      margin-bottom: 2rem; /* 32px */
    }

    .case-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 2.5rem;  /* 40px */
    }

    .case-card {
      background: #ffffff;
      padding: var(--spacing-6) var(--spacing-5);
    }

    .case-card__header {
      margin-bottom: var(--spacing-3);
      padding-bottom: 0.625rem;
    }

    .case-card__number {
      font-size: 0.75rem;  /* 12px */
      font-weight: 700;
      color: #008080;
      display: block;
    }

    .case-card__number-large {
      font-size: 1.5rem;  /* 24px */
    }

    .case-card--navy .case-card__number {
      color: #1e3a5f;
    }

    .case-card--gold .case-card__number {
      color: #d9a441;
    }

    .case-card__divider {
      border: 0;
      border-top: 0.0625rem solid #e0e0e0;
      margin: 0 0 1.25rem;
    }

    .case-card__content {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: var(--spacing-4);
      margin: 0 0 1.875rem 0;  /* 30px bottom */
    }

    .case-card__left {
      flex: 1;
      min-width: 0;
    }

    .case-card__category {
      font-size: 0.8125rem;  /* 13px */
      color: #008080;
      margin-bottom: 0.75rem;  /* 12px */
      font-weight: 700;
    }

    .case-card--navy .case-card__category {
      color: #1e3a5f;
    }

    .case-card--gold .case-card__category {
      color: #d9a441;
    }

    .case-card__problem {
      font-size: 1.1rem;  /* 17.6px */
      font-weight: 700;
      color: #000000;
      line-height: 1.625rem;  /* 26px */
      max-width: 15rem;  /* 240px */
    }

    .case-card__right {
      flex-shrink: 0;
      width: 4.6875rem;  /* 75px */
      display: flex;
      justify-content: flex-end;
      align-items: flex-end;
      align-self: flex-end;
    }

    .case-card__image {
      width: 4.6875rem;  /* 75px */
      height: 4.6875rem;  /* 75px */
      object-fit: contain;
    }

    .case-card__icon {
      width: 100%;
      height: auto;
      display: block;
    }

    .case-card__solution {
      text-align: center;
      background: #008080;
      color: #ffffff;
      font-size: 1rem;  /* 16px */
      line-height: 1.5rem;  /* 24px */
      font-weight: 600;  /* semibold */
      padding: 0.3125rem 0;  /* 上下5px追加 */
      max-width: 100%;
      margin-bottom: 0.9375rem;  /* 15px */
    }

    .case-card--navy .case-card__solution {
      background: #1e3a5f;
    }

    .case-card--gold .case-card__solution {
      background: #d9a441;
    }

    .case-card__description {
      font-size: 0.875rem;  /* 14px */
      color: #333333;
      line-height: 1.5rem;  /* 24px */
      margin: -0.3125rem 0 0 0;  /* -5px top */
    }

    /* サポート制度セクション - PDF完全準拠 vw+remベース */
    .support-section {
      padding: 3.75rem 0.9375rem 2.6875rem;
    }

    .support-section__header {
      text-align: center;
      margin-bottom: 3rem;
    }

    .support-section__badge {
      display: inline-block;
      background: #008080;
      color: #ffffff;
      border-radius: 0.625rem;  /* 10px */
      font-size: 1rem;  /* 16px */
      line-height: 1.25rem;  /* 20px */
      font-weight: 700;
      width: 6.25rem;  /* 100px */
      letter-spacing: 0.1em;
      margin-bottom: 1.0625rem;  /* 17px */
    }

    .support-section__subtitle {
      font-size: 1rem;  /* 16px */
      margin-bottom: 0.625rem;  /* 10px */
      font-weight: 500;
    }

    .support-section__title {
      font-size: 1.5625rem;  /* 25px */
      font-weight: 700;
      color: #000000;
      margin-bottom: 0.75rem;
    }

    .support-section__description {
      font-size: 1rem;
      color: #666666;
      line-height: 1.6;
    }

    .support-section__header-illustration {
      margin-top: 2.5rem;
      margin-bottom: 3.75rem;  /* 60px */
      text-align: center;
    }

    .support-section__header-illustration img {
      max-width: 100%;
      height: 7.5rem;  /* 120px */
      object-fit: contain;
      display: block;
      margin: 0 auto;
    }

    .support-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 3.4375rem;  /* 55px */
    }

    .support-card {
      background: #ffffff;
      border-top: 0.125rem solid #008080;  /* 2px */
      border-left: 0.125rem solid #008080;  /* 2px */
      border-right: 0.40625rem solid #008080;  /* 6.5px */
      border-bottom: 0.40625rem solid #008080;  /* 6.5px */
      border-radius: 1rem;
      padding: 1.15625rem 0 1.25rem;  /* 18.5px 0 20px */
      text-align: center;
      position: relative;
    }

    .support-card::before {
      content: " ";
      position: absolute;
      bottom: -0.40625rem;  /* 6.5px */
      left: -0.125rem;  /* 2px */
      width: 0;
      height: 0;
      border-width: 0 0.5rem 0.5rem 0;
      border-style: solid;
      border-color: transparent;
      border-bottom-color: #f7f7f7;
    }

    .support-card::after {
      content: " ";
      position: absolute;
      top: -0.125rem;  /* 2px */
      right: -0.40625rem;  /* 6.5px */
      width: 0;
      height: 0;
      border-width: 0 0.5rem 0.5rem 0;
      border-style: solid;
      border-color: #f7f7f7;
      border-bottom-color: transparent;
    }

    .support-card--navy {
      border-top-color: #1e3a5f;
      border-left-color: #1e3a5f;
      border-right-color: #1e3a5f;
      border-bottom-color: #1e3a5f;
    }

    .support-card--gold {
      border-top-color: #d9a441;
      border-left-color: #d9a441;
      border-right-color: #d9a441;
      border-bottom-color: #d9a441;
    }

    .support-card__number {
      position: absolute;
      top: -1.375rem;  /* -22px */
      left: 50%;
      transform: translateX(-50%);
      width: 2.75rem;  /* 44px */
      height: 2.75rem;  /* 44px */
      border-radius: 50%;
      background: #008080;
      color: #ffffff;
      font-family: 'DIN Condensed', 'DIN', 'DIN Alternate', sans-serif;
      font-size: 1.625rem;  /* 26px */
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    }

    .support-card--navy .support-card__number {
      background: #1e3a5f;
    }

    .support-card--gold .support-card__number {
      background: #d9a441;
    }

    .support-card__illustration {
      margin-bottom: 2rem;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem 0;
    }

    .support-card__illustration img {
      max-width: 100%;
      height: 5.3125rem;  /* 85px */
      object-fit: contain;
      display: block;
    }

    .support-card__title {
      font-size: 1.125rem;  /* 18px */
      font-weight: bold;
      color: #008080;
      line-height: 1.5625rem;  /* 25px */
    }

    .support-card--navy .support-card__title {
      color: #1e3a5f;
    }

    .support-card--gold .support-card__title {
      color: #d9a441;
    }

    /* 募集要項セクション - PDF完全準拠 */
    .job-section {
      padding: 2rem 0.9375rem;
    }

    .job-section__header {
      text-align: center;
      margin-bottom: 2.5rem;
    }

    .job-section__badge {
      display: inline-block;
      background: #008080;
      color: #ffffff;
      border-radius: 0.625rem;  /* 10px */
      font-size: 1rem;  /* 16px */
      line-height: 1.25rem;  /* 20px */
      font-weight: 700;
      min-width: 6.25rem;  /* 100px */
      letter-spacing: 0.1em;
      margin-bottom: 1.0625rem;  /* 17px */
      padding-left: 1rem;
      padding-right: 1rem;
    }

    .job-section__subtitle {
      font-size: 1rem;  /* 16px */
      margin-bottom: 0.625rem;  /* 10px */
      font-weight: 500;
    }

    .job-section__title {
      font-size: 1.875rem;  /* 30px */
      font-weight: 700;
      color: #000000;
    }

    .job-cards {
      display: flex;
      flex-direction: column;
      gap: 3rem;
    }

    .job-card {
      background: #ffffff;
    }

    .job-card__header {
      font-size: 1.25rem;  /* 20px */
      font-weight: bold;
      text-align: center;
      margin-bottom: 1.0625rem;  /* 17px */
      padding-bottom: 0.78125rem;  /* 12.5px */
      border-bottom: 0.125rem solid #000000; /* 2px */
    }

    .job-card--teal .job-card__header {
      color: #008080;
    }

    .job-card--navy .job-card__header {
      color: #1e3a5f;
    }

    .job-card--gold .job-card__header {
      color: #d9a441;
    }

    .job-card__row {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin-bottom: 1.5rem;
      padding-bottom: 0.78125rem;  /* 12.5px */
      border-bottom: 0.125rem solid #000000; /* 2px */
    }

    .job-card__row:last-of-type {
      margin-bottom: 2rem;
    }

    .job-card__label {
      background: #008080;
      color: #ffffff;
      width: 2.1875rem;  /* 35px */
      height: 2.1875rem;  /* 35px */
      border-radius: 0.19875rem;  /* 3.18px */
      font-size: 0.75rem;  /* 12px */
      font-weight: 900;  /* black */
      white-space: nowrap;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .job-card--navy .job-card__label {
      background: #1e3a5f;
    }

    .job-card--gold .job-card__label {
      background: #d9a441;
    }

    .job-card__value {
      flex: 1;
      font-size: 0.875rem;  /* 14px */
      font-weight: 700;
      color: #000000;
    }

    .job-card__value--large {
      font-size: 2.25rem;
      line-height: 1.2;
    }

    .job-card__value-yen {
      font-size: 1.9025rem;  /* 30.44px */
      font-weight: 900;  /* black */
    }

    .job-card__value-amount {
      font-family: 'DIN Narrow', 'DIN', 'DIN Alternate', sans-serif;
      font-size: 2.8125rem;  /* 45px */
      font-weight: bold;
    }

    .job-card__value-unit {
      font-size: 1.125rem;  /* 18px */
      font-weight: 600;  /* semibold */
    }

    .job-card__meta-row {
      display: flex;
      margin-bottom: 2rem;
      padding-bottom: 1.5rem;
      border-bottom: 0.125rem solid #000000; /* 2px */
    }

    .job-card__meta-item {
      flex: 1;
      display: flex;
      align-items: center;
      gap: 0.75rem;
    }

    .job-card__meta-label {
      background: #008080;
      color: #ffffff;
      width: 2.1875rem;  /* 35px */
      height: 2.1875rem;  /* 35px */
      border-radius: 0.19875rem;  /* 3.18px */
      font-size: 0.75rem;  /* 12px */
      font-weight: 900;  /* black */
      white-space: nowrap;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .job-card--navy .job-card__meta-label {
      background: #1e3a5f;
    }

    .job-card--gold .job-card__meta-label {
      background: #d9a441;
    }

    .job-card__meta-value {
      font-size: 1rem;
      font-weight: 700;
      color: #000000;
    }

    .job-card__tags {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5625rem;  /* 9px */
    }

    .job-card__tag {
      background: #ffffff;
      color: #000000;
      font-size: 0.75rem;  /* 12px */
      font-weight: 600;  /* semibold */
      height: 1.5625rem;  /* 25px */
      padding: 0;
      border: 0.125rem solid #000000; /* 2px */
      border-radius: 0;  /* 角丸なし */
      white-space: nowrap;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
    }

    /* 1段目 */
    .job-card__tag:nth-child(6n+1) {
      width: 7.5625rem;  /* 121px */
    }

    .job-card__tag:nth-child(6n+2) {
      width: 5.6875rem;  /* 91px */
    }

    .job-card__tag:nth-child(6n+3) {
      width: 6.9375rem;  /* 111px */
    }

    /* 2段目 */
    .job-card__tag:nth-child(6n+4) {
      width: 4.4375rem;  /* 71px */
    }

    .job-card__tag:nth-child(6n+5) {
      width: 8.1875rem;  /* 131px */
    }

    .job-card__tag:nth-child(6n+6) {
      width: 7.5625rem;  /* 121px */
    }

    /* フッターメニュー */
    .footer-menu {
      background: #ffffff;
      border-top: 0.0625rem solid #e5e5e5; /* 1px */
    }

    .footer-menu__list {
      list-style: none;
    }

    .footer-menu__item {
      border-bottom: 0.0625rem solid #e5e5e5; /* 1px */
    }

    .footer-menu__link {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1.25rem; /* 20px */
      text-decoration: none;
      color: #333333;
      font-size: 1rem; /* 16px */
      font-weight: 500;
      transition: background 0.3s ease;
    }

    .footer-menu__link:hover {
      background: #f8f8f8;
    }

    .footer-menu__link i {
      color: #999999;
    }

    /* フッターCTA */
    .footer-cta {
      position: relative;
      background: #ffffff;
      padding: 1.25rem; /* 20px */
      border-top: 0.0625rem solid #e5e5e5; /* 1px */
    }

    /* コピーライト */
    .copyright {
      background: #EFEFEF;
      color: #000000;
      text-align: center;
      height: 7.25rem; /* 116px */
      display: flex;
      align-items: end;
      justify-content: center;
      font-size: 0.75rem; /* 12px */
      font-weight: 400; /* regular */
      margin-top: -1.5rem;
      padding-bottom: 1.375rem;
    }

    /* 固定LINE相談ボタン */
    .fixed-line-button {
      position: fixed;
      bottom: 1.25rem; /* 20px */
      left: 50%;
      transform: translateX(-50%);
      width: 20.625rem; /* 330px */
      background: #06c755;
      color: #ffffff;
      text-decoration: none;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 3rem; /* 48px */
      font-size: 1.1875rem; /* 19px */
      font-weight: 900; /* black */
      z-index: 1000;
      border-radius: 0.3125rem; /* 5px */
      box-shadow: 0 0.25rem 0.75rem rgba(6, 199, 85, 0.35);
      transition: all 0.3s ease;
    }

    .fixed-line-button:hover {
      background: #05b04c;
      box-shadow: 0 0.5rem 1.25rem rgba(6, 199, 85, 0.45);
      transform: translateX(-50%) translateY(-0.125rem);
    }

    .fixed-line-button__arrow {
      position: absolute;
      right: 1.25rem; /* 20px */
      font-size: 1.1875rem; /* 19px */
    }

    /* ======================================
       PC表示（768px以上）
    ====================================== */

    /* サイドナビゲーション: デフォルトは非表示 */
    .side-nav {
      display: none;
    }

    /* 左側サイドバーと右側ナビ: スマホでは非表示 */
    .left-sidebar,
    .right-nav-area {
      display: none;
    }

    @media (min-width: 48rem) { /* 768px */
      /* メインコンテナ: 1525px幅で中央配置、3カラムレイアウト */
      .main-container {
        max-width: 79.42708rem; /* 1525px ÷ 19.2 (725+15+450+15+320) */
        margin: 0 auto;
        display: flex;
        gap: 0.78125rem; /* 15px ÷ 19.2 (1600px幅基準) */
        position: relative;
        padding-top: 0.78125rem; /* 15px ÷ 19.2 */
      }

      /* 左側サイドバー */
      .left-sidebar {
        display: flex;
        flex-direction: column;
        width: 37.76042rem; /* 725px ÷ 19.2 (1600px幅基準) */
        flex-shrink: 0;
        background: #ffffff;
        padding-top: 2.34375rem; /* 45px ÷ 19.2 (main-containerの15px + 追加30px) */
        padding-left: 2.34375rem; /* 45px ÷ 19.2 */
        padding-right: 2.34375rem; /* 45px ÷ 19.2 */
        padding-bottom: 1.5625rem; /* 30px ÷ 19.2 */
        position: sticky;
        top: 0.78125rem; /* 15px ÷ 19.2 - 上部余白を常に残す */
        align-self: flex-start;
        max-height: calc(100vh - 0.78125rem); /* 15px分引く */
        overflow-y: auto;
      }

      .left-sidebar__logo {
        margin-bottom: 2.08333rem; /* 40px ÷ 19.2 */
      }

      .left-sidebar__logo img {
        height: 2.60417rem; /* 50px ÷ 19.2 */
        width: auto;
      }

      .left-sidebar__content {
        margin-bottom: 1.30208rem; /* 25px ÷ 19.2 */
      }

      .left-sidebar__title {
        font-size: 1.5625rem; /* 30px ÷ 19.2 */
        font-weight: 700; /* bold */
        color: #000000;
        line-height: 3.125rem; /* 60px ÷ 19.2 */
        margin-top: -0.78125rem; /* -15px ÷ 19.2 */
        letter-spacing: 0.05em;
        margin-bottom: 0;
      }

      .left-sidebar__image {
        margin-bottom: 1.04167rem; /* 20px ÷ 19.2 */
        border-radius: 1.44792rem; /* 27.8px ÷ 19.2 */
        overflow: hidden;
      }

      .left-sidebar__image img {
        width: 100%;
        height: 18.75rem; /* 360px ÷ 19.2 */
        object-fit: cover;
        display: block;
      }

      .left-sidebar__cta {
        display: flex;
        flex-direction: column;
        background: #06C755;
        color: #ffffff;
        text-decoration: none;
        padding: 1.5rem; /* 24px */
        border-radius: 0.52083rem; /* 10px ÷ 19.2 */
        text-align: center;
        position: relative;
        transition: all 0.3s ease;
        box-shadow: 0 0.25rem 0.75rem rgba(6, 199, 85, 0.35);
      }

      .left-sidebar__cta:hover {
        background: #05b04c;
        box-shadow: 0 0.5rem 1.25rem rgba(6, 199, 85, 0.45);
        transform: translateY(-0.125rem); /* -2px */
      }

      .left-sidebar__cta-label {
        font-size: 0.83333rem; /* 16px ÷ 19.2 */
        font-weight: 700; /* bold */
        margin-bottom: 0.98958rem; /* 19px ÷ 19.2 */
      }

      .left-sidebar__cta-button {
        font-size: 1.875rem; /* 36px ÷ 19.2 */
        font-weight: 700; /* bold */
        margin-bottom: 1.14583rem; /* 22px ÷ 19.2 */
      }

      .left-sidebar__cta-info {
        font-size: 0.83333rem; /* 16px ÷ 19.2 */
        font-weight: 500; /* medium */
      }

      .left-sidebar__cta i {
        position: absolute;
        right: 1.5rem; /* 24px */
        top: 50%;
        transform: translateY(-50%);
        font-size: 1.5rem; /* 24px */
      }

      /* 中央コンテンツラッパー（スマホ表示領域）: 450px固定 */
      .main-content-wrapper {
        width: 23.4375rem; /* 450px ÷ 19.2 (1600px幅基準) */
        flex-shrink: 0;
        background: #ffffff;
        display: flex;
        flex-direction: column;
        overflow: hidden; /* 上部15pxからコンテンツがはみ出さないように */
        padding-top: 0; /* モバイルのpadding-topをリセット */
      }

      /* メインコンテンツエリア */
      .main-content-wrapper > main {
        flex: 1;
        overflow-x: hidden; /* 左右からのアニメーションがはみ出ないように */
      }

      /* コピーライト */
      .main-content-wrapper .copyright {
        width: 100%;
      }

      /* 固定LINE相談ボタン: PC表示では非表示 */
      .main-content-wrapper .fixed-line-button {
        display: none;
      }

      /* 右側ナビゲーションカードエリア */
      .right-nav-area {
        display: block;
        width: 16.66667rem; /* 320px ÷ 19.2 (1600px幅基準) */
        flex-shrink: 0;
        position: sticky;
        top: 0.78125rem; /* 15px ÷ 19.2 - 上部余白を常に残す */
        align-self: flex-start;
        max-height: calc(100vh - 0.78125rem); /* 15px分引く */
        overflow-y: auto;
      }

      /* 右側ナビゲーションカード群 */
      .right-nav-cards {
        display: flex;
        flex-direction: column;
        gap: 1.04167rem; /* 20px ÷ 19.2 */
      }

      /* 各カード: 152px高さ、ボーダーあり */
      .right-nav-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: 7.91667rem; /* 152px ÷ 19.2 */
        background: #ffffff;
        border: 0.104167rem solid #231815; /* 2px ÷ 19.2 */
        border-radius: 0.52083rem; /* 10px ÷ 19.2 */
        padding-top: 1.04167rem; /* 20px ÷ 19.2 */
        text-decoration: none;
        transition: all 0.3s ease;
      }

      .right-nav-card:hover {
        transform: translateY(-0.104167rem); /* -2px ÷ 19.2 */
      }

      /* カード1 (POINT) のホバー/アクティブ */
      .right-nav-card:nth-child(1):hover {
        transform: none; /* 一番上のカードは上に移動させない */
        border-color: #008080;
        box-shadow: 0 0.20833rem 0.52083rem rgba(0, 128, 128, 0.2);
      }

      .right-nav-card:nth-child(1).active {
        border-color: #008080;
        background: rgba(0, 128, 128, 0.05);
      }

      /* カード2 (REASON) のホバー/アクティブ */
      .right-nav-card:nth-child(2):hover {
        border-color: #003366;
        box-shadow: 0 0.20833rem 0.52083rem rgba(0, 51, 102, 0.2);
      }

      .right-nav-card:nth-child(2).active {
        border-color: #003366;
        background: rgba(0, 51, 102, 0.05);
      }

      /* カード3 (CASE) のホバー/アクティブ */
      .right-nav-card:nth-child(3):hover {
        border-color: #F5B414;
        box-shadow: 0 0.20833rem 0.52083rem rgba(245, 180, 20, 0.2);
      }

      .right-nav-card:nth-child(3).active {
        border-color: #F5B414;
        background: rgba(245, 180, 20, 0.05);
      }

      /* カード4 (SUPPORT) のホバー/アクティブ */
      .right-nav-card:nth-child(4):hover {
        border-color: #008080;
        box-shadow: 0 0.20833rem 0.52083rem rgba(0, 128, 128, 0.2);
      }

      .right-nav-card:nth-child(4).active {
        border-color: #008080;
        background: rgba(0, 128, 128, 0.05);
      }

      /* カード5 (PICK UP JOB) のホバー/アクティブ */
      .right-nav-card:nth-child(5):hover {
        border-color: #003366;
        box-shadow: 0 0.20833rem 0.52083rem rgba(0, 51, 102, 0.2);
      }

      .right-nav-card:nth-child(5).active {
        border-color: #003366;
        background: rgba(0, 51, 102, 0.05);
      }

      /* バッジ（POINT、REASON等） */
      .right-nav-card__badge {
        display: inline-block;
        color: #ffffff;
        font-size: 0.83333rem; /* 16px ÷ 19.2 */
        font-weight: 500; /* medium */
        height: 1.04167rem; /* 20px ÷ 19.2 */
        line-height: 1.04167rem; /* heightと同じ値で垂直中央揃え */
        padding: 0 1.04167rem; /* 左右20px ÷ 19.2 */
        border-radius: 0.83333rem; /* 16px ÷ 19.2 */
        letter-spacing: 0.05em;
        margin-bottom: 1.04167rem; /* 20px ÷ 19.2 */
      }

      /* 各バッジの色 */
      .right-nav-card:nth-child(1) .right-nav-card__badge {
        background: #008080; /* POINT */
      }

      .right-nav-card:nth-child(2) .right-nav-card__badge {
        background: #003366; /* REASON */
      }

      .right-nav-card:nth-child(3) .right-nav-card__badge {
        background: #F5B414; /* CASE */
      }

      .right-nav-card:nth-child(4) .right-nav-card__badge {
        background: #008080; /* SUPPORT */
      }

      .right-nav-card:nth-child(5) .right-nav-card__badge {
        background: #003366; /* PICK UP JOB */
      }

      /* カードタイトル */
      .right-nav-card__title {
        font-size: 1.30208rem; /* 25px ÷ 19.2 */
        font-weight: 700; /* bold */
        color: #000000;
        text-align: center;
        line-height: 1;
        margin: 0 0 1.5625rem 0; /* 下30px ÷ 19.2 */
      }

      /* 詳しく見るリンク */
      .right-nav-card__link-text {
        font-size: 0.72917rem; /* 14px ÷ 19.2 */
        font-weight: 700; /* bold */
        color: #000000;
        margin-bottom: 0.52083rem; /* 10px ÷ 19.2 */
      }

      /* chevron-downアイコン */
      .right-nav-card__icon {
        font-size: 0.36458rem; /* 7px ÷ 19.2 */
        color: #000000;
      }

      /* サイドナビゲーション: PC表示では非表示 */
      .side-nav {
        display: none;
      }

      /* ハンバーガーメニュー: PC表示では非表示 */
      .header__menu {
        display: none;
      }

      /* ヘッダー: 中央450px領域の上部に固定 */
      .main-content-wrapper .header {
        position: sticky;
        top: 0.78125rem; /* 15px ÷ 19.2 - 上部余白を常に残す */
        z-index: 1000;
        background: #ffffff;
        width: 100%;
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
      }

    }