/* ==========================================================================
   CSS Variables (:root)
   ========================================================================== */
:root {
   /* Colors */
   --color-primary: #158EDB;
   /* Main Blue */
   --color-primary-dark: #158AD7;
   /* Darker Blue */
   --color-accent: #F6FF15;
   /* Accent Yellow */
   --color-accent-gold: #C9BA00;
   /* Goldish Yellow */
   --color-text-main: #292929;
   /* Main Black */
   --color-text-purple: #5F53A8;
   /* Sub Purple */
   --color-text-lightblue: #D8F0FF;
   --color-bg-light: #F7F7F7;
   --color-border: #C3C3C3;
   --color-red: #B70000;
   --color-white: #FFFFFF;
   --color-black: #000000;

   /* Line-height */
   --lh-default: 1.66;
   --lh-special: 1.8;

   /* Constraints */
   --content-width-dt: 1520px;
   --content-width-sp: 380px;
   /* ==========================================================================
Layout (.l-) - Fluid Design Version
========================================================================== */
   /* 左右余白のフルイド計算 (25px @430px 〜 200px @1920px) */
   --gutter-fluid: clamp(25px, calc(-1.59rem + 11.74vw), 200px);

   /* セクション上下余白のフルイド計算 (60px @430px 〜 100px @1920px) */
   --section-py-fluid: clamp(60px, calc(3.03rem + 2.68vw), 100px);

   /* Typography Fluid Scales (430px - 1920px) */
   --fs-18-24: clamp(18px, calc(1.02rem + 0.40vw), 24px);
   --fs-18-20: clamp(18px, calc(1.09rem + 0.13vw), 20px);
   /* 本文用 (18px-20px) */
   --fs-20-30: clamp(20px, calc(1.07rem + 0.67vw), 30px);
}


/* ==========================================================================
   Reset CSS (Modern Reset)
   ========================================================================== */
*,
*::before,
*::after {
   box-sizing: border-box;
}

* {
   margin: 0;
   padding: 0;
}

html {
   scroll-behavior: smooth;
}

body {
   font-family: "Hiragino Sans", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", sans-serif;
   color: var(--color-text-main);
   background-color: var(--color-white);
   line-height: var(--lh-default);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
   display: block;
   max-width: 100%;
   height: auto;
}

button,
input,
textarea,
select {
   font: inherit;
}

a {
   text-decoration: none;
   color: inherit;
   transition: opacity 0.3s ease;
}

a:hover {
   opacity: 0.7;
}

ul,
ol {
   list-style: none;
}

/* ==========================================================================
   Typography (clamp設計)
   ========================================================================== */
h1,
.h1 {
   font-size: clamp(40px, 1.6rem + 3.35vw, 90px);
   font-weight: bold;
   line-height: 1.3;
   letter-spacing: 0.05em;
}

h2,
.h2 {
   font-size: 30px;
   font-weight: bold;
}

p {
   font-size: var(--fs-18-20);
}

/* H2直下のp要素の行間を出し分け */
h2+p {
   line-height: var(--lh-special);
}

@media (max-width: 768px) {
   h2+p {
      line-height: var(--lh-default);
   }
}

/* 英語のデザイン見出し（Componentとして定義） */
.c-en-label {
   display: block;
   font-family: "din-condensed", sans-serif;
   font-weight: 400;
   line-height: 0.8;
   color: #D8F0FF;
   pointer-events: none;
}

/* ==========================================================================
   Common Button (.c-btn)
   ========================================================================== */
.c-btn {
   position: relative;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background-color: transparent;
   overflow: hidden;
   transition: color 0.4s ease, border-color 0.4s ease;
   z-index: 1;
   cursor: pointer;
}

/* 背景が流れるアニメーションの土台 */
.c-btn::before {
   content: "";
   position: absolute;
   top: 0;
   left: -101%;
   width: 100%;
   height: 100%;
   background-color: var(--color-primary);
   transition: left 0.4s cubic-bezier(0.25, 1, 0.5, 1);
   z-index: -1;
}

/* ここ */
.p-contact-banner__btns.c-btn::before {
   content: "";
   position: absolute;
   top: 0;
   left: -101%;
   width: 100%;
   height: 100%;
   background-color: var(--color-primary-dark);
   transition: left 0.4s cubic-bezier(0.25, 1, 0.5, 1);
   z-index: -1;
}

.c-btn:hover::before {
   left: 0;
}


.c-btn--yellow::after {
   content: "↗";
   transition: transform 0.3s ease, filter 0.3s ease;
   transform: translate(5px, 1px);
}




/* --------------------------------------------------------------------------
   Modifiers (種類別のスタイル)
   -------------------------------------------------------------------------- */
/* 黄色ボタン（ヘッダー・角丸） */
.c-btn--yellow {
   color: var(--color-text-main);
   background-color: var(--color-accent);
   border-radius: 100px;
   min-width: 180px;
   padding: 0.8em 2em;
   transition: opacity 0.3s ease;
}

.c-btn--yellow .c-btn__arrow {
   margin-left: 16px;
}

/* 黄色ボタンは背景が流れるアニメーションを無効化 */
.c-btn--yellow::before {
   display: none;
}

.c-btn--yellow:hover {
   opacity: 0.8;
}

/* MOREリンク（下線・矢印のみ） */
.c-btn--more {
   min-width: auto;
   padding: 0 0 5px 0;
   color: var(--color-text-main);
   border-bottom: 2px solid var(--color-primary);
}

.c-btn--more::before {
   display: none;
}

.c-btn--more:hover {
   opacity: 0.7;
}

.c-btn--more:hover .c-btn__arrow {
   transform: translate(3px, -3px);
}




/* コンテンツ幅を制限し、中央寄せにする器 */
.l-inner {
   width: 100%;
   padding-right: var(--gutter-fluid);
   padding-left: var(--gutter-fluid);
   /* max-widthは設定せず、左右のpaddingで1520px(等倍時)の状態を作る */
}

/* 各セクションの共通余白 */
.l-section {
   padding-top: var(--section-py-fluid);
   padding-bottom: var(--section-py-fluid);
}

/* メインコンテンツエリア */
.l-main {
   overflow: hidden;
   /* ブロークングリッドのはみ出しを管理 */
}

/* ヘッダーの基本姿勢 */
.header {
   position: absolute;
   /* 初期はファーストビューの上に重ねる */
   top: 0;
   left: 0;
   width: 100%;
   /* padding: 20px 0; */
   z-index: 100;
   transition: background-color 0.3s ease;
}

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

   /* 上: 15px @430px 〜 60px @1920px */
   padding-top: clamp(15px, calc(0.12rem + 0.1vw), 60px);
   /* 右: 30px @430px 〜 50px @1920px */
   padding-right: clamp(30px, calc(1.51rem + 1.34vw), 50px);
   /* 下: 15px @430px 〜 0px @1920px */
   padding-bottom: 0;
   /* 左: 30px @430px 〜 200px @1920px */
   padding-left: clamp(30px, calc(-1.19rem + 11.41vw), 200px);
}


/* JSで付与される固定・スライドイン状態 */
.header.is-fixed {
   position: fixed;
   top: 0;
   background-color: #F2F9FF;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   padding: 10px 0;
   transform: translateY(-100%);
   /* 一旦上に隠す */
   transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.header.is-fixed .header__item a {
   color: var(--color-text-main);
}

.header.is-active {
   transform: translateY(0);
   /* するっと現れる */
}

/* メインコンテンツエリア */
.l-main {
   overflow: hidden;
   /* ブロークングリッドのはみ出し画像をカット */
}

/* 各セクションの共通余白 */
.l-section {
   padding: 100px 0;
}

@media (max-width: 768px) {
   .l-section {
      padding: 60px 0;
   }
}


/* ToTopボタンの配置（右下固定） */
.c-totop {
   position: fixed;
   right: 30px;
   bottom: 30px;
   z-index: 90;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.4s, visibility 0.4s;
   width: 48px;
   height: 48px;
   background-color: #fff;
   border-radius: 50%;
   border: 1px solid var(--color-primary);
   display: flex;
   align-items: center;
   justify-content: center;
}

.c-totop.is-visible {
   opacity: 1;
   visibility: visible;
}

/* ==========================================================================
   Utility
   ========================================================================== */
.u-desktop-only {
   display: none;
}

@media (min-width: 1550px) {
   .u-desktop-only {
      display: block;
   }
}

@media (min-width: 1550px) {
   .u-mobile-only {
      display: none;
   }
}

/* ==========================================================================
   Header & SP Menu
   ========================================================================== */
/* Header Actions */

.header__actions a {
   text-align: center;
   max-width: 260px;
   padding: 12px 70px;
}

.header__nav {
   margin-left: auto;
   margin-right: 40px;
   padding: 1rem 0 0 0;
}

.header__list {
   display: flex;
   justify-content: space-between;
}

.header__item {
   margin-right: 60px;
   color: var(--color-white);
}

.header__item a {
   font-size: 32px;
}

.header__item span {
   color: #D8FDFF;
}

.header__link {
   display: flex;
   flex-direction: column;
   align-items: center;
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   line-height: 1;
}

.header__link span {
   font-family: var(--font-ja);
   /* Hiragino */
   font-size: 10px;
   margin-top: 4px;
   font-weight: normal;
}

/* --------------------------------------------------------------------------
   Hamburger Button
   -------------------------------------------------------------------------- */
.header__hamburger {
   position: relative;
   width: 33px;
   height: 22px;
   background: none;
   border: none;
   cursor: pointer;
   z-index: 100;
}


.header__hamburger span {
   display: block;
   position: absolute;
   left: 0;
   width: 100%;
   height: 2px;
   background-color: var(--color-primary);
   transition: transform 0.4s ease, top 0.4s ease, background-color 0.4s ease;
}

/* 1本目 */
.header__hamburger span:nth-of-type(1) {
   top: 4px;
}

/* 2本目 */
.header__hamburger span:nth-of-type(2) {
   bottom: 4px;
}

/* --------------------------------------------------------------------------
   Active State (開いた時)
   -------------------------------------------------------------------------- */
.header__hamburger.is-active span {
   background-color: var(--color-white);
   /* メニューが開いたら白へ */
}

.header__hamburger.is-active span:nth-of-type(1) {
   top: 10px;
   transform: rotate(45deg);
}

.header__hamburger.is-active span:nth-of-type(2) {
   top: 10px;
   transform: rotate(-45deg);
}


/* メニュー展開時のロゴを白抜きに */
.header:has(.js-hamburger.is-active) .header__logo img {
   filter: brightness(0) invert(1);
}

/* SPメニューのグラデーション背景 */
.p-sp-menu {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 75vh;
   background: linear-gradient(135deg, #158EDB 0%, #6051A6 100%);
   z-index: 90;
   opacity: 0;
   visibility: hidden;
   transition: all 0.4s ease;
   pointer-events: none;
}

.p-sp-menu.is-active {
   opacity: 1;
   visibility: visible;
   pointer-events: auto;
}

.p-sp-menu__inner {
   width: 100%;
   height: 100%;
   padding: 100px var(--gutter-fluid) 60px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: space-between;
}

.p-sp-menu__nav {
   width: 100%;
}

.p-sp-menu__list {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 24px;
}

.p-sp-menu__item a {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   color: var(--color-white);
   font-family: "din-condensed", sans-serif;
   font-size: 40px;
   line-height: 1.1;
   text-transform: uppercase;
}

.p-sp-menu__item a span {
   font-family: "Hiragino Sans", sans-serif;
   font-size: 14px;
   margin-top: 4px;
   font-weight: normal;
}

.p-sp-menu__btn {
   width: 100%;
   text-align: left;
   margin-top: 40px;
   margin-left: 40px;
}


.p-sp-menu__btn .c-btn {
   width: 100%;
   max-width: 300px;
}


/* ==========================================================================
   First View (.p-fv)
   ========================================================================== */
.p-fv {
   position: relative;
   height: 100vh;
   min-height: 600px;
   display: flex;
   /* align-items: center; をやめ、上から配置する */
   align-items: flex-start;
   /* ヘッダーの高さ（パディング込）を計算して余白を作る */
   padding-top: clamp(100px, calc(6rem + 5vw), 180px);
}


.p-fv__bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), center/cover no-repeat;
}


.p-fv__bg img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.p-fv__badge {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: #fff;
   padding: 20px 40px;
   border-radius: 100px;
   font-size: var(--fs-20-30);
   font-weight: bold;
   margin-bottom: 30px;
}

.p-fv__content {
   color: var(--color-white);
}

.p-fv__title {
   font-size: clamp(40px, 2rem + 4vw, 90px);
   line-height: 1.2;
   margin-bottom: 30px;
   font-feature-settings: "palt";
}

.yellow {
   color: var(--color-accent);
}

.p-fv__text {
   margin-bottom: 32px;
}

.p-fv__btns {
   display: flex;
   flex-direction: column;
   gap: 20px;
}

.p-fv__btns a {
   display: inline-block;
   max-width: 335px;
   text-align: center;
}

/* 英語背景テキストの個別設定 */
.p-fv__en-bg {
   position: absolute;
   right: 0;
   bottom: 0;
   font-size: clamp(70px, calc(2.03rem + 8.72vw), 200px);
   color: var(--color-white);
   mix-blend-mode: normal;
   text-align: right;
   line-height: 0.8;
   z-index: 1;
   pointer-events: none;

   white-space: nowrap;
}

/* 「AI」部分のみさらに大きく（90px @430px 〜 250px @1920px） */
.p-fv__en-bg .ai {
   font-size: clamp(90px, calc(2.74rem + 10.74vw), 250px);
   vertical-align: -0.05em;
   /* 下に少しズラしてバランスを整える */
   color: var(--color-accent);
}

/* スマホ特有の調整 */
@media (max-width: 430px) {
   .p-fv__en-bg {
      bottom: 110px;
      /* SPのニュースバーの高さを考慮 */
      right: 25px;
      /* SPのgutter幅に固定 */
   }
}


/* スラッシュ装飾 */
.p-fv__line {
   position: absolute;
   background: #fff;
   width: 1px;
   height: 150px;
   transform: rotate(45deg);
   opacity: 0.6;
}

.p-fv__line--1 {
   top: 20%;
   left: 20%;
}

.p-fv__line--2 {
   bottom: 10%;
   right: 30%;
}

/* FV News */
.p-fv-news {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   background: #fff;
   padding: 15px 0;
}

/* ==========================================================================
   What is generative AI (.p-what-is)
   ========================================================================== */
.p-what-is {
   padding-top: 150px;
}

.p-what-is__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: clamp(40px, 2.5rem + 2.5vw, 100px);
   /* 画面幅に応じて余白を可変 */
}

@media (max-width: 768px) {
   .p-what-is__inner {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-what-is__content {
   flex: 1;
   position: relative;
}

.p-what-is__head {
   position: relative;
   margin-bottom: 200px;
}

/* 背後に敷く透過英字 */
.p-what-is__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.2em;
   font-size: clamp(60px, 3.75rem + 7.5vw, 160px);
   color: #D8F0FF;
   z-index: -1;
   white-space: nowrap;
   line-height: 0.8;
}

.p-what-is__title {
   font-size: 30px;
   position: relative;
   z-index: 1;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   /* 右寄せを維持 */
   gap: 16px;
   /* 文字と線の間隔 */
}

.p-what-is__title::after {
   content: "";
   height: 1px;
   width: 60px;
   background-color: #333;
}

.p-what-is__title span {
   color: var(--color-primary);
}

.p-what-is__text {
   margin-bottom: 40px;
   max-width: 32em;
   line-height: var(--lh-special);
}

@media (max-width: 768px) {
   .p-what-is__text {
      line-height: var(--lh-default);
   }
}

.p-what-is__img {
   flex: 0 0 clamp(300px, 45%, 680px);
}

@media (max-width: 768px) {
   .p-what-is__img {
      flex: none;
      width: 100%;
      margin-top: 30px;
   }
}

.p-what-is__img img {
   width: 100%;
   height: auto;
   border-radius: 0 32px 0 32px;
   /* デザインに合わせた角丸 */
}

/* 汎用的な画像フィット用 */
.u-img-fit {
   object-fit: cover;
   width: 100%;
   height: 100%;
}

/* ==========================================================================
   About Section (.p-about) - New Design
   ========================================================================== */
.p-about {
   background-color: var(--color-white);
   overflow: hidden;
}

.p-about__top {
   display: flex;
   align-items: center;
   gap: clamp(30px, 5vw, 80px);
   margin-bottom: clamp(60px, 8vw, 100px);
}

@media (min-width: 769px) {
   .p-about__top {
      /* デスクトップ：画像が左、テキストが右（画像に合わせて反転） */
      flex-direction: row-reverse;
   }
}

@media (max-width: 768px) {
   .p-about__top {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-about__content {
   flex: 1;
   position: relative;
}

.p-about__title {
   display: flex;
   align-items: center;
   position: relative;
   margin-bottom: 30px;
}

.p-about__title-main {
   font-size: 30px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 15px;
   white-space: nowrap;
   z-index: 2;
}

.p-about__title-main .blue {
   color: var(--color-primary);
}

.p-about__title-main::after {
   content: "";
   display: inline-block;
   width: 60px;
   height: 1px;
   background-color: #333;
}

.p-about__title-en {
   position: absolute;
   top: -0.5em;
   right: 0;
   font-family: "din-condensed", sans-serif;
   font-size: clamp(60px, 10vw, 160px);
   color: #D8F0FF;
   line-height: 0.9;
   pointer-events: none;
   z-index: 1;
}

@media (max-width: 768px) {
   .p-about__title-en {
      top: -0.2em;
   }
}

.p-about__main-text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   color: #333;
   position: relative;
   z-index: 2;
   max-width: 32em;
   margin-top: 200px;
}

/* 画像エリア */
.p-about__image-box {

   width: 50vw;
   /* 画面幅の半分まで広げる */
   margin-left: calc(50% - 50vw);
   /* 左端まで引き伸ばす */
}

@media (max-width: 768px) {
   .p-about__image-box {
      width: 100%;
      flex: none;
      order: 2;
      /* モバイルではテキストの下 */
      margin-top: 40px;
   }
}

.p-about__image {
   position: relative;
   border-radius: 10px;
   overflow: hidden;
}

.p-about__image img {
   width: 100%;
   height: auto;
}

.p-about__image-label {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   padding: 15px;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: #fff;
   font-weight: bold;
   font-size: 20px;
   text-align: center;
   border-radius: 25px 0 25px 0;
   /* 画像に合わせた角丸の調整 */
   margin-left: 60px;
}

/* カード一覧 */
.p-about__cards {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(460px, 1fr));
   gap: 30px;
}

@media (max-width: 1024px) {
   .p-about__cards {
      gap: 20px;
   }
}



.p-about__card {
   overflow: hidden;
   background-color: #fff;
   height: 100%;
   display: flex;
   flex-direction: column;
}

.p-about__card-head {
   padding: 20px;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: #fff;
   display: flex;
   align-items: center;
   gap: 15px;
   width: 90%;
   border-radius: 22px 22px 22px 0;
   z-index: 10;
}

.p-about__card-icon {
   width: 32px;
   height: 32px;
   object-fit: contain;
}

.p-about__card-title {
   font-size: var(--fs-18-24);
   font-weight: bold;
   line-height: 1.4;
}

.p-about__card-body {
   padding-bottom: 10px;
   padding-left: 25px;
   padding-right: 25px;
   padding-top: 40px;
   flex: 1;
   border: 1px solid #E5E5E5;
   border-radius: 20px;
   margin-top: -20px;
}

.p-about__card-text {
   font-size: var(--fs-18-24);
   line-height: 1.7;
   margin-bottom: 25px;
   color: #333;
}

.p-about__card-list {
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.p-about__card-list li {
   font-size: var(--fs-18-20);
   color: #333;
   padding-left: 40px;
   position: relative;
}

.p-about__card-list li::before {
   content: url("../images/common/icon_check.svg");
   display: inline-block;
   position: absolute;
   left: 0;
   top: 3px;
   width: 20px;
   height: 20px;
}


/* ==========================================================================
   Program Section (.p-program)
   ========================================================================== */
.p-program__inner {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   gap: clamp(40px, 3vw, 80px);
}

@media (max-width: 768px) {
   .p-program__inner {
      flex-direction: column;
   }
}

.p-program {
   background-color: #f5f5f5;
}

.p-program__content {
   flex: 1;
}

.p-program__head {
   position: relative;
   margin-bottom: 40px;
}

.p-program__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.1em;
   font-size: clamp(80px, 10vw, 200px);
   color: #fff;
   /* opacity: 0.08; */
   /* z-index: 10; */
}

.p-program__title {
   display: flex;
   align-items: center;
   gap: 20px;
   font-size: 30px;
   position: relative;
   z-index: 10;
   justify-content: flex-end;
}

.p-program__title::after {
   content: "";
   width: 100px;
   height: 1px;
   background-color: var(--color-border);
}

.p-program__subtitle {
   font-size: var(--fs-20-30);
   line-height: 1.3;
   margin-bottom: 24px;
}

.p-program__text {
   margin-bottom: 40px;
}

/* 番号付きリスト */
.p-program__list {
   display: flex;
   flex-direction: column;
   gap: 24px;
   margin-bottom: 48px;
}

.p-program__item {
   display: flex;
   align-items: flex-start;
   gap: 16px;
}

.p-program__number {
   flex-shrink: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 32px;
   height: 32px;
   background-color: var(--color-primary);
   color: var(--color-white);
   border-radius: 50%;
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   font-weight: bold;
}

.p-program__btn {
   text-align: right;
}

.p-program__btn a {
   color: var(--color-primary);
}

.p-program__item-title {
   font-size: var(--fs-18-20);
   color: var(--color-primary);
   margin-bottom: 8px;
}

.p-program__item-text {
   font-size: var(--fs-18-20);
   line-height: 1.6;
}

/* 画像と特徴バナー */
.p-program__visual {
   flex: 0 0 clamp(300px, 48%, 760px);
}

@media (max-width: 768px) {
   .p-program__visual {
      width: 100%;
      margin-top: 40px;
   }
}

/* ここ */
.p-program__img-box {
   position: relative;
   padding-bottom: 60px;
   margin-right: calc(20% - 20vw);
}


.p-program__img-box img {
   border-radius: 40px;
   /* デザインに合わせた強めの角丸 */
}

.p-program__feature {
   position: absolute;
   bottom: 0;
   left: 0;
   width: clamp(280px, 80%, 400px);
   background: var(--color-white);
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
   z-index: 2;
}

.p-program__feature-head {
   padding: 12px 20px;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   font-weight: bold;
   text-align: center;
}

.p-program__feature-body {
   padding: 20px;
   font-size: 14px;
   line-height: 1.6;
}

/* ==========================================================================
   Platform Section (.p-platform)
   ========================================================================== */
.p-platform__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: clamp(40px, 5vw, 100px);
}

@media (max-width: 768px) {
   .p-platform__inner {
      flex-direction: column-reverse;
      /* スマホでは文章が上、画像が下 */
      align-items: flex-start;
   }
}

/* 画像エリア */
.p-platform__visual {
   flex: 0 0 clamp(300px, 50%, 900px);
   position: relative;
}

@media (max-width: 768px) {
   .p-platform__visual {
      width: 100%;
      margin-top: 40px;
   }
}

.p-platform__img-box {
   position: relative;
   overflow: hidden;
   border-radius: 0 0 0 63px;
}

/* 画像上の青いラベル */
.p-platform__img-label {
   position: absolute;
   bottom: 30px;
   right: 0;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 15px 30px;
   min-width: 320px;
   z-index: 2;
}

@media (max-width: 430px) {
   .p-platform__img-label {
      min-width: 240px;
      padding: 10px 20px;
      bottom: 20px;
   }
}

.p-platform__img-label-sub {
   display: block;
   font-size: 14px;
   font-weight: bold;
   margin-bottom: 5px;
}

.p-platform__img-label-main {
   display: block;
   font-size: clamp(20px, 1.5rem, 32px);
   font-weight: bold;
}

/* コンテンツエリア */
.p-platform__content {
   flex: 1;
}

.p-platform__head {
   position: relative;
   margin-bottom: 40px;
}

.p-platform__en-bg {
   position: absolute;
   top: -0.2em;
   right: -0.1em;
   font-size: clamp(80px, 12vw, 180px);
   color: #D8F0FF;
   z-index: -1;
   text-align: right;
   line-height: 0.8;
}

.p-platform__title {
   gap: 24px;
   font-size: 30px;
}

.p-platform__title span {
   color: var(--color-primary);
}

.p-platform__title::after {
   content: "";
   flex: 1;
   max-width: 100px;
   height: 1px;
   background-color: var(--color-border);
}

.p-platform__text {
   margin-bottom: 32px;
   max-width: 35em;
}

.p-platform__btn {
   margin-bottom: 40px;
   text-align: right;
}

.p-platform__btn a {
   color: var(--color-text-main);
}

/* 4つのグラデーション機能ボタン */
.p-platform__features {
   display: grid;
   /* fi-content的な柔軟な挙動：幅に合わせて 2列 → 1列 と自動で最適化 */
   /* コンテナ幅が 572px (280*2 + gap:12) 未満になると自動的に1列になります */
   grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
   gap: 12px;
   margin-top: 30px;
   /* 必要に応じて調整 */
}

/* 既存の .p-platform__feature-item は維持（あるいは微調整） */
.p-platform__feature-item {
   background: linear-gradient(90deg, #158EDB 30%, #6051A6 100%);
   color: var(--color-white);
   padding: 14px 10px;
   text-align: center;
   border-radius: 18px 18px 0 18px;
   font-size: clamp(20px, 0.9rem, 24px);
   font-weight: bold;
   list-style: none;
}

.mb5{margin-bottom: 5rem;}

/* ==========================================================================
   General Supervision Section (.p-supervision)
   ========================================================================== */
.p-supervision {
   position: relative;
   background-color: var(--color-white);
   overflow: hidden;
}

.p-supervision__inner {
   position: relative;
}

/* 背後に敷く透過英字 */
.p-supervision__en-bg {
   position: absolute;
   top: -0.2em;
   left: 50%;
   transform: translateX(-50%);
   font-size: clamp(94px, 4.685rem + 4.43vw, 160px);
   color: #D8F0FF;
   z-index: 1;
   white-space: nowrap;
   line-height: 0.8;
   width: 100%;
   text-align: center;
}

@media (max-width: 768px) {
   .p-supervision__en-bg {
      font-size: clamp(60px, 18vw, 120px);
      line-height: 1.1;
      white-space: normal;
      /* スマホでは折り返しを許容 */
      top: 0;
   }
}

.p-supervision__head {
   position: relative;
   z-index: 2;
   margin-bottom: clamp(40px, 5vw, 80px);
   text-align: center;
}

.p-supervision__title {
   display: inline-flex;
   align-items: center;
   gap: 20px;
   font-size: 30px;
}

.p-supervision__title::after {
   content: "";
   width: clamp(40px, 10vw, 100px);
   height: 1px;
   background-color: var(--color-text-main);
}

.p-supervision__body {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   gap: clamp(40px, 5vw, 80px);
   z-index: 2;
   position: relative;
}

@media (max-width: 768px) {
   .p-supervision__body {
      flex-direction: column;
   }
}

.p-supervision__content {
   flex: 1;
}

.p-supervision__label {
   font-size: 14px;
   font-weight: bold;
   margin-bottom: 12px;
}

.p-supervision__name-wrap {
   display: flex;
   align-items: center;
   gap: 15px;
   margin-bottom: 15px;
}

.p-supervision__name {
   font-size: clamp(32px, 3vw, 44px);
   color: var(--color-primary);
   font-weight: bold;
}

.p-supervision__name-en {
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   text-transform: uppercase;
}

.p-supervision__position {
   font-size: 15px;
   font-weight: bold;
   line-height: 1.5;
   margin-bottom: 30px;
}

.p-supervision__text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   margin-bottom: 35px;
}

/* 引用ボックス */
.p-supervision__quote {
   background-color: #E2F5FF;
   /* 淡い水色 */
   padding: clamp(20px, 4vw, 40px);
   border-radius: 54px 0 57px 0;
   position: relative;
}

.p-supervision__quote-text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   color: var(--color-text-main);
}

/* 画像エリア */
.p-supervision__img-box {
   flex: 0 0 clamp(300px, 45%, 760px);
}

@media (max-width: 768px) {
   .p-supervision__img-box {
      width: 100%;
      margin-top: 20px;
   }
}

.p-supervision__img-box img {
   border-radius: 0 53px 56px 0;
   /* デザインに合わせた大きな角丸 */
}

/* ==========================================================================
   News Section (.p-news)
   ========================================================================== */
.p-news {
   background-color: var(--color-bg-light);
}

.p-news__head {
   position: relative;
   margin-bottom: clamp(60px, 8vw, 80px);
   text-align: center;
}

.p-news__en-bg {
   position: absolute;
   top: -0.3em;
   left: 50%;
   transform: translateX(-50%);
   font-size: clamp(100px, 15vw, 220px);
   color: var(--color-white);
   opacity: 0.8;
   /* 白背景なので少し強めに表示 */
   line-height: 1;
   z-index: 1;
}

.p-news__title {
   position: relative;
   z-index: 2;
   display: inline-flex;
   align-items: center;
   gap: 20px;
   font-size: 30px;
}

.p-news__title::after {
   content: "";
   width: 100px;
   height: 1px;
   background-color: #B2B2B2;
}

.p-news__list {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: clamp(20px, 2.5vw, 40px);
   margin-bottom: 60px;
}

@media (max-width: 768px) {
   .p-news__list {
      grid-template-columns: 1fr;
      gap: 30px;
   }
}

.p-news__card {
   display: flex;
   flex-direction: column;
   height: 100%;
   background-color: var(--color-white);
   border-radius: 12px;
   overflow: hidden;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.p-news__card:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.p-news__img {
   position: relative;
   padding-top: 56.25%;
   /* 16:9 */
   overflow: hidden;
   border-radius: 12px 12px 0 0;
}

.p-news__img img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.5s ease;
}

.p-news__card:hover .p-news__img img {
   transform: scale(1.05);
}

.p-news__content {
   padding: 25px 20px 20px;
   flex-grow: 1;
   display: flex;
   flex-direction: column;
   position: relative;
}

.p-news__meta {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 20px;
}

.p-news__meta time {
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   color: #666;
}

.p-news__category {
   display: inline-block;
   padding: 4px 20px;
   border-radius: 100px;
   font-size: 12px;
   font-weight: bold;
   color: var(--color-white);
}

.p-news__category--media {
   background-color: #C9BA00;
}

.p-news__category--seminar {
   background-color: #4CC1C1;
}

.p-news__category--press {
   background-color: #B58CC1;
}

.p-news__item-title {
   font-size: clamp(18px, 1.02rem + 0.4vw, 24px);
   line-height: 1.6;
   margin-bottom: 30px;
   flex-grow: 1;
}

.p-news__more {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 8px;
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   font-weight: bold;
   color: #333;
}

/* 矢印アイコン。c-btn--outline-arrowなどで使っているものと同じSVGを流用 */
.p-news__more-arrow {
   width: 14px;
   height: 14px;
   background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 15.5L15.5 4.5M15.5 4.5H7.5M15.5 4.5V12.5' stroke='%23158EDB' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat center center / contain;
   transition: transform 0.3s ease;
}

.p-news__card:hover .p-news__more-arrow {
   transform: translate(3px, -3px);
}

.p-news__btn-wrap {
   display: flex;
   justify-content: flex-end;
}

@media (max-width: 768px) {
   .p-news__btn-wrap {
      justify-content: center;
   }
}


/* ==========================================================================
   Case Study Section (.p-case)
   ========================================================================== */
.p-case {
   background-color: var(--color-white);
   padding-bottom: 0;
}

.p-case__inner {
   display: flex;
   flex-direction: column;
}

.p-case__head-wrap {
   display: flex;
   align-items: flex-start;
   justify-content: flex-end;
   margin-bottom: clamp(60px, 8vw, 100px);
   position: relative;
}

@media (max-width: 1024px) {
   .p-case__head-wrap {
      flex-direction: column;
      gap: 40px;
   }
}

.p-case__head {
   position: relative;
   flex: 0 0 clamp(300px, 40%, 600px);
}

.p-case__en-bg {
   position: absolute;
   top: -0.2em;
   left: -0.1em;
   font-size: clamp(94px, 4.68rem + 4.43vw, 160px);
   color: #D8F0FF;
   /* z-index: -10; */
   line-height: 0.8;
   white-space: nowrap;
}

.p-case__title-area {
   position: relative;
   z-index: 2;
   margin-top: clamp(40px, 6vw, 80px);
   display: flex;
   align-items: flex-start;
   gap: 30px;
   justify-content: flex-start;
}

.p-case__title {
   font-size: clamp(24px, 2.5vw, 36px);
   line-height: 1.4;
   font-weight: bold;
}

.p-case__head-line {
   margin-top: 20px;
   height: 1px;
   width: 100px;
   background-color: var(--color-text-main);
}

.p-case__featured-img {
   flex: 0 0 clamp(300px, 50%, 910px);
   border-radius: 0 0 0 32px;
   overflow: hidden;
   margin-right: calc(50% - 50vw);
}

@media (max-width: 1024px) {
   .p-case__title-area {
      margin-left: clamp(80px, 20vw, 230px);
   }

   .p-case__featured-img {
      width: 100%;
   }
}

.p-case__wrap {
   margin-inline: calc(50% - 50vw);
   padding: var(--gutter-fluid);
   background-color: #F5F5F5;
   margin-top: clamp(-300px, 10vh, -60px);
}

/* カードリスト */
.p-case__list {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(650px, 1fr));
   gap: 30px;
   margin-bottom: clamp(40px, 5vw, 60px);

}

@media (max-width: 768px) {
   .p-case__list {
      grid-template-columns: 1fr;
      gap: 40px;
   }
}

.p-case__card {
   height: 100%;
   display: flex;
   flex-direction: column;
}

/* カードヘッダー（グラデーション） */
.p-case__card-head {
   padding: 15px;
   background: linear-gradient(90deg, #6051A6 0%, #158EDB 100%);
   color: var(--color-white);
   text-align: center;
   font-weight: bold;
   font-size: clamp(20px, 1.2rem, 30px);
   border-radius: 19px 0 0 0;
   padding: 10px clamp(100px, calc(4.45rem + 6.71vw), 200px);
}

.p-case__card-body {
   padding: clamp(30px, 4vw, 50px) clamp(20px, 3vw, 40px);
   border-left: 1px solid #E5E5E5;
   border-right: 1px solid #E5E5E5;
   background-color: var(--color-white);
   flex-grow: 1;
   position: relative;
}



.p-case__card-title {
   font-size: var(--fs-20-30);
   line-height: 1.4;
   margin-bottom: 24px;
   font-weight: bold;
}

.p-case__card-text {
   font-size: var(--fs-18-24);
   line-height: 1.6;
   margin-bottom: 40px;
}

/* MOREリンク */
.p-case__card-more {
   display: inline-flex;
   align-items: center;
   color: var(--color-text-main);
   font-family: "din-condensed", sans-serif;
   font-size: 18px;
   font-weight: bold;
   position: absolute;
   right: clamp(20px, 3vw, 40px);
   bottom: 24px;
   border-bottom: 2px dotted var(--color-border);
   padding-bottom: 2px;
   transition: opacity 0.3s ease;
}

.p-case__card-more:hover {
   opacity: 0.7;
}

.p-case__card-more-arrow {
   display: inline-block;
   margin-left: 8px;
   width: 14px;
   height: 14px;
   background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 15.5L15.5 4.5M15.5 4.5H7.5M15.5 4.5V12.5' stroke='%23158EDB' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat center center / contain;
   transition: transform 0.3s ease;
}

.p-case__card-more:hover .p-case__card-more-arrow {
   transform: translate(3px, -3px);
}

.p-case__card-img {
   width: 100%;
   border-radius: 0 0 12px 12px;
   overflow: hidden;
}

/* 下部ボタン */
.p-case__btn-wrap {
   display: flex;
   justify-content: flex-end;
}

@media (max-width: 768px) {
   .p-case__btn-wrap {
      justify-content: center;
   }
}

/* 斜め矢印付きボタンスタイル (Read moreなど) */
.c-btn--outline-arrow {
   border: 1px solid var(--color-primary);
   color: var(--color-primary);
   background-color: var(--color-white);
}

/* ==========================================================================
   Contact Banner (.p-contact-banner)
   ========================================================================== */
.p-contact-banner {
   position: relative;
   padding: clamp(60px, 8vw, 100px) 0;
   color: var(--color-white);
   text-align: center;
   overflow: hidden;
}

.p-contact-banner__bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
}

.p-contact-banner__bg::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.4);
   /* 文字の視認性確保 */
}

.p-contact-banner__title {
   font-size: clamp(24px, 2.5vw, 44px);
   font-weight: bold;
   margin-bottom: 24px;
   font-feature-settings: "palt";
}

.p-contact-banner__text {
   font-size: var(--fs-18-24);
   line-height: 1.8;
   margin-bottom: 40px;
}

.p-contact-banner__btns {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 20px;
}

@media (max-width: 768px) {
   .p-contact-banner__btns {
      flex-direction: column;
   }


}



/* ==========================================================================
   Footer (.footer)
   ========================================================================== */
.footer {
   background-color: #fff;
}

@media (min-width: 769px) {
   .footer {
      /* 背景を50%で塗り分け。中央を境に色が切り替わります */
      background: linear-gradient(to right, #fff 50%, #F7F7F7 50%);
   }
}

.footer__main {
   display: flex;
   justify-content: space-between;
   padding-top: 80px;
   padding-bottom: 80px;
}

@media (max-width: 768px) {
   .footer__main {
      flex-direction: column;
      padding-top: 60px;
      padding-bottom: 0;
      /* モバイルでは最下部の余白を調整 */
   }
}

/* 左側：企業情報（PCでは左50%幅） */
.footer__info {
   flex: 0 0 50%;
   padding-right: clamp(20px, 4vw, 60px);
}

@media (max-width: 768px) {
   .footer__info {
      flex: none;
      width: 100%;
      padding-right: 0;
      margin-bottom: 40px;
   }
}

.footer__logo {
   display: flex;
   align-items: center;
   gap: 15px;
   margin-bottom: 30px;
}

@media (max-width: 768px) {
   .footer__logo {
      justify-content: center;
   }
}

.footer__logo img {
   width: 160px;
   height: auto;
}

.footer__company {
   font-size: 20px;
   color: #333;
}

.footer__text {
   font-size: 15px;
   line-height: 1.8;
   margin-bottom: 30px;
   color: #333;
}

@media (max-width: 768px) {
   .footer__text {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      max-width: 400px;
   }
}

.footer__contact-list {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

@media (max-width: 768px) {
   .footer__contact-list {
      align-items: center;
   }
}

.footer__contact-item,
.footer__contact-item a {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 14px;
   color: #333;
}

.footer__contact-icon {
   width: 22px;
   height: 22px;
}

/* 右側：ナビゲーション（PCでは右50%幅） */
.footer__nav {
   flex: 0 0 50%;
   display: flex;
   justify-content: space-between;
   padding-left: clamp(20px, 4vw, 60px);
   /* 背景色の切り替わり目からの余白 */
}

@media (max-width: 768px) {
   .footer__nav {
      display: block;
      padding-left: 0;
      /* モバイル版は背景を画面端まで広げるためネガティブマージン */
      margin: 0 calc(var(--gutter-fluid) * -1);
   }
}

.footer__nav-col {
   flex: 1;
}

@media (max-width: 1024px) {
   .footer__nav-col {
      margin-left: 15px;
   }
}

@media (max-width: 768px) {
   .footer__nav-col {
      margin-left: 0;
   }
}

.footer__nav-title {
   font-size: 16px;
   font-weight: bold;
   color: var(--color-primary);
   /* 画像に合わせて青色に */
   margin-bottom: 24px;
}

.footer__nav-list {
   display: flex;
   flex-direction: column;
}

.footer__nav-list a {
   font-size: 14px;
   color: #666;
   transition: color 0.3s;
}

.footer__nav-list a:hover {
   color: var(--color-primary);
}

/* モバイル版のナビゲーション */
@media (max-width: 768px) {
   .footer__nav-title {
      background-color: #5196D9;
      color: #fff;
      padding: 15px;
      margin-bottom: 0;
      text-align: center;
      font-size: 15px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.2);
   }

   .footer__nav-list a {
      display: block;
      padding: 15px;
      background-color: #F7F7F7;
      text-align: center;
      border-bottom: 1px solid #e0e0e0;
   }

   .footer__nav-col:last-child .footer__nav-list li:last-child a {
      border-bottom: none;
   }
}


/* パートナーバー */
.footer__partners {
   background-color: var(--color-black);
   color: var(--color-white);
   padding: 25px 0;
   position: relative;
   z-index: 2;
   /* 背景のグラデーションに隠れないように */
}

.footer__partners-wrap {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
}

.footer__partner-stat {
   margin-left: 16px;
   display: flex;
   align-items: center;
}

.footer__partner-icon {
   margin-right: 8px;
}

.footer__bottom {
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 20px 0;
   position: relative;
   z-index: 2;
}

.footer__bottom-wrap {
   display: flex;
   justify-content: space-between;
   /* 左右に振り分け */
   align-items: center;
}

.footer__copyright {
   font-size: 12px;
}

.footer__bottom-links {
   font-size: 14px;
}

.footer__bottom-links a:hover {
   text-decoration: underline;
}

/* 768px以下のモバイル表示調整 */
@media (max-width: 768px) {
   .footer__bottom-wrap {
      flex-direction: column-reverse;
      /* 順序を反転させてリンクを上に */
      gap: 12px;
      text-align: center;
   }
}



/* ==========================================================================
   Lower Page Common Styles
   ========================================================================== */

/**
 * Narrow Inner Container
 * デスクトップ(1920px)時にコンテンツ幅 1320px (左右余白300pxずつ)
 * スマホ(430px)時にコンテンツ幅 380px (左右余白25pxずつ) を clamp で計算
 */
.l-inner--narrow {
   padding-right: clamp(25px, calc(-1.19rem + 18.45vw), 300px);
   padding-left: clamp(25px, calc(-1.19rem + 18.45vw), 300px);
}

/**
 * Header Subpage Modifier
 * 下層ページでは背景を黒に変更し、ロゴを反転させて白く表示
 */
.header--sub {
   position: relative;
   background-color: var(--color-black);
}

/* 下層ページのヘッダー内側パディング調整（上下を均等に） */
.header--sub .header__inner {
   padding-bottom: clamp(15px, calc(0.12rem + 3.02vw), 24px);
}

/* ロゴが黒の場合、白く反転させる */
.header--sub .header__logo img {
   filter: brightness(0) invert(1);
}

/* ハンバーガーの線を白く */
.header--sub .header__hamburger span {
   background-color: var(--color-white);
}

/**
 * Lower Page Hero
 */
.p-lower-hero {
   position: relative;
   height: clamp(300px, 40vh, 480px);
   display: flex;
   align-items: center;
   overflow: hidden;
}

.p-lower-hero__bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 0;
}

.p-lower-hero__bg::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.5);
   /* 画像を暗くして文字を可読化 */
}

/* 背景に流れるタイポグラフィ */
.p-lower-hero__en-bg {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   font-size: clamp(80px, 15vw, 240px);
   color: var(--color-white);
   opacity: 0.1;
   white-space: nowrap;
   z-index: 1;
}

.p-lower-hero__content {
   position: relative;
   z-index: 2;
   color: var(--color-white);
   text-align: center;
   width: 100%;
}

.p-lower-hero__title {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(40px, 6vw, 90px);
   line-height: 1;
   letter-spacing: 0.05em;
}

.p-lower-hero__title small {
   display: block;
   font-family: var(--font-ja);
   font-size: clamp(14px, 1.5vw, 20px);
   margin-top: 10px;
   letter-spacing: 0.1em;
   font-weight: normal;
}

/**
 * Breadcrumb
 */
.p-breadcrumb {
   background-color: var(--color-bg-light);
   padding: 15px 0;
}

.p-breadcrumb__list {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 14px;
   color: #666;
}

.p-breadcrumb__separator {
   color: var(--color-primary);
   font-weight: bold;
}

/**
 * Privacy Policy Content
 */
.p-privacy {
   background-color: var(--color-white);
}

.p-privacy__head-meta {
   text-align: right;
   font-size: 14px;
   line-height: 1.8;
   margin-bottom: 40px;
   color: #333;
}

.p-privacy__intro {
   margin-bottom: 60px;
   font-weight: bold;
}

.p-privacy__item {
   margin-bottom: 60px;
}

/* 章ごとのタイトル（青い下線） */
.p-privacy__item-title {
   font-size: clamp(20px, 1.5rem, 24px);
   color: var(--color-primary);
   padding-bottom: 15px;
   margin-bottom: 30px;
   border-bottom: 1px solid var(--color-primary);
   position: relative;
}

.p-privacy__item-content p {
   margin-bottom: 20px;
}

/* リスト形式（青いドット） */
.p-privacy__list {
   list-style: none;
   padding-left: 0;
}

.p-privacy__list li {
   position: relative;
   padding-left: 1.5em;
   margin-bottom: 12px;
}

.p-privacy__list li::before {
   content: "";
   position: absolute;
   left: 0.4em;
   top: 0.7em;
   width: 6px;
   height: 6px;
   background-color: var(--color-primary);
   border-radius: 50%;
}

/* ==========================================================================
   Header Subpage Styles
   ========================================================================== */

/**
 * Header Subpage Modifier
 * PCでは絶対配置（オーバーレイ）、スマホでは黒背景
 */
.header--sub {
   position: absolute;
   /* デフォルトに戻す */
   background-color: transparent;
}

@media (max-width: 1549px) {
   .header--sub {
      position: relative;
      background-color: var(--color-black);
   }
}

/* ロゴエリアのレイアウト（バッヂを下に並べる） */
.header__logo-area {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

/* 下層ページ用グラデーションバッヂ */
.header__sub-badge {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   font-size: 14px;
   font-weight: bold;
   padding: 8px 24px;
   border-radius: 100px;
   width: fit-content;
}

/* ==========================================================================
   Lower Page Hero & Title Section
   ========================================================================== */

/**
 * Lower Page Hero
 */
.p-lower-hero {
   position: relative;
   height: clamp(300px, 16.2rem + 15vw, 420px);
   display: flex;
   align-items: flex-end;
   /* 巨大英字を下に寄せる */
   overflow: hidden;
}

/* ヒーロー背景の巨大タイポグラフィ */
.p-lower-hero__en-bg {
   position: absolute;
   bottom: -0.2em;
   left: 50%;
   transform: translateX(10%);
   font-family: "din-condensed", sans-serif;
   font-size: clamp(30px, 5rem + 18vw, 280px);
   color: var(--color-white);
   opacity: 0.2;
   /* 背後の画像に馴染ませる */
   white-space: nowrap;
   line-height: 0.8;
   pointer-events: none;
}

/**
 * Privacy Policy Specific Title
 * パンくず下の「PRIVACYPOLICY / プライバシーポリシー」
 */
.p-privacy__head {
   text-align: center;
   margin-bottom: 60px;
}

.p-privacy__main-title {
   display: flex;
   flex-direction: column;
   align-items: center;
}

/* 巨大な水色英字 */
.p-privacy__main-title .en {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(60px, 3.5rem + 10vw, 160px);
   color: #D8F0FF;
   /* 非常に淡い水色 */
   line-height: 1;
   letter-spacing: 0.02em;
}

/* 日本語テキスト */
.p-privacy__main-title .ja {
   font-size: var(--fs-20-30);
   font-weight: bold;
   color: var(--color-text-main);
   margin-top: -0.5em;
   /* 英字との隙間を詰める */
   letter-spacing: 0.2em;
}

/* タイトル下の境界線 */
.p-privacy__border {
   border: none;
   border-top: 1px solid var(--color-primary);
   width: 100px;
   margin: 30px auto 0;
}

/**
 * Breadcrumb Separator
 */
.p-breadcrumb__separator {
   color: var(--color-primary);
   font-weight: bold;
   margin: 0 5px;
}

/* ==========================================================================
   Service Page Specific Styles
   ========================================================================== */

/**
 * Service Page Hero
 */
.p-lower-hero--service {
   height: clamp(400px, 20rem + 25vw, 680px);
   /* サービスページは少し高めに設定 */
   align-items: center;
   /* コンテンツを上下中央に */
}

.p-lower-hero__content {
   position: relative;
   z-index: 10;
   color: var(--color-white);
   text-align: left;
}

.p-lower-hero__badge {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   font-size: clamp(14px, 1rem + 0.5vw, 20px);
   font-weight: bold;
   padding: 0.8em 2.5em;
   border-radius: 100px;
   margin-bottom: 25px;
}

.p-lower-hero__headline {
   font-size: clamp(32px, 2rem + 3.5vw, 72px);
   line-height: 1.3;
   font-weight: bold;
   letter-spacing: 0.05em;
}

.p-lower-hero__headline span {
   color: var(--color-accent);
}

/* ヒーロー内の巨大英字を右下に吸着させる */
.p-lower-hero__en-bg--right {
   left: auto !important;
   right: 0 !important;
   transform: none !important;
   text-align: right;
   bottom: 0;
   font-size: clamp(120px, 8rem + 15vw, 360px) !important;
   opacity: 0.15;
}

/**
 * Service Intro Section
 */
.p-service-intro {
   padding-bottom: 0;
   /* 下のコンテンツとの隙間を調整 */
}

.p-service-intro__head {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-bottom: 60px;
}

.p-service-intro__main-title {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-bottom: 30px;
}

.p-service-intro__main-title .en {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(80px, 4rem + 10vw, 200px);
   color: #D8F0FF;
   /* 非常に淡い水色 */
   line-height: 1;
}

.p-service-intro__main-title .ja {
   font-size: 20px;
   font-weight: bold;
   color: var(--color-text-main);
   margin-top: -0.5em;
   letter-spacing: 0.2em;
}

.p-service-intro__lead {
   max-width: 820px;
   margin: 0 auto;
   font-size: clamp(16px, 1rem + 0.2vw, 20px);
   line-height: 1.8;
   color: var(--color-text-main);
}


/* ==========================================================================
   Service Detail Section (01 onwards)
   ========================================================================== */

.p-service-item {
   position: relative;
   overflow: hidden;
}

.p-service-item__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: clamp(40px, 3rem + 5vw, 120px);
   margin-bottom: 80px;
}

@media (max-width: 1024px) {
   .p-service-item__inner {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-service-item__content {
   flex: 1;
}

/* 番号と見出し */
.p-service-header {
   display: flex;
   align-items: flex-start;
   gap: 20px;
   margin-bottom: 30px;
}

.p-service-header__number {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(80px, 5rem + 10vw, 160px);
   color: #D8F0FF;
   line-height: 0.8;
}

.p-service-header__title {
   font-size: clamp(24px, 1.5rem + 1.2vw, 42px);
   font-weight: bold;
   line-height: 1.3;
   color: var(--color-text-main);
   margin-top: 10px;
}

/* グラデーションラベル */
.p-service-label {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 18px 40px;
   border-radius: 12px;
   font-weight: bold;
   font-size: clamp(16px, 1rem + 0.3vw, 22px);
   margin-bottom: 30px;
}

.p-service-text {
   font-size: clamp(16px, 1rem + 0.1vw, 18px);
   line-height: 1.8;
   max-width: 35em;
}

/* 画像エリア */
.p-service-image {
   /* flex: 0 0 clamp(300px, 48%, 760px); */
}

@media (max-width: 1024px) {
   .p-service-image {
      width: 100%;
   }
}


.p-service-image__inner {
   border-radius: 45px 0 0 0;
   width: 100%;
   margin-right: calc(50% - 50vw);
}


.p-service-subsidy {
   border-left: 25px solid #5196D9;
   padding-left: 20px;
   margin-bottom: 35px;
}

.p-service-subsidy__title {
   font-weight: bold;
   font-size: var(--fs-20-30);
}

.p-service-subsidy__note {
   font-size: var(--fs-12-14);
}

/* ==========================================================================
   Service Concept Section
   ========================================================================== */
.p-service-concept {
   background-color: #F5F5F5;
   padding-bottom: clamp(60px, 8vw, 100px);
   position: relative;
   /* 前のセクション（白背景）の上に重なるための設定 */
   margin-top: -220px;
   padding-top: 220px;
   z-index: -1;
}

@media (max-width: 768px) {
   .p-service-concept {
      margin-top: -60px;
      padding-top: 60px;
   }
}

.p-service-concept__inner {
   position: relative;
   z-index: 1;
   /* スタッキングコンテキストを作成 */
   display: flex;
   flex-wrap: wrap;
}

/* 背後の巨大英字 "Concept" */
.p-service-concept__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.1em;
   font-family: "din-condensed", sans-serif;
   font-size: clamp(100px, 12rem + 5vw, 240px);
   color: #FFFFFF;
   /* 白背景から続くように白で描写 */
   line-height: 1;
   pointer-events: none;
   z-index: -1;
   /* 親要素内の最背面（背景色のすぐ上）に配置 */
}

.p-service-concept__head {
   margin-bottom: 60px;
   position: relative;
}

.p-service-concept__title-wrap {
   display: flex;
   align-items: center;
   gap: 20px;
}

.p-service-concept__title {
   font-weight: bold;
   white-space: nowrap;
   margin-left: clamp(100px, 50vw, 500px);
}

.p-service-concept__line {
   width: 100px;
   height: 1px;
   background-color: #ccc;
}

/* レイアウト：PCで横並び、スマホで縦積み */
.p-service-concept__body {
   display: flex;
   justify-content: space-between;
   gap: clamp(40px, 5vw, 80px);
}

@media (max-width: 1024px) {
   .p-service-concept__body {
      flex-direction: column;
   }
}

.p-service-concept__content {
   flex: 1;
}

.p-service-concept__lead {
   line-height: 1.8;
   margin-bottom: 50px;
   color: var(--color-text-main);
}

.p-service-concept__features {
   display: flex;
   flex-direction: column;
   gap: 40px;
}

.p-service-concept__feature-text {
   line-height: 1.7;
   margin-top: 15px;
   color: var(--color-text-main);
}

/* 画像：角丸の適用 */
.p-service-concept__image {
   flex: 0 0 clamp(300px, 40%, 540px);
}

.p-service-concept__image img {
   border-radius: 24px;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

@media (max-width: 1024px) {
   .p-service-concept__image {
      width: 100%;
      order: 2;
      /* スマホでは文章の下に配置 */
   }
}

/* ==========================================================================
   Curriculum Details Section
   ========================================================================== */
.p-curriculum {
   background-color: #F5F5F5;
   padding-bottom: clamp(60px, 8vw, 120px);
}

.p-curriculum__head {
   text-align: center;
   margin-bottom: 0;
   position: relative;
}

.p-curriculum__title {
   font-size: clamp(24px, 1.5rem + 0.5vw, 32px);
   font-weight: bold;
   margin-bottom: clamp(30px, 4vw, 50px);
}

.p-curriculum__icon {
   width: clamp(64px, 6vw, 84px);
   height: clamp(64px, 6vw, 84px);
   background-color: #5196D9;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 auto;
   position: relative;
   z-index: 2;
   margin-bottom: calc(clamp(64px, 6vw, 84px) / -2);
   /* 下のボックスに半分乗せる */
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.p-curriculum__icon img {
   width: 50%;
   height: auto;
}

.p-curriculum__content {
   background-color: #fff;
   padding: clamp(50px, 6vw, 100px) clamp(30px, 4vw, 80px) clamp(40px, 5vw, 80px);
   position: relative;
   z-index: 1;
}

.p-curriculum__grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: clamp(30px, 4vw, 50px) clamp(40px, 5vw, 80px);
}

@media (max-width: 1024px) {
   .p-curriculum__grid {
      grid-template-columns: 1fr;
      gap: 30px;
   }
}

.p-curriculum__item {
   display: flex;
   flex-direction: column;
}

.p-curriculum__item-title {
   color: #5196D9;
   font-weight: bold;
   font-size: var(--fs-18-24);
   padding-left: 15px;
   border-left: 4px solid #5196D9;
   margin-bottom: 12px;
   line-height: 1.4;
}

.p-curriculum__divider {
   width: 100%;
   height: 1px;
   border-bottom: 1px dashed #ccc;
   margin-bottom: 15px;
}

.p-curriculum__item-text {
   color: var(--color-text-main);
}


/* --------------------------------------------------------------------------
   Acquired Skills Area
   -------------------------------------------------------------------------- */
.p-service-skills {
   padding: clamp(60px, 8vw, 120px) 0;
}

.p-service-skills__container {
   display: flex;
   gap: clamp(30px, 2rem + 4vw, 100px);
}

@media (max-width: 1024px) {
   .p-service-skills__container {
      flex-direction: column;
      align-items: stretch;
   }
}

.p-service-skills__img {
   flex: 0 0 50%;
   border-radius: 80px 0 0 0;
   /* 特徴的な左上の角丸 */
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

@media (max-width: 1024px) {
   .p-service-skills__img {
      flex: none;
      width: 100%;
      border-radius: 40px 0 0 0;
      /* スマホでは少し控えめに */
   }
}

.p-service-skills__content {
   flex: 1;
}

.p-service-skills__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   color: var(--color-text-main);
   margin-bottom: 30px;
}

.p-service-skills__list {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

.p-service-skills__item {
   display: flex;
   border: 1px solid #CCC;
   background-color: var(--color-white);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.p-service-skills__item:hover {
   transform: translateX(5px);
   box-shadow: 5px 5px 15px rgba(21, 142, 219, 0.08);
}

.p-service-skills__item-icon {
   flex: 0 0 80px;
   background: linear-gradient(135deg, #447FD5 0%, #6051A6 100%);
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 15px;
}

.p-service-skills__item-icon img {
   width: 40px;
   height: auto;
   filter: brightness(0) invert(1);
   /* アイコンを白く */
}

.p-service-skills__item-body {
   padding: 15px 25px;
   flex: 1;
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.p-service-skills__item-title {
   font-size: var(--fs-18-24);
   font-weight: bold;
   color: var(--color-text-main);
   line-height: 1.2;
}

.p-service-skills__item-text {
   font-size: var(--fs-18-20);
   color: #666;
   margin-top: 5px;
}

@media (max-width: 430px) {
   .p-service-skills__item-icon {
      flex: 0 0 60px;
      padding: 12px;
   }

   .p-service-skills__item-icon img {
      width: 30px;
   }

   .p-service-skills__item-title {
      font-size: 16px;
   }
}

/* ==========================================================================
   Service Price Section
   ========================================================================== */
.p-service-price {
   padding: clamp(60px, 8vw, 120px) 0;
   position: relative;
   overflow: hidden;
}

/* 背後の大きな "Price" テキスト */
.p-service-price__en-bg {
   position: absolute;
   top: -0.5em;
   left: 50%;
   transform: translateX(-50%);
   font-family: "din-condensed", sans-serif;
   font-size: clamp(120px, 15vw, 260px);
   color: #D8F0FF;
   white-space: nowrap;
   line-height: 1;
   pointer-events: none;
   z-index: -10;
}

.p-service-price__head {
   position: relative;
   z-index: 1;
   margin-bottom: clamp(30px, 4vw, 50px);
}

.p-service-price__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   text-align: center;
}

/* 2カラムレイアウト */
.p-service-price__body {
   display: flex;
   justify-content: space-between;
   gap: clamp(30px, 5vw, 80px);
   align-items: flex-start;
   position: relative;
   z-index: 1;
}

@media (max-width: 1024px) {
   .p-service-price__body {
      flex-direction: column;
   }
}

/* 左：料金カード */
.p-service-price__card {
   padding: clamp(20px, 3vw, 32px) clamp(20px, 3vw, 36px);
   text-align: center;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}

@media (max-width: 1024px) {
   .p-service-price__card {
      flex: none;
      width: 100%;
   }
}

.p-service-price__card-lead p {
   color: var(--color-primary);
   font-weight: bold;
   font-size: var(--fs-20-30);
}

.p-service-price__card-label {
   background: linear-gradient(90deg, #447FD5 0%, #6051A6 100%);
   color: #fff;
   font-weight: bold;
   font-size: var(--fs-20-30);
   text-align: center;
   padding: 14px 20px;
   margin-bottom: clamp(20px, 3vw, 36px);
   width: 100%;
   border-radius: 25px 0 27px 0;
   margin-top: 16px;
}

.p-service-price__amount-wrap {
   margin-bottom: 10px;
}

.p-service-price__amount-prefix {
   display: block;
   font-size: clamp(13px, 0.9rem, 15px);
   color: var(--color-text-main);
   margin-bottom: 4px;
}

.p-service-price__amount {
   display: flex;
   align-items: baseline;
   gap: 4px;
   justify-content: center;
}

.p-service-price__amount-num {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(56px, 7vw, 80px);
   font-weight: bold;
   color: var(--color-primary);
   line-height: 1;
}

.p-service-price__amount-unit {
   font-size: clamp(22px, 2.2vw, 30px);
   font-weight: bold;
   color: var(--color-primary);
}

.p-service-price__amount-tax {
   font-size: clamp(11px, 0.8rem, 13px);
   font-weight: normal;
}

.p-service-price__amount-wrap {
   display: block;
   margin-bottom: 6px;
}

.p-service-price__note {
   color: #666;
   margin-bottom: clamp(24px, 3vw, 36px);
   text-align: center;
}

.p-service-price__btn-wrap a {
   color: var(--color-black);
}

/* 右：助成金シミュレーション */
.p-service-price__sim {
   flex: 1;
}

.p-service-price__sim-title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   color: var(--color-primary);
   padding-left: 15px;
   padding-bottom: 16px;
   border-left: 4px solid #5196D9;
   border-bottom: 1px dotted var(--color-border);
   margin-bottom: 10px;
   line-height: 1.4;
}

.p-service-price__sim-lead {
   color: #666;
   margin-bottom: 15px;
}

.p-service-price__attention {
   /* width: 100%; */
   margin-top: 16px;
}

.p-service-price__attention-text {
   font-size: 12px;
   text-align: left;
}

/* テーブル */
.p-service-price__table {
   width: 100%;
   border-collapse: collapse;
   margin-bottom: 15px;
}

.p-service-price__table th,
.p-service-price__table td {
   padding: 12px 16px;
   text-align: center;
   border: 1px solid #E0E0E0;
}

.p-service-price__table th {
   font-size: var(--fs-18-20);
}

.p-service-price__table td {
   font-size: var(--fs-18-20);
}

/* 左列（項目）：薄青 */
.p-service-price__table th:first-child,
.p-service-price__table td:first-child {
   background-color: #D8F0FF;
   font-weight: bold;
   color: var(--color-text-main);
}

/* 右列（金額・内容）：白 */
.p-service-price__table th:last-child,
.p-service-price__table td:last-child {
   background-color: #FFFFFF;
}

.p-service-price__table-highlight {
   font-weight: bold;
   color: var(--color-text-main);
}

.p-service-price__table-highlight--blue {
   color: #5196D9;
   font-weight: bold;
}

.p-service-price__sim-note {
   font-size: clamp(11px, 0.8rem, 13px);
   color: #888;
   line-height: 1.6;
}


/* ==========================================================================
   Platform Section (02 ライモBizプラットフォーム)
   ========================================================================== */
/* style.css */

/* ==========================================================================
   Platform Section (02 ライモBizプラットフォーム)
   ========================================================================== */

.p-platform {
   padding: clamp(60px, 8vw, 0px) 0 0;
}

/* ---- ヒーローエリア (上部ヘッダー) ---------------------------------------- */
.p-platform__hero {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: clamp(40px, 5vw, 100px);
   margin-bottom: clamp(60px, 8vw, 120px);
}

@media (max-width: 1024px) {
   .p-platform__hero {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-platform__hero-body {
   flex: 1;
}

.p-platform__title-area {
   display: flex;
   align-items: flex-start;
   gap: 20px;
   margin-bottom: 24px;
}

.p-platform__number {
   font-family: var(--font-en, sans-serif);
   font-size: clamp(80px, 10vw, 140px);
   font-weight: bold;
   color: #D8F0FF;
   line-height: 0.8;
   letter-spacing: -0.02em;
}

.p-platform__title {
   font-weight: bold;
   line-height: 1.4;
   margin-bottom: 8px;
}

.p-platform__note {
   font-size: 12px;
   color: #666;
}

.p-service-gradient-tag {
   display: inline-block;
   background: linear-gradient(90deg, #447FD5 0%, #6051A6 100%);
   color: #fff;
   font-weight: bold;
   font-size: var(--fs-18-20);
   padding: 14px 40px;
   border-top-left-radius: 12px;
   border-bottom-right-radius: 12px;
   margin-bottom: 30px;
}

.p-platform__lead-text {
   font-size: var(--fs-16-18);
   line-height: 1.8;
   color: var(--color-text-main);
}

.p-platform__hero-img {
   flex: 0 0 clamp(300px, 46%, 640px);
   border-radius: 49px 0 0 0;
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

@media (max-width: 1024px) {
   .p-platform__hero-img {
      flex: none;
      width: 100%;
   }
}

/* ---- プログラムコンセプト (背景グレーセクション) ---------------------------------------- */
.p-platform__concept {
   background-color: #F5F5F5;
   padding: clamp(80px, 10vw, 140px) 0;
   position: relative;
   overflow: hidden;
}

.p-platform__concept-en-bg {
   position: absolute;
   top: -0.5em;
   left: 120px;
   font-family: "din-condensed", sans-serif;
   font-size: clamp(94px, 4.685rem + 4.43vw, 160px);
   color: #fff;
   line-height: 1;
   z-index: -10;
   pointer-events: none;
}

.p-platform__concept .l-inner {
   position: relative;
   z-index: 1;
}

.p-platform__concept-head {
   display: flex;
   align-items: center;
   gap: 30px;
   margin-bottom: clamp(40px, 5vw, 60px);
}

.p-platform__concept-title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   white-space: nowrap;
}

.p-platform__concept-line {
   flex: 1;
   height: 1px;
   background-color: #CCC;
}

.p-platform__concept-body {
   display: flex;
   justify-content: space-between;
   gap: clamp(40px, 6vw, 100px);
}

@media (max-width: 1024px) {
   .p-platform__concept-body {
      flex-direction: column-reverse;
   }
}

.p-platform__concept-text {
   flex: 1;
}

.p-platform__concept-lead {
   font-size: var(--fs-16-18);
   line-height: 1.8;
   color: var(--color-text-main);
   margin-bottom: 40px;
}

.p-platform__concept-img {
   flex: 0 0 clamp(280px, 38%, 480px);
   border-radius: 52px 0 53px 0;
   overflow: hidden;
}

@media (max-width: 1024px) {
   .p-platform__concept-img {
      flex: none;
      width: 100%;
   }
}

/* フィーチャーリスト */
.p-platform__features {
   display: flex;
   flex-direction: column;
   gap: 24px;
}

.p-platform__feature {
   display: flex;
   align-items: flex-start;
   gap: 20px;
}


.p-platform__feature-icon {
   flex: 0 0 44px;
   width: 44px;
   height: 44px;
   border-radius: 50%;
   background: var(--color-primary);
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 10px;
}

.p-platform__feature-icon img {
   width: 100%;
   height: auto;
   filter: brightness(0) invert(1);
}

.p-platform__feature-body {
   flex: 1;
}

.p-platform__feature-title {
   font-size: var(--fs-18-24);
   font-weight: bold;
   color: var(--color-primary);
   margin-bottom: 4px;
}

.p-platform__feature-text {
   font-size: var(--fs-18-20);
   line-height: 1.7;
   color: var(--color-text-sub, #666);
}

/* ==========================================================================
   5つのサービス
   ========================================================================== */
/* style.css L3466-L3563 */
.p-platform-services {
   background-color: #F5F5F5;
   padding: clamp(80px, 10vw, 140px) 0;
}

.p-platform-services__title {
   font-weight: bold;
   text-align: center;
   margin-bottom: clamp(50px, 6vw, 80px);
   color: var(--color-text-main);
}

.p-platform-services__grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: clamp(20px, 2.5vw, 30px);
   align-items: start;
}

/* style.css L3486 付近〜 */

/* 装飾画像を疑似要素で配置 */
.p-platform-services__grid::before {
   content: "";
   display: block;
   grid-column: 1;
   grid-row: 2;
   background-image: url("../images/service/pic_five_2x.webp");
   background-size: cover;
   background-position: center;
   border-radius: 40px;
   aspect-ratio: 4 / 3;
   z-index: 10;
   /* margin-left: calc(50% - 50vw); */

}


/* 既存の .p-platform-services__deco-img スタイルは削除 */


/* カード共通スタイル */
.p-platform-card {
   background-color: #fff;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
   height: 100%;
   display: flex;
   flex-direction: column;
}

.p-platform-card__head {
   background: linear-gradient(90deg, #447FD5 0%, #6051A6 100%);
   display: flex;
   align-items: center;
   gap: 15px;
   padding: 20px 24px;
   border-bottom-right-radius: 40px;
   /* 画像のような特徴的な角丸 */
}

.p-platform-card__icon {
   flex: 0 0 40px;
   width: 40px;
   height: 40px;
}

.p-platform-card__icon img {
   width: 100%;
   height: auto;
   filter: brightness(0) invert(1);
}

.p-platform-card__title {
   font-size: 18px;
   font-weight: bold;
   color: #fff;
   white-space: nowrap;
}

.p-platform-card__body {
   padding: 24px 24px 30px;
   flex: 1;
}

.p-platform-card__verb {
   font-size: 15px;
   font-weight: bold;
   color: #4489D5;
   /* キャッチコピーの青色 */
   margin-bottom: 16px;
   line-height: 1.5;
}

.p-platform-card__list {
   list-style: none;
   padding: 0;
}

.p-platform-card__list li {
   position: relative;
   font-size: 14px;
   line-height: 1.7;
   color: #444;
   padding-left: 28px;
}

.p-platform-card__list li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 4px;
   width: 18px;
   height: 18px;
   background-image: url("../images/common/icon_check.svg");
   background-size: contain;
   background-repeat: no-repeat;
}


/* ==========================================================================
   導入前後の比較
   ========================================================================== */
.p-platform-compare {
   background-color: #F5F5F5;
   padding-bottom: 60px;
}

.p-platform-compare__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   text-align: center;
   margin-bottom: clamp(24px, 3vw, 40px);
}

.p-platform-compare__table-wrap {
   overflow-x: auto;
   padding-bottom: 20px;
}

.p-platform-compare__table {
   width: 100%;
   border-collapse: separate;
   /* セルを分離させる */
   border-spacing: 8px 10px;
   /* カラム間と行間の余白 */
   min-width: 600px;
}

.p-platform-compare__table th,
.p-platform-compare__table td {
   padding: 24px 32px;
   font-size: var(--fs-18-24);
   text-align: center;
   border: none;
   vertical-align: middle;
}

/* ヘッダー行 */
.p-platform-compare__th--item,
.p-platform-compare__th--before {
   background-color: #4489D5;
   /* メインブルー */
   color: #fff;
   width: 25%;
   font-weight: bold;
}

.p-platform-compare__th--after {
   background: linear-gradient(90deg, #447FD5, #6051A6);
   /* グラデーション */
   color: #fff;
   width: 40%;
   font-weight: bold;
}

/* 行ラベル (業務領域) */
.p-platform-compare__row-label {
   background-color: #E6F4FF;
   /* 薄いブルー */
   color: #333;
   font-weight: bold;
}

/* 従来の方法セル */
.p-platform-compare__td--before {
   background-color: #fff;
   color: #666;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02);
   /* かすかな影で立体感を出す */
}

/* プラットフォーム導入後セル */
.p-platform-compare__td--after {
   background-color: #E2DAFF;
   /* 薄いパープル */
   font-weight: bold;
   color: #333;
}

/* モバイル対応：スクロール時のヒント */
@media (max-width: 768px) {
   .p-platform-compare__table {
      border-spacing: 4px 6px;
   }

   .p-platform-compare__table th,
   .p-platform-compare__table td {
      padding: 12px 10px;
      font-size: 13px;
   }
}


/* ==========================================================================
   利用料金（プラットフォーム）
   ========================================================================== */
.p-platform-price {
   padding: clamp(50px, 6vw, 80px) 0;
}

.p-platform-price__wrap {
   display: flex;
   align-items: center;
   gap: clamp(30px, 5vw, 80px);
}

@media (max-width: 1024px) {
   .p-platform-price__wrap {
      flex-direction: column;
   }
}

.p-platform-price__text-area {
   flex: 1;
   position: relative;
}

.p-platform-price__en-bg {
   position: absolute;
   top: -0.4em;
   left: 50%;

   transform: translateX(-50%);
   font-family: "din-condensed", sans-serif;
   font-size: clamp(100px, 13vw, 220px);
   color: #D8F0FF;
   white-space: nowrap;
   line-height: 1;
   pointer-events: none;
   z-index: 0;
}

.p-platform-price__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   text-align: center;
   position: relative;
   z-index: 1;
   margin-bottom: 16px;
}

.p-platform-price__lead {
   line-height: 1.8;
   color: var(--color-text-main);
   font-weight: bold;
   margin-bottom: 24px;
   position: relative;
   z-index: 1;
}

.p-platform-price__card {
   position: relative;
   z-index: 1;
   border: 1px solid #D8D8D8;
   padding: clamp(20px, 3vw, 32px);
}

.p-platform-price__card-label {
   background: linear-gradient(90deg, #447FD5 0%, #6051A6 100%);
   color: #fff;
   font-weight: bold;
   font-size: clamp(14px, 1rem, 16px);
   text-align: center;
   padding: 14px 20px;
   margin-bottom: 20px;
}

.p-platform-price__amount-wrap {
   display: flex;
   align-items: baseline;
   gap: 4px;
   margin-bottom: 10px;
}

.p-platform-price__amount-unit {
   font-size: clamp(13px, 0.9rem, 15px);
   color: var(--color-text-main);
}

.p-platform-price__amount-num {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(56px, 8vw, 90px);
   font-weight: bold;
   color: var(--color-primary);
   line-height: 1;
}

.p-platform-price__amount-suffix {
   font-size: clamp(18px, 1.4rem, 22px);
   font-weight: bold;
   color: var(--color-primary);
}

.p-platform-price__amount-tax {
   font-size: clamp(12px, 0.85rem, 14px);
   font-weight: normal;
   color: var(--color-primary);
}

.p-platform-price__trial {
   font-size: clamp(12px, 0.85rem, 14px);
   color: #666;
   margin-bottom: 20px;
   text-align: center;
}

.p-platform-price__btn-wrap {
   text-align: center;
}

.p-platform-price__note {
   font-size: clamp(11px, 0.8rem, 13px);
   color: #888;
   line-height: 1.7;
   margin-top: 16px;
}

.p-platform-price__img {
   flex: 0 0 clamp(200px, 42%, 480px);
   border-radius: 12px;
   overflow: hidden;
}

@media (max-width: 1024px) {
   .p-platform-price__img {
      flex: none;
      width: 100%;
   }
}




/* --------------------------------------------------------------------------
   Service Support Area (Subsidy Specific)
   -------------------------------------------------------------------------- */

.p-service-support {
   position: relative;
   padding: 60px 0;
}

.p-service-support__en-bg {
   position: absolute;
   top: 0;
   left: 0;
   font-size: clamp(75px, 2.79rem + 7.05vw, 180px);
   opacity: 0.04;
   color: #000;
   z-index: 0;
   pointer-events: none;
}

.p-service-support__head {
   position: relative;
   z-index: 1;
   display: flex;
   align-items: center;
   gap: 25px;
   margin-bottom: 40px;
}

.p-service-support__title {
   font-size: clamp(20px, 1.25rem + 0.5vw, 28px);
   font-weight: bold;
   white-space: nowrap;
}

.p-service-support__line {
   flex-grow: 1;
   height: 1px;
   background-color: var(--color-text-main);
   opacity: 0.3;
}

.p-service-support__content-wrap {
   display: flex;
   align-items: flex-start;
   gap: clamp(30px, 2rem + 3vw, 80px);
}

@media (max-width: 1024px) {
   .p-service-support__content-wrap {
      flex-direction: column;
   }
}

.p-service-support__content {
   flex: 1;
}

.p-service-support__lead {
   font-size: 16px;
   line-height: 1.8;
   margin-bottom: 30px;
}

.p-service-support__sub-title {
   font-size: 24px;
   font-weight: bold;
   margin-bottom: 25px;
}

/* 費用ボックスのデザイン */
.p-service-support__price-box {
   border: 3px solid #4489D5;
   border-radius: 8px;
   overflow: hidden;
   max-width: 420px;
   margin-bottom: 30px;
}

.p-service-support__price-head {
   background-color: #4489D5;
   color: var(--color-white);
   text-align: center;
   padding: 10px;
   font-weight: bold;
   font-size: 16px;
}

.p-service-support__price-body {
   background-color: var(--color-white);
   padding: 20px;
   display: flex;
   align-items: baseline;
   justify-content: center;
   gap: 10px;
}

.p-service-support__price-body .label {
   font-weight: bold;
   color: var(--color-primary);
   font-size: 18px;
}

.p-service-support__price-body .price {
   font-family: "din-condensed", sans-serif;
   font-size: 48px;
   color: var(--color-primary);
   line-height: 1;
}

.p-service-support__price-body .price small {
   font-family: var(--font-ja);
   font-size: 18px;
   margin-left: 2px;
}

.p-service-support__price-body .note {
   font-size: 11px;
   color: #666;
}

/* 特徴リスト */
.p-service-support__list {
   list-style: none;
   padding: 0;
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.p-service-support__list li {
   position: relative;
   padding-left: 35px;
   font-size: 15px;
   font-weight: bold;
   color: var(--color-primary);
   line-height: 24px;
}

.p-service-support__list li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 24px;
   height: 24px;
   background-color: var(--color-primary);
   border-radius: 50%;
}

.p-service-support__list li::after {
   content: "";
   position: absolute;
   left: 7px;
   top: 4px;
   width: 10px;
   height: 16px;
   border-bottom: 2px solid #fff;
   border-right: 2px solid #fff;
   transform: rotate(45deg);
}

.p-service-support__img {
   flex: 0 0 clamp(300px, 42%, 680px);
   border-radius: 0 0 40px 40px;
   /* 下側の角丸 */
   overflow: hidden;
}

/* --------------------------------------------------------------------------
   Service Benefits Area
   -------------------------------------------------------------------------- */
.p-service-benefits {
   margin-top: clamp(80px, 8vw, 120px);
}

.p-service-benefits__container {
   display: flex;
   flex-direction: row-reverse;
   /* 画像を左に配置 */
   align-items: center;
   gap: clamp(30px, 2rem + 4vw, 100px);
}

@media (max-width: 1024px) {
   .p-service-benefits__container {
      flex-direction: column;
   }
}

.p-service-benefits__img {
   flex: 0 0 50%;
   border-radius: 0 40px 40px 0;
   /* 右側の角丸 */
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

@media (max-width: 1024px) {
   .p-service-benefits__img {
      width: 100%;
      border-radius: 0 20px 20px 0;
   }
}

.p-service-benefits__content {
   flex: 1;
}

.p-service-benefits__title {
   font-size: 24px;
   font-weight: bold;
   color: var(--color-text-main);
   margin-bottom: 30px;
}

.p-service-benefits__list {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

.p-service-benefits__item {
   display: flex;
   border: 1px solid #CCC;
   background-color: var(--color-white);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.p-service-benefits__item:hover {
   transform: translateX(-5px);
   /* 左に配置しているので左に動かす */
   box-shadow: -5px 5px 15px rgba(21, 142, 219, 0.08);
}

.p-service-benefits__item-icon {
   flex: 0 0 80px;
   background: linear-gradient(135deg, #447FD5 0%, #6051A6 100%);
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 15px;
}

.p-service-benefits__item-icon img {
   width: 40px;
   height: auto;
   filter: brightness(0) invert(1);
}

.p-service-benefits__item-body {
   padding: 15px 25px;
   flex: 1;
}

.p-service-benefits__item-title {
   font-size: 18px;
   font-weight: bold;
   color: #333;
}

.p-service-benefits__item-text {
   font-size: 14px;
   color: #666;
   margin-top: 5px;
   line-height: 1.6;
}

/* ==========================================================================
   Contact Page Specific Styles
   ========================================================================== */

/**
 * Contact Form Section
 */
.p-contact-form {
   position: relative;
   background-color: var(--color-white);
}

.p-contact-form__head {
   text-align: center;
   /* margin-bottom: clamp(60px, 4rem + 5vw, 120px); */
}

.p-contact-form__title-wrap {
   position: relative;
   display: inline-block;
   /* margin-bottom: 30px; */
}

.p-contact-form__en-bg {
   font-size: clamp(80px, 5rem + 15vw, 240px);
   color: #D8F0FF;
   line-height: 0.8;
   letter-spacing: 0.02em;
}

.p-contact-form__title {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   font-size: 32px;
   font-weight: bold;
   white-space: nowrap;
   letter-spacing: 0.1em;
   margin-top: 0.25em;
}

.p-contact-form__lead {
   max-width: 800px;
   margin: 0 auto;
   line-height: 1.8;
   font-size: 18px;
   text-align-last: left;
   padding: 15px;
   margin-bottom: 30px;
}

/**
 * Form Container
 */
.p-contact-form__container-wrap {
   width: 100%;
   background-color: var(--color-bg-light);
}


.p-contact-form__container {
   max-width: 1100px;
   margin: 0 auto;
   padding: clamp(40px, 3rem + 5vw, 100px) clamp(20px, 1.25rem + 5vw, 90px);
   /* 薄いグレーの背景 */
   position: relative;
}

.p-contact-form__form-head {
   position: relative;
   margin-bottom: clamp(40px, 2.5rem + 3vw, 80px);
}

.p-contact-form__form-en-bg {
   font-size: clamp(100px, 6rem + 10vw, 180px);
   color: var(--color-white);
   line-height: 0.8;
   position: absolute;
   top: -0.4em;
   left: -0.2em;
   opacity: 1;
   /* 背景が白なので馴染ませる */
}

.p-contact-form__form-title {
   position: relative;
   font-size: 24px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 20px;
   z-index: 1;
}

.p-contact-form__form-title::after {
   content: "";
   flex: 1;
   height: 1px;
   background-color: var(--color-border);
}

/**
 * Form Parts
 */
.p-form__item {
   display: flex;
   padding: 40px 0;
   border-bottom: 1px dashed var(--color-border);
   gap: 40px;
   /* 【重要】ラベルとフィールドの間の余白を40pxに設定 */
}

@media (max-width: 768px) {
   .p-form__item {
      flex-direction: column;
      gap: 15px;
      padding: 30px 0;
   }
}

.p-form__label {
   width: 240px;
   /* ラベルの幅を少し縮小してバランスを調整 */
   font-size: 18px;
   font-weight: bold;
   padding-top: 15px;
   text-align: right;
   /* 【重要】テキストを右寄せに */
}

@media (max-width: 768px) {
   .p-form__label {
      width: 100%;
      padding-top: 0;
      text-align: left;
      /* スマホでは左寄せに戻す */
   }
}

.p-form__required {
   color: var(--color-red);
   margin-left: 5px;
   font-size: 14px;
}

.p-form__field {
   flex: 1;
}

/* (input, textarea のスタイルは変更なし) */
.p-form__input,
.p-form__textarea {
   width: 100%;
   padding: 18px 25px;
   background-color: var(--color-white);
   border: 1px solid var(--color-border);
   border-radius: 10px;
   font-size: 18px;
   transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/**
 * Custom Radio (ラジオボタンの修正)
 */
.p-form__radio-group {
   display: flex;
   flex-direction: column;
   gap: 20px;
   /* 項目間の間隔を広めに設定 */
}

.p-form__radio {
   display: flex;
   align-items: center;
   cursor: pointer;
   font-size: 18px;
}

.p-form__radio input {
   display: none;
   /* デフォルトのラジオボタンを隠す */
}

.p-form__radio span {
   position: relative;
   padding-left: 45px;
   /* 大きな円に合わせて余白を確保 */
}

/* 外側の円 */
.p-form__radio span::before {
   content: "";
   position: absolute;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
   width: 32px;
   /* デザインに合わせて大きく */
   height: 32px;
   border: 1px solid var(--color-primary);
   border-radius: 50%;
   background-color: var(--color-white);
}

/* チェック時のマーク (チェックアイコン) */
.p-form__radio input:checked+span::after {
   content: "";
   position: absolute;
   left: 6px;
   /* 32pxの円の中央に来るよう調整 */
   top: 50%;
   transform: translateY(-50%);
   width: 20px;
   /* チェックマークのサイズ */
   height: 20px;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23158EDB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
}

.p-form__list {
   padding-bottom: 30px;
}

.p-form__agree {
   text-align: center;
}

/**
 * Submit Button
 */
.p-form__submit {
   margin-top: 50px;
   text-align: center;
}

.p-form__submit .c-btn--blue {
   min-width: 380px;
   border-radius: 100px;
   /* 画像に合わせた丸みの強いボタン */
   font-size: 20px;
   background: linear-gradient(135deg, #4A90E2 0%, #6051A6 100%);
   /* 画像に寄せたグラデーション */
   padding: 8px 32px;
   color: #fff;
   font-weight: bold;
   border: none;
}

@media (max-width: 430px) {
   .p-form__submit .c-btn {
      min-width: 100%;
   }
}

/* ==========================================================================
   Terms of Use Page (.p-terms)
   ========================================================================== */

/**
 * ヒーローエリアの個別調整
 */
.p-lower-hero--terms {
   background-color: #000;
}

.p-lower-hero--terms .p-lower-hero__en-bg {
   /* opacity: 0.15; */
   /* text-transform: capitalize; */
   /* 最初の文字を大文字に */
}

/* 中央のバッジ位置調整 */
.p-lower-hero--terms .p-lower-hero__content {
   text-align: left;
   margin-bottom: 20px;
}

.p-lower-hero__badge {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   font-size: clamp(14px, 1rem, 20px);
   font-weight: bold;
   padding: 0.8em 2.5em;
   border-radius: 100px;
}

/**
 * メインタイトルエリア
 */
.p-terms__head {
   text-align: center;
   margin-bottom: 60px;
}

.p-terms__main-title {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: center;
}

/* 背後の巨大水色テキスト */
.p-terms__main-title .en {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(60px, 4rem + 8vw, 160px);
   color: #D8F0FF;
   line-height: 1;
   letter-spacing: 0.02em;
}

/* 手前の日本語 */
.p-terms__main-title .ja {
   font-size: clamp(24px, 1.5rem + 1vw, 32px);
   font-weight: bold;
   color: var(--color-text-main);
   margin-top: -0.6em;
   /* 隙間を詰める */
   letter-spacing: 0.25em;
   position: relative;
   z-index: 1;
}

/**
 * メタ情報の右寄せ
 */
.p-terms__meta {
   text-align: right;
   font-size: 14px;
   line-height: 1.8;
   margin-bottom: 60px;
}

@media (max-width: 768px) {
   .p-terms__meta {
      text-align: left;
      margin-bottom: 40px;
   }
}

/**
 * 本文・条文スタイル
 */
.p-terms__intro {
   margin-bottom: 80px;
   font-weight: 500;
}

.p-terms__item {
   margin-bottom: 80px;
}

/* 条文タイトル（青色の太い左バー） */
.p-terms__item-title {
   font-size: var(--fs-20-30);
   color: var(--color-primary);
   padding-left: 15px;
   margin-bottom: 30px;
   border-left: 6px solid var(--color-primary);
   line-height: 1.4;
}

/* .p-terms__item-title::before {
   content: "";
   display: block;
   width: 3px;
   height: 100%;
   background-color: var(--color-primary);
} */
.p-terms__item-title::after {
   content: "";
   display: block;
   margin-top: 16px;
   width: 100%;
   height: 1px;
   background-color: var(--color-border);
}

/**
 * リスト構造
 */

.p-terms__item-content {
   padding-left: 24px;
}

.p-terms__list {
   list-style: none;
   padding-left: 0;
   counter-reset: term-counter;
}

.p-terms__list>li {
   position: relative;
   padding-left: 1.8em;
   margin-bottom: 1.5em;
   line-height: 1.8;
   color: var(--color-text-main);
   font-size: var(--fs-18-20);
}

.p-terms__list>li::before {
   counter-increment: term-counter;
   content: counter(term-counter) ".";
   position: absolute;
   left: 0;
   top: 0;
   font-weight: bold;
   color: var(--color-primary);
   /* 数字を青く */
}

/* 子リスト（ローマ数字 i, ii, iii） */
.p-terms__sub-list {
   margin-top: 1em;
   list-style: none;
   padding-left: 0;
   counter-reset: roman-counter;
}

.p-terms__sub-list.roman>li {
   position: relative;
   padding-left: 1.8em;
   margin-bottom: 0.5em;
}

.p-terms__sub-list.roman>li::before {
   counter-increment: roman-counter;
   content: counter(roman-counter, lower-roman) ".";
   position: absolute;
   left: 0;
   top: 0;
   font-weight: normal;
   color: var(--color-primary);
   /* ローマ数字を青く */
}

/* ==========================================================================
   Partners Page Specific Styles
   ========================================================================== */

/**
 * Hero Modifier for Partners
 */
.p-lower-hero--partners {
   background-color: #f7f7f7;
   /* 画像がない場合のバックアップ */
}

/* 共通の下層ヒーローの巨大英字位置調整などは既存クラスを利用 */

/**
 * Partners Intro Section
 */
.p-partners-intro {
   padding-bottom: 0;
}

.p-partners-intro__head {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
}

.p-partners-intro__main-title {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-bottom: 30px;
}

.p-partners-intro__main-title .en {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(80px, 4rem + 10vw, 200px);
   color: #D8F0FF;
   line-height: 1;
}

.p-partners-intro__main-title .ja {
   font-size: 20px;
   font-weight: bold;
   color: var(--color-text-main);
   margin-top: -0.5em;
   letter-spacing: 0.2em;
}

.p-partners-intro__text {
   /* max-width: 800px; を削除、または広げる */
   max-width: 1000px;
   /* 少し余裕をもたせ、2行〜3行程度に収まるように調整 */
   margin-right: auto;
   margin-left: auto;
   line-height: 1.8;
}

/**
 * Partners Business Model Section
 */
.p-partners-model__content-wrap {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: clamp(40px, 2rem + 4vw, 100px);
   margin-bottom: 60px;
}

@media (max-width: 768px) {
   .p-partners-model__content-wrap {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-partners-model__content {
   flex: 1;
}

.p-partners-model__title-area {
   position: relative;
   margin-bottom: 30px;
}

.p-partners-model__en-bg {
   position: absolute;
   top: -0.5em;
   left: -0.1em;
   font-size: clamp(60px, 3rem + 5vw, 120px);
   color: #D8F0FF;
   white-space: nowrap;
}

.p-partners-model__title {
   position: relative;
   font-size: 24px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 15px;
}



.p-partners-model__subtitle {
   font-size: clamp(24px, 1.5rem + 1vw, 36px);
   font-weight: bold;
   margin-bottom: 20px;
   line-height: 1.3;
}

.p-partners-model__text {
   line-height: 1.8;
}

.p-partners-model__img {
   flex: 1.2;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* Cards Area */
.p-partners-model__cards {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 30px;
}

@media (max-width: 960px) {
   .p-partners-model__cards {
      grid-template-columns: 1fr;
   }
}

.p-partners-model__card {
   background-color: #fff;
   border: 1px solid #EAEAEA;
   border-radius: 12px;
   padding: 40px 30px;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   position: relative;
}

.p-partners-model__card:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 40px rgba(21, 142, 219, 0.1);
}

.p-partners-model__card-icon {
   width: 80px;
   height: 80px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 25px;
   /* アイコンがはみ出すデザインにする場合のアジャスト */
   position: absolute;
   top: 0;
   left: 0;
   transform: translate(-30%, -30%);
}

.p-partners-model__card-icon img {
   width: 40px;
}

.p-partners-model__card-icon--blue {
   background-color: var(--color-primary);
}

.p-partners-model__card-icon--blue-gradient {
   background: linear-gradient(135deg, #158EDB 0%, #3B61BC 100%);
}

.p-partners-model__card-icon--purple-gradient {
   background: linear-gradient(135deg, #6051A6 0%, #4D3F91 100%);
}

.p-partners-model__card-body {
   width: 100%;
}

.p-partners-model__card-title {
   font-size: 20px;
   font-weight: bold;
   color: var(--color-primary);
   margin-bottom: 20px;
   display: flex;
   /* flex-direction: column; */
}

.p-partners-model__card-title small {
   font-size: 14px;
   color: var(--color-text-main);
   font-weight: normal;
   margin-top: 5px;
}

.p-partners-model__card-list {
   text-align: left;
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.p-partners-model__card-list li {
   font-size: 15px;
   padding-left: 28px;
   position: relative;
   line-height: 1.4;
}

.p-partners-model__card-list li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 20px;
   height: 20px;
   background-image: url("../images/common/icon-check-blue-circle.svg");
   background-repeat: no-repeat;
   background-size: contain;
}

/**
 * Partners Details Section
 */
.p-partners-details__head {
   margin-bottom: 32px;
}

.p-partners-details__title-area {
   position: relative;
   margin-bottom: 30px;
}

.p-partners-details__en-bg {
   position: absolute;
   top: -0.5em;
   left: -0.1em;
   font-size: clamp(60px, 3rem + 5vw, 120px);
   color: #D8F0FF;
}

.p-partners-details__title {
   position: relative;
   font-size: 24px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 15px;
}

.p-partners-details__title::after {
   content: "";
   display: block;
   width: 60px;
   height: 1px;
   background-color: var(--color-border);
}

.p-partners-details__lead {
   font-size: 18px;
}

.p-partners-details__blocks {
   display: flex;
   flex-direction: column;
   gap: 80px;
}

.p-partners-details__block {
   display: flex;
   overflow: hidden;
}

@media (max-width: 960px) {
   .p-partners-details__block {
      flex-direction: column;
   }
}

.p-partners-details__block-content {
   flex: 1;
   padding: 60px clamp(30px, 2rem + 5vw, 80px);
}

.p-partners-details__block-name {
   font-size: 24px;
   font-weight: bold;
   margin-bottom: 15px;
}

.p-partners-details__block-badge {
   display: inline-block;
   background: linear-gradient(90deg, #5D8FD8 0%, #6051A6 100%);
   color: #fff;
   padding: 10px 30px;
   border-radius: 6px;
   font-weight: bold;
   margin-bottom: 25px;
}

.p-partners-details__block-text {
   line-height: 1.8;
   margin-bottom: 30px;
   font-size: var(--fs-18-24);
}

.p-partners-details__benefit-title {
   font-size: var(--fs-18-24);
   font-weight: bold;
   margin-bottom: 15px;
   padding-bottom: 10px;
}

.p-partners-details__benefit-list {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

.p-partners-details__benefit-list li {
   font-size: var(--fs-18-24);
   padding-left: 28px;
   position: relative;
}

.p-partners-details__benefit-list li::before {
   content: "";
   background-image: url('../images/common/icon_check.svg');
   background-size: contain;
   background-repeat: no-repeat;
   position: absolute;
   left: 0;
   top: 50%;
   /* 中央寄せの起点 */
   transform: translateY(-50%);
   /* 垂直中央に配置 */
   width: 20px;
   height: 20px;
   display: block;
}

.p-partners-details__block-img {
   flex: 1;
}

.p-partners-details__block-img img {
   height: 100%;
   object-fit: cover;
}

/* ==========================================================================
   Partners Page - Business Model Section
   ========================================================================== */

.p-partners-model {
   position: relative;
   padding-top: clamp(80px, 5rem + 10vw, 160px);
}

.p-partners-model__top {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: clamp(40px, 2rem + 5vw, 100px);
   margin-bottom: clamp(60px, 4rem + 5vw, 120px);
}

@media (max-width: 768px) {
   .p-partners-model__top {
      flex-direction: column;
      align-items: flex-start;
   }
}

.p-partners-model__content {
   flex: 1;
   position: relative;
   z-index: 2;
}

.p-partners-model__head {
   position: relative;
   margin-bottom: 30px;
}

/* 背景テキスト */
.p-partners-model__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.1em;
   font-size: clamp(80px, 5rem + 8vw, 180px);
   line-height: 0.85;
   color: #D8F0FF;
   z-index: -1;
   white-space: nowrap;
}

.p-partners-model__label {
   display: flex;
   align-items: center;
   gap: 15px;
   margin-bottom: 15px;
}

.p-partners-model__label-text {
   font-size: 18px;
   font-weight: bold;
   color: var(--color-text-main);
}

.p-partners-model__label-line {
   flex-grow: 0;
   width: clamp(40px, 2.5rem + 2vw, 80px);
   height: 1px;
   background-color: var(--color-border);
}

.p-partners-model__title {
   font-size: clamp(28px, 1.75rem + 1.5vw, 48px);
   font-weight: bold;
   line-height: 1.2;
   letter-spacing: 0.02em;
}

.p-partners-model__text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   color: #666;
   /* 少し落とした黒で可読性を向上 */
}

.p-partners-model__image {
   flex: 1;
   max-width: 760px;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

.p-partners-model__image img {
   width: 100%;
   height: auto;
   display: block;
   transition: transform 0.6s cubic-bezier(0.33, 1, 0.68, 1);
}

.p-partners-model:hover .p-partners-model__image img {
   transform: scale(1.05);
}

/* ==========================================================================
   Partners Page - Business Model Section (Fixed)
   ========================================================================== */

.p-partners-model__cards {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: clamp(40px, 2rem + 2vw, 60px);
   margin-top: 60px;
   padding-left: 40px;
   /* アイコンのはみ出し分を確保 */
}

@media (max-width: 1200px) {
   .p-partners-model__cards {
      grid-template-columns: 1fr;
      padding-left: 33px;
      /* アイコン半径分 */
      max-width: 600px;
      margin-left: auto;
      margin-right: auto;
   }
}

.p-partners-model__card {
   position: relative;
   background-color: #fff;
   border: 1px solid var(--color-primary);
   padding: 40px 40px 40px 60px;
   /* 左側にアイコン用の余白 */
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   text-align: left;
   transition: all 0.4s ease;
}

/* カードごとのボーラーカラー設定 */
.p-partners-model__card--client {
   border-color: #A3D8FF;
}

.p-partners-model__card--partner {
   border-color: #A3D8FF;
}

.p-partners-model__card--raimo {
   border-color: #D3CEF0;
}

.p-partners-model__card:hover {
   transform: translateX(5px);
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.p-partners-model__card-icon {
   position: absolute;
   left: 0;
   top: 50%;
   transform: translate(-50%, -50%);
   /* 枠線の左端中央に配置 */
   width: 66px;
   height: 66px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 10;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.p-partners-model__card--client .p-partners-model__card-icon {
   background: #158EDB;
}

.p-partners-model__card--partner .p-partners-model__card-icon {
   background: #3B61BC;
}

.p-partners-model__card--raimo .p-partners-model__card-icon {
   background: #6051A6;
}

.p-partners-model__card-icon img {
   width: 50%;
   height: auto;
}

.p-partners-model__card-info {
   width: 100%;
}

.p-partners-model__card-title {
   font-size: 20px;
   font-weight: bold;
   color: #158EDB;
   margin-bottom: 20px;
   display: flex;
   align-items: baseline;
   /* テキストを下揃えに */
   gap: 15px;
   flex-wrap: wrap;
}

.p-partners-model__card--raimo .p-partners-model__card-title {
   color: #6051A6;
}

.p-partners-model__card-title .sub {
   font-size: 14px;
   color: var(--color-text-main);
   font-weight: normal;
}

.p-partners-model__card-list {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

/* .p-partners-model__card-list li {
   position: relative;
   padding-left: 28px;
   font-size: 16px;
   line-height: 1.4;
   color: var(--color-text-main);
} */

.p-partners-model__card-list li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0.1em;
   width: 20px;
   height: 20px;
   background-image: url("../images/common/icon-check-blue-circle.svg");
   background-repeat: no-repeat;
   background-size: contain;
}

/* ==========================================================================
   Partners Page - Background Wrapper & Details Section
   ========================================================================== */

/* 背景エリア（Business ModelのカードからDetailsまでを包む） */
.p-partners-bg-area {
   background-color: var(--color-bg-light);

   /* 画面横幅いっぱいに広げる設定（親のl-innerを無視して端まで伸ばす） */
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - 50vw);
   padding-left: calc(50vw - 50%);
   padding-right: calc(50vw - 50%);

   margin-top: 100px;
   /* カードの上部から背景を開始させるための調整 */
   padding-bottom: clamp(80px, 5rem + 10vw, 160px);
}


.p-partners-model-cards-wrap {
   position: relative;
   top: -80px;
   /* 前のセクションに少し食い込むブロークン配置 */
   margin-bottom: 40px;
}

/* Details Section */
.p-partners-details {
   padding-top: 0;
}


.p-partners-details__title-area {
   position: relative;
   margin-bottom: 25px;
}

.p-partners-details__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.1em;
   font-size: clamp(80px, 5rem + 8vw, 180px);
   line-height: 0.85;
   color: #fff;
   z-index: 1;
   white-space: nowrap;
}

.p-partners-details__label {
   display: flex;
   align-items: center;
   gap: 15px;
   position: relative;
   z-index: 2;
}

.p-partners-details__label-text {
   font-size: var(--fs-20-30);
   font-weight: bold;
}

.p-partners-details__label-line {
   width: 60px;
   height: 1px;
   background-color: var(--color-border);
}

.p-partners-details__lead {
   font-size: var(--fs-16-18);
   color: var(--color-text-main);
}

/* Block Layout */
.p-partners-details__blocks {
   display: flex;
   flex-direction: column;
}

.p-partners-details__block {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: clamp(40px, 2rem + 5vw, 100px);
   padding-bottom: 60px;
}

.p-partners-details__block:not(:last-child) {
   border-bottom: 1px dashed #CCC;
   /* デザイン通りのダッシュ線区切り */
}

@media (max-width: 960px) {
   .p-partners-details__block {
      flex-direction: column;
      align-items: flex-start;
      gap: 40px;
      padding: 60px 0;
   }
}

.p-partners-details__block-body {
   flex: 1;
}

.p-partners-details__block-name {
   font-size: clamp(28px, 1.75rem + 1vw, 36px);
   font-weight: bold;
   margin-bottom: 20px;
}

.p-partners-details__block-badge {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: #fff;
   padding: 12px 36px;
   border-radius: 8px;
   font-weight: bold;
   font-size: 18px;
   box-shadow: 0 4px 15px rgba(21, 142, 219, 0.2);
   margin-bottom: 30px;
   width: 100%;
}



@media (max-width: 640px) {
   .p-partners-details__benefit-list {
      grid-template-columns: 1fr;
   }
}



/* Image */
.p-partners-details__block-img {
   flex: 1;
   overflow: hidden;
}

.p-partners-details__block-img img {
   width: 100%;
   height: auto;
   display: block;
}

/* ==========================================================================
   Partners Page - Support Section
   ========================================================================== */
.p-partners-support {
   margin-top: 100px;
}

.p-partners-support__head {
   text-align: center;
   margin-bottom: 60px;
   padding-bottom: 60px;
}

.p-partners-support__title-area {
   position: relative;
   display: inline-block;
   margin-bottom: 15px;
   padding-top: 60px;
}

.p-partners-support__en-bg {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   font-size: clamp(60px, 4rem + 6vw, 140px);
   color: #D8F0FF;
   white-space: nowrap;
   z-index: 1;
}

.p-partners-support__title {
   position: relative;
   z-index: 2;
   font-weight: bold;
}


.p-partners-support__list {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
}

@media (max-width: 1024px) {
   .p-partners-support__list {
      grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 640px) {
   .p-partners-support__list {
      grid-template-columns: 1fr;
   }
}

.p-partners-support__card {
   background-color: #fff;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
   position: relative;
   height: 100%;
}

.p-partners-support__badge {
   position: absolute;
   top: 0;
   left: 0;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: #fff;
   padding: 10px 20px;
   font-size: 14px;
   font-weight: bold;
   z-index: 3;
   border-bottom-right-radius: 10px;
}

.p-partners-support__img {
   aspect-ratio: 16 / 10;
   overflow: hidden;
}

.p-partners-support__img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.p-partners-support__content {
   padding: 25px 20px;
}

/* ==========================================================================
   Partners Page - Reason Section
   ========================================================================== */
.p-partners-reason {
   margin-top: 100px;
}

.p-partners-reason__head {
   margin-bottom: 60px;
}

.p-partners-reason__title-area {
   position: relative;
   margin-bottom: 25px;
}

.p-partners-reason__en-bg {
   position: absolute;
   top: -0.4em;
   left: -0.1em;
   font-size: clamp(80px, 5rem + 8vw, 180px);
   line-height: 0.85;
   color: #fff;
   z-index: 1;
   white-space: nowrap;
}

.p-partners-reason__label {
   display: flex;
   align-items: center;
   gap: 15px;
   position: relative;
   z-index: 2;
}

.p-partners-reason__label-text {
   font-size: var(--fs-20-30);
   font-weight: bold;
}

.p-partners-reason__label-line {
   width: 60px;
   height: 1px;
   background-color: var(--color-border);
}



.p-partners-reason__content {
   display: flex;
   gap: 60px;
}

@media (max-width: 960px) {
   .p-partners-reason__content {
      flex-direction: column-reverse;
      gap: 40px;
   }
}

.p-partners-reason__items {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 40px;
}

.p-partners-reason__item {
   display: flex;
   gap: 20px;
}

.p-partners-reason__item-icon {
   flex-shrink: 0;
   width: clamp(60px, 4rem + 1vw, 80px);
   height: clamp(60px, 4rem + 1vw, 80px);
   border-radius: 50%;
   background-color: var(--color-primary);
   display: flex;
   align-items: center;
   justify-content: center;
}

.p-partners-reason__item-icon img {
   width: 50%;
   height: 50%;
   object-fit: contain;
}

.p-partners-reason__item-body {
   flex: 1;
}

.p-partners-reason__item-title {
   font-size: var(--fs-18-24);
   font-weight: bold;
   margin-bottom: 10px;
}

.p-partners-reason__image {
   flex: 1;
   border-radius: 20px;
   overflow: hidden;
}

.p-partners-reason__image img {
   width: 100%;
   height: auto;
   display: block;
}

/* 背景エリアの追加調整 */
.p-partners-bg-area--bottom {
   margin-top: 0;
   /* 上部との隙間を一旦なくす */
   padding-top: 100px;
   /* カードが食い込むための余白 */
   padding-bottom: clamp(80px, 5rem + 10vw, 160px);
}

/* サポートセクションのカード配置調整 */
.p-partners-support {
   margin-top: clamp(80px, 5rem + 5vw, 120px);
}

.p-partners-support__list-wrap {
   position: relative;
   /* カードを上に持ち上げて背景を跨がせる */
   margin-top: -180px;
   margin-bottom: 80px;
   z-index: 10;
}

@media (max-width: 1024px) {
   .p-partners-support__list-wrap {
      margin-top: -140px;
   }
}

/* ==========================================================================
   Partners Page - Contact Section
   ========================================================================== */
.p-partners-contact {
   padding: clamp(80px, 5rem + 5vw, 140px) 0;
   text-align: center;
}

.p-partners-contact__head {
   max-width: 800px;
   margin-right: auto;
   margin-left: auto;
}

.p-partners-contact__title-area {
   position: relative;
   display: inline-block;
   margin-bottom: clamp(30px, 2.5rem + 3vw, 50px);
}

.p-partners-contact__en-bg {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   font-size: clamp(60px, 4.5rem + 7vw, 140px);
   color: #D8F0FF;
   white-space: nowrap;
   z-index: 1;
}

.p-partners-contact__title {
   position: relative;
   z-index: 2;
   font-weight: bold;
}

.p-partners-contact__text {
   margin-bottom: 40px;
   color: var(--color-text-main);
}

.p-partners-contact__btn-wrap {
   display: flex;
   justify-content: center;
}



/* Reason セクションとの間隔調整 */
.p-partners-reason {
   margin-top: clamp(60px, 3.75rem + 5vw, 100px);
}

/* ==========================================================================
   Case Study - Interview Section (.p-casestudy-interview)
   ========================================================================== */
.p-casestudy-interview {
   background-color: var(--color-white);
}

/* --------------------------------------------------------------------------
   Section Header
   -------------------------------------------------------------------------- */
.p-casestudy-interview__head {
   margin-bottom: clamp(40px, 3rem + 2vw, 80px);
}

.p-casestudy-interview__title-wrap {
   display: flex;
   align-items: flex-end;
   gap: 20px;
   margin-bottom: 20px;
}

.p-casestudy-interview__number {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(60px, 4rem + 5vw, 120px);
   line-height: 0.8;
   color: var(--color-primary);
   opacity: 0.2;
}

.p-casestudy-interview__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   color: var(--color-text-main);
   margin-bottom: 5px;
}

.p-casestudy-interview__title-sub {
   font-weight: bold;
   margin-left: 40px;
   color: var(--color-primary);
}

.p-casestudy-interview__lead {
   font-size: 16px;
   line-height: 1.8;
   color: var(--color-text-main);
}

/* --------------------------------------------------------------------------
   Interview Items
   -------------------------------------------------------------------------- */
.p-casestudy-interview__list {
   display: flex;
   flex-direction: column;
   gap: clamp(80px, 6rem + 5vw, 150px);
}

/* インタビューアイテム個別のスタイル */
.p-casestudy-interview__item {
   position: relative;
   z-index: 1;
   /* 背景色のあるブロックがアイテムを跨がないよう、余白を調整 */
   padding-bottom: 60px;
}

/* グレーの背景色ブロック (.p-casestudy-interview__item-top の中間から出現) */
.p-casestudy-interview__item::before {
   content: "";
   position: absolute;
   /* item-top(画像とカード) の重なり部分の中央付近から開始 */
   top: clamp(120px, 15vw, 200px);
   /* 画面の端から端まで背景色を広げる */
   left: 50%;
   transform: translateX(-50%);
   width: 100vw;
   bottom: 0;
   background-color: #F5F5F5;
   z-index: -1;
   /* コンテンツの背後に配置 */
}

/* スマホ用の調整 */
@media (max-width: 768px) {
   .p-casestudy-interview__item::before {
      /* スマホでは画像の下部付近から開始 */
      top: 200px;
   }

   .p-casestudy-interview__item {
      padding-bottom: 0;
   }
}


/* Top Area (Background Image & Info Card) */
.p-casestudy-interview__item-top {
   position: relative;
   display: flex;
   align-items: center;
   margin-bottom: 40px;
}

.p-casestudy-interview__item-bg {
   width: 80%;
   margin-left: auto;
   /* aspect-ratio: 16 / 9; */
   overflow: hidden;
}

.p-casestudy-interview__item-bg img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.p-casestudy-interview__info-card {
   position: absolute;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
   background-color: var(--color-white);
   padding: 40px;
   width: 45%;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
   z-index: 2;
}

.p-casestudy-interview__info-company {
   display: flex;
   flex-direction: column;
   gap: 5px;
   margin-bottom: 15px;
}

.p-casestudy-interview__industry {
   font-size: 24px;
   font-weight: bold;
   color: var(--color-text-main);
}

.p-casestudy-interview__employees {
   font-size: 14px;
   color: #666;
}

.p-casestudy-interview__info-person {
   font-size: 20px;
   font-weight: bold;
   color: var(--color-text-main);
}

.p-casestudy-interview__info-person .name {
   font-size: 1.2em;
   margin-left: 0.5em;
}

/* Catchphrase Bar */
.p-casestudy-interview__catch-wrap {
   position: relative;
   margin-top: -60px;
   margin-bottom: 40px;
   z-index: 3;
   width: fit-content;
}

.p-casestudy-interview__catch {
   display: inline-block;
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 15px 40px;
   font-size: 22px;
   font-weight: bold;
   border-radius: 0 4px 4px 0;
}

/* Bottom Area (Text & Results & Portrait) */
.p-casestudy-interview__item-bottom {
   display: flex;
   justify-content: space-between;
   gap: 30px;
   align-items: flex-start;
}

.p-casestudy-interview__content {
   padding-top: 10px;
}

.p-casestudy-interview__text {
   font-size: var(--fs-18-24);
   line-height: 2;
   margin-bottom: 30px;
}

.p-casestudy-interview__results-label {
   font-weight: bold;
   margin-bottom: 15px;
   font-size: var(--fs-18-24);
}

.p-casestudy-interview__results-list {
   display: flex;
   flex-wrap: wrap;
   gap: 15px;
}

.p-casestudy-interview__results-item {
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 8px 25px;
   border-radius: 4px;
   font-size: var(--fs-18-24);
   font-weight: bold;
}

.p-casestudy-interview__person-image {
   /* width: 100%; */
   /* aspect-ratio: 4 / 3; */
   overflow: hidden;
   border-radius: 20px;
}

.p-casestudy-interview__person-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

/* --------------------------------------------------------------------------
   Responsive (Smartphone)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
   .p-casestudy-interview__title-wrap {
      align-items: center;
      gap: 10px;
   }

   .p-casestudy-interview__item-top {
      flex-direction: column;
      align-items: stretch;
      margin-bottom: 20px;
   }

   .p-casestudy-interview__item-bg {
      width: 100%;
      margin-bottom: -40px;
   }

   .p-casestudy-interview__info-card {
      position: relative;
      top: 0;
      transform: none;
      width: 90%;
      margin: 0 auto;
      padding: 25px;
   }

   .p-casestudy-interview__industry {
      font-size: 20px;
   }

   .p-casestudy-interview__catch-wrap {
      margin-top: 0;
      margin-bottom: 25px;
   }

   .p-casestudy-interview__catch {
      padding: 12px 25px;
      font-size: 18px;
      width: 100%;
      text-align: center;
      border-radius: 4px;
   }

   .p-casestudy-interview__item-bottom {
      display: flex;
      flex-direction: column;
      gap: 20px;
   }

   .p-casestudy-interview__text {
      font-size: 16px;
   }

   .p-casestudy-interview__results-list {
      gap: 10px;
   }

   .p-casestudy-interview__results-item {
      width: 100%;
      text-align: center;
      padding: 10px;
   }
}

/* ==========================================================================
   Case Study - Voice Section (.p-casestudy-voice)
   ========================================================================== */
.p-casestudy-voice {
   background-color: var(--color-white);
}

/* --------------------------------------------------------------------------
   Section Header
   -------------------------------------------------------------------------- */
.p-casestudy-voice__head {
   margin-bottom: clamp(40px, 3rem + 2vw, 80px);
}

.p-casestudy-voice__title-wrap {
   display: flex;
   align-items: flex-end;
   gap: 20px;
   margin-bottom: 20px;
}

.p-casestudy-voice__number {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(60px, 4rem + 5vw, 120px);
   line-height: 0.8;
   color: var(--color-primary);
   opacity: 0.2;
}

.p-casestudy-voice__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   color: var(--color-text-main);
   margin-bottom: 5px;
}

.p-casestudy-voice__title-blue {
   display: inline-block;
   margin-left: 40px;
   color: var(--color-primary);
}

.p-casestudy-voice__lead {
   font-size: 16px;
   line-height: 1.8;
   color: var(--color-text-main);
}

/* --------------------------------------------------------------------------
   Voice Cards
   -------------------------------------------------------------------------- */
.p-casestudy-voice__list {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 30px;
}

.p-casestudy-voice__card {
   background-color: var(--color-white);
   border: 1px solid #E5E5E5;
   border-radius: 12px;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.p-casestudy-voice__card:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.p-casestudy-voice__card-img {
   width: 100%;
   aspect-ratio: 16 / 10;
   overflow: hidden;
}

.p-casestudy-voice__card-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.p-casestudy-voice__card-body {
   padding: 30px;
   flex-grow: 1;
}

.p-casestudy-voice__card-info {
   margin-bottom: 15px;
}

.p-casestudy-voice__card-name {
   font-size: var(--fs-18-24);
   font-weight: bold;
}

.p-casestudy-voice__card-dept {
   font-size: var(--fs-18-20);
   font-weight: bold;
   color: var(--color-text-main);
}

.p-casestudy-voice__card-label {
   display: inline-block;
   background-color: #D8F2FF;
   color: var(--color-text-main);
   font-size: var(--fs-16-18);
   padding: 4px 16px;
   border-radius: 0;
   width: 100%;
   text-align: center;
   margin-bottom: 15px;

}

.p-casestudy-voice__card-catch {
   font-size: var(--fs-18-24);
   font-weight: bold;
   color: var(--color-primary);
   margin-bottom: 15px;
}

.p-casestudy-voice__card-text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   color: var(--color-text-main);
}

/* --------------------------------------------------------------------------
   Responsive (Smartphone)
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
   .p-casestudy-voice__list {
      grid-template-columns: 1fr;
      max-width: 600px;
      margin: 0 auto;
   }

   .p-casestudy-voice__title-blue {
      display: block;
      margin-left: 0;
      margin-top: 10px;
   }
}

@media (max-width: 768px) {
   .p-casestudy-voice__title-wrap {
      align-items: center;
   }
}

/* ==========================================================================
   Case Study - Benefits Section (.p-casestudy-benefits)
   ========================================================================== */
.p-casestudy-benefits {
   background-color: var(--color-white);
   text-align: center;
}

/* --------------------------------------------------------------------------
   Section Header
   -------------------------------------------------------------------------- */
.p-casestudy-benefits__head {
   margin-bottom: clamp(60px, 5vw, 100px);
}

.p-casestudy-benefits__title-area {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-bottom: 20px;
}

.p-casestudy-benefits__en-title {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(80px, 8vw, 140px);
   line-height: 0.8;
   color: var(--color-primary);
   opacity: 0.15;
   text-transform: capitalize;
}

.p-casestudy-benefits__ja-title {
   font-size: 24px;
   font-weight: bold;
   color: var(--color-text-main);
   margin-top: -0.4em;
   /* 数字に重ねる演出 */
}

.p-casestudy-benefits__lead {
   font-size: 16px;
   color: var(--color-text-main);
}

/* --------------------------------------------------------------------------
   Metric Items
   -------------------------------------------------------------------------- */
.p-casestudy-benefits__list {
   display: flex;
   justify-content: center;
   align-items: flex-start;
   gap: clamp(20px, 4vw, 60px);
   flex-wrap: wrap;
}

.p-casestudy-benefits__item {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: calc(25% - 45px);
   /* 4カラム */
   min-width: 220px;
}

.p-casestudy-benefits__circle {
   width: clamp(220px, 15vw, 280px);
   height: clamp(220px, 15vw, 280px);
   background-color: #E6F7FF;
   border-radius: 50%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   margin-bottom: 20px;
   transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.p-casestudy-benefits__item:hover .p-casestudy-benefits__circle {
   transform: scale(1.05);
}

.p-casestudy-benefits__item-label {
   font-size: clamp(16px, 1.2vw, 20px);
   font-weight: bold;
   color: #333;
   margin-bottom: 5px;
}

.p-casestudy-benefits__value-wrap {
   display: flex;
   align-items: baseline;
   color: var(--color-primary);
}

.p-casestudy-benefits__value {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(80px, 6vw, 120px);
   font-weight: bold;
   line-height: 1;
}

.p-casestudy-benefits__unit {
   font-size: clamp(24px, 2vw, 36px);
   font-weight: bold;
   margin-left: 5px;
}

.p-casestudy-benefits__item-sub {
   font-size: var(--fs-18-24);
   color: #333;
   margin-top: 16px;
}

/* --------------------------------------------------------------------------
   Responsive (Smartphone)
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
   .p-casestudy-benefits__item {
      width: calc(50% - 20px);
      /* タブレットで2カラム */
   }
}

@media (max-width: 480px) {
   .p-casestudy-benefits__list {
      gap: 40px 20px;
   }

   .p-casestudy-benefits__item {
      width: 100%;
      /* スマホで1カラム */
      min-width: auto;
   }

   .p-casestudy-benefits__circle {
      width: 240px;
      height: 240px;
   }
}

/* ==========================================================================
   Case Study - Partner Section (.p-casestudy-partner)
   ========================================================================== */
.p-casestudy-partner {
   position: relative;
   z-index: 1;
   /* 背景色は擬似要素で広げるため、ここでの background-color は解除します */
   padding-top: 100px;
   padding-bottom: 100px;
}

/* 画面幅いっぱいに背景色を敷く */
.p-casestudy-partner::before {
   content: "";
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 100vw;
   height: 100%;
   background-color: var(--color-bg-light);
   /* #F7F7F7 */
   z-index: -1;
}

.p-casestudy-partner__content {
   position: relative;
   text-align: center;
}

.p-casestudy-partner__head {
   position: relative;
   margin-bottom: 40px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
}

/* 巨大な英語背景テキスト（DIN Condensed） */
.p-casestudy-partner__en-bg {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(100px, 12vw, 220px);
   line-height: 0.8;
   color: var(--color-white);
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   white-space: nowrap;
   z-index: 1;
   pointer-events: none;
   text-transform: capitalize;
}

.p-casestudy-partner__title {
   position: relative;
   z-index: 2;
   font-size: clamp(24px, 2vw, 30px);
   font-weight: bold;
   color: var(--color-text-main);
}

.p-casestudy-partner__text {
   position: relative;
   z-index: 2;
   font-size: var(--fs-18-24);
   line-height: 1.8;
   margin-bottom: 50px;
   color: var(--color-text-main);
}

.p-casestudy-partner__btn {
   position: relative;
   z-index: 2;
}

/* ボタンの幅をデザインに合わせて調整 */
.p-casestudy-partner__btn .c-btn {
   min-width: clamp(280px, 20vw, 480px);
   background-color: transparent;
}

/* --------------------------------------------------------------------------
   Responsive (Smartphone)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
   .p-casestudy-partner__en-bg {
      white-space: normal;
      /* スマホでは2行に折り返す */
      width: 100%;
      font-size: clamp(80px, 20vw, 120px);
      line-height: 0.9;
   }

   .p-casestudy-partner__text {
      font-size: 14px;
      margin-bottom: 30px;
      text-align: center;
      padding: 0 10px;
   }

   .p-casestudy-partner__btn .c-btn {
      width: 100%;
      min-width: auto;
   }
}

/* ==========================================================================
   Company - Message Section (.p-message)
   ========================================================================== */
.p-message {
   margin-top: clamp(60px, 8vw, 100px);
}

.p-message__wrapper {
   display: flex;
   flex-direction: column;
   gap: 40px;
}

@media (min-width: 1025px) {
   .p-message__wrapper {
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-start;
      gap: clamp(40px, 8vw, 100px);
   }
}

.p-message__content {
   flex: 1;
}

.p-message__head {
   display: flex;
   align-items: flex-end;
   gap: 20px;
   margin-bottom: clamp(30px, 5vw, 40px);
}

.p-message__en {
   font-size: clamp(80px, 10vw, 160px);
   color: var(--color-text-lightblue);
   /* #D8FDFF */
   opacity: 1;
   line-height: 0.8;
}

.p-message__title {
   font-size: var(--fs-20-30);
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 15px;
   white-space: nowrap;
   padding-bottom: clamp(5px, 1vw, 10px);
}

.p-message__title::after {
   content: "";
   display: block;
   width: clamp(40px, 5vw, 80px);
   height: 1px;
   background-color: var(--color-border);
}

.p-message__info {
   margin-bottom: 30px;
}

.p-message__job {
   font-size: 20px;
   font-weight: bold;
}

.p-message__name {
   font-size: clamp(32px, 3.5vw, 48px);
   font-weight: bold;
   line-height: 1.2;
}

.p-message__lead {
   font-size: clamp(20px, 2vw, 24px);
   font-weight: bold;
   color: var(--color-text-main);
   margin-bottom: 25px;
}

.p-message__text p {
   font-size: var(--fs-18-24);
   margin-bottom: 1.5em;
   line-height: 1.8;
}

.p-message__text p:last-child {
   margin-bottom: 0;
}

.p-message__image {
   width: 100%;
}

@media (min-width: 1025px) {
   .p-message__image {
      width: clamp(400px, 40vw, 600px);
      flex-shrink: 0;
   }
}

.p-message__image img {
   width: 100%;
   height: auto;
   border-radius: 0 40px 40px 40px;
   /* 左上のみ角丸なしのブロークングリッド演出 */
   object-fit: cover;
}

@media (max-width: 1024px) {
   .p-message__head {
      align-items: center;
   }

   .p-message__en {
      font-size: clamp(60px, 15vw, 100px);
   }
}

/* ==========================================================================
   Company - Philosophy Section (.p-philosophy) - Layout Fix
   ========================================================================== */
.p-philosophy {
   margin-top: clamp(80px, 12vw, 160px);
   position: relative;
}

/* 画像とタイトルの横並びエリア */
.p-philosophy__top {
   display: flex;
   flex-direction: column;
   gap: 40px;
   margin-bottom: clamp(60px, 8vw, 100px);
}

@media (min-width: 1025px) {
   .p-philosophy__top {
      flex-direction: row;
      align-items: flex-start;
      justify-content: space-between;
      gap: 0;
   }
}

/* メイン画像（左側） */
.p-philosophy__main-img {
   width: 100%;
}

@media (min-width: 1025px) {
   .p-philosophy__main-img {
      width: 60%;
      margin-left: calc(var(--gutter-fluid) * -1);
      /* 画面端まで突き抜ける演出 */
   }
}

.p-philosophy__main-img img {
   width: 100%;
   height: auto;
   border-radius: 0 0 60px 0;
   object-fit: cover;
}

/* タイトルエリア（右側） */
.p-philosophy__head {
   width: 100%;
}

@media (min-width: 1025px) {
   .p-philosophy__head {
      width: 35%;
      margin-top: 60px;
      /* 少し下に下げてバランス調整 */
   }
}

.p-philosophy__title-wrap {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 10px;
   position: relative;
}

.p-philosophy__title {
   font-size: 24px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 15px;
   z-index: 2;
}

.p-philosophy__title .raimo {
   color: var(--color-primary);
   font-family: "din-condensed", sans-serif;
   font-size: 1.25em;
   text-transform: capitalize;
}

.p-philosophy__title::after {
   content: "";
   display: block;
   width: 60px;
   height: 1px;
   background-color: var(--color-border);
}

.p-philosophy__en {
   font-size: clamp(80px, 10vw, 180px);
   color: var(--color-text-lightblue);
   opacity: 1;
   line-height: 0.8;
   z-index: 1;
   margin-top: -0.2em;
}

/* カードグリッド（上に被せる設定） - フルイド（流動的）レイアウト修正 */
.p-philosophy__content {
   position: relative;
   z-index: 10;
}

.p-philosophy__grid {
   display: grid;
   /* カラム：幅に合わせて 3列 → 2列 → 1列 と自動で最適化（fi-content的な柔軟な挙動） */
   grid-template-columns: repeat(auto-fit, minmax(min(100%, 350px), 1fr));
   /* 隙間：20px 〜 40px で滑らかに変化 */
   gap: clamp(20px, calc(1.25rem + 1.04vw), 40px);
   /* 内側余白：24px 〜 100px で滑らかに変化 */
   padding: clamp(24px, calc(1.5rem + 3.96vw), 100px);
   background-color: var(--color-white);


   margin-top: clamp(-320px, calc(5.7rem - 19.46vw), 0px);
}



/* 理念カードの基本スタイル（既存分を流用しつつ微調整） */
.p-philosophy-card {
   background: var(--color-white);
   border: 1px solid #E0E0E0;
   border-radius: 24px;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
   display: flex;
   flex-direction: column;
   height: 100%;
}


.p-philosophy-card:hover {
   transform: translateY(-5px);
}

.p-philosophy-card__head {
   position: relative;
   margin-bottom: 25px;
}

.p-philosophy-card__en {
   font-family: "din-condensed", sans-serif;
   font-size: clamp(40px, 5vw, 64px);
   color: var(--color-text-lightblue);
   opacity: 1;
   line-height: 1;
   position: absolute;
   top: -0.8em;
   left: 0;
   pointer-events: none;
}

.p-philosophy-card__label {
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 12px 24px;
   border-radius: 12px 12px 12px 0;
   display: inline-flex;
   align-items: center;
   gap: 12px;
   position: relative;
   z-index: 2;
   min-width: 200px;
}

.p-philosophy-card__icon {
   width: 28px;
   height: 28px;
   filter: brightness(0) invert(1);
}

.p-philosophy-card__title {
   font-size: 18px;
   font-weight: bold;
   letter-spacing: 0.1em;
}

.p-philosophy-card__body {
   padding: 0 24px 30px;
   flex: 1;
}

.p-philosophy-card__catch {
   font-size: 20px;
   font-weight: bold;
   line-height: 1.5;
   margin-bottom: 20px;
   color: var(--color-text-main);
   font-feature-settings: "palt";
}

.p-philosophy-card__text {
   font-size: 16px;
   line-height: 1.7;
}

/* Valueのリストスタイル */
.p-philosophy-card__list {
   font-size: 14px;
   line-height: 1.7;
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.p-philosophy-card__list span {
   color: var(--color-primary);
   font-weight: bold;
}

/* ==========================================================================
   Company - Information Section (.p-company-info)
   ========================================================================== */
.p-company-info {
   background-color: var(--color-white);
}

.p-company-info__head {
   position: relative;
   text-align: center;
   margin-bottom: clamp(40px, 5vw, 80px);
}

.p-company-info__en {
   font-size: clamp(80px, 12vw, 160px);
   color: var(--color-text-lightblue);
   opacity: 1;
   line-height: 0.8;
}

.p-company-info__title {
   font-size: 24px;
   font-weight: bold;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 2;
   white-space: nowrap;
}

.p-company-info__list {
   max-width: 1000px;
   margin: 0 auto;
}

.p-company-info__row {
   display: flex;
   flex-direction: column;
   /* border-bottom: 1px solid #D6D6D6; */
}

@media (min-width: 769px) {
   .p-company-info__row {
      flex-direction: row;
      align-items: stretch;
   }
}

.p-company-info__label {
   background-color: #D8F2FF;
   padding: 15px 20px;
   font-size: var(--fs-18-24);
   color: var(--color-text-main);
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   margin-bottom: 8px;
}

@media (min-width: 769px) {
   .p-company-info__label {
      width: 260px;
      flex-shrink: 0;
   }
}

.p-company-info__value {
   padding: 15px 30px;
   font-size: var(--fs-18-24);
   line-height: 1.8;
   color: var(--color-text-main);
   display: flex;
   align-items: center;
   margin-left: 16px;
   border-bottom: 1px solid #D6D6D6;
   width: 100%;
}

@media (max-width: 768px) {
   .p-company-info__value {
      padding: 15px 10px;
      text-align: center;
      justify-content: center;
   }

   .p-company-info__row:first-of-type {
      border-top: none;
   }
}

/* ==========================================================================
   Company - Development Section (.p-develop)
   ========================================================================== */
.p-develop {
   overflow: hidden;
   /* 画像のはみ出しを管理 */
}

.p-develop__head {
   text-align: center;
   margin-bottom: clamp(60px, 8vw, 100px);
}

.p-develop__title-wrap {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-bottom: 24px;
}

.p-develop__en {
   font-size: clamp(60px, 8vw, 140px);
   color: var(--color-text-lightblue);
   opacity: 1;
   line-height: 1;
   white-space: nowrap;
}

.p-develop__title {
   position: absolute;
   font-size: 24px;
   font-weight: bold;
   padding: 0 20px;
   z-index: 2;
}

.p-develop__lead {
   font-size: var(--fs-18-20);
   line-height: 1.8;
   max-width: 800px;
   margin: 0 auto;
   text-align: left;
}

/* コンテンツエリア */
.p-develop__content {
   display: flex;
   flex-direction: column;
   gap: 40px;
   align-items: center;
}

@media (min-width: 1025px) {
   .p-develop__content {
      flex-direction: row;
      justify-content: space-between;
      align-items: stretch;
      gap: 0;
   }
}

/* 情報カード（左） */
.p-develop__info {
   width: 100%;
   background-color: var(--color-white);
   border-radius: 16px;
   overflow: hidden;
   display: flex;
   flex-direction: column;
}

@media (min-width: 1025px) {
   .p-develop__info {
      width: 45%;
      z-index: 10;
   }
}

.p-develop__info-badge {
   background: linear-gradient(90deg, #158EDB 0%, #6051A6 100%);
   color: var(--color-white);
   padding: 12px 20px;
   font-weight: bold;
   font-size: var(--fs-18-24);
   text-align: center;
   margin-bottom: 24px;
}

.p-develop__info-body {
   flex: 1;
}

.p-develop__info-name {
   font-size: var(--fs-20-30);
   font-weight: bold;
   line-height: 1.3;
   margin-bottom: 24px;
}

.p-develop__info-name .en {
   font-size: 0.8em;
}

.p-develop__info-text {
   font-size: var(--fs-18-20);
   line-height: 1.8;
}

/* 画像エリア（右） */
.p-develop__image {
   width: 100%;

}

@media (min-width: 1025px) {
   .p-develop__image {
      width: 60%;
      margin-right: calc(var(--gutter-fluid) * -1);
      /* 右端へ突き抜け */
      margin-left: -5%;
      /* カードと少し重ねる */
   }
}

.p-develop__image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 40px 0 0 40px;
   /* 左側のみ角丸（カードと対比） */
}

@media (max-width: 1024px) {
   .p-develop__image img {
      border-radius: 20px;
   }
}

/* ==========================================================================
   Company - Supervision Information (.p-supervision-info)
   ========================================================================== */
.p-general__inner {
   background-color: #F5F5F5;
   margin-inline: calc(50% - 50vw);
   width: 100vw;
   padding-inline: var(--gutter-fluid);
   padding-top: 100px;
   padding-bottom: 100px;
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   /* 画像とテキストを「上揃え」にする */
   gap: 60px;
   /* 左右の余白を確保 */
}

/* 2. テキストエリアを可変に設定 */
.p-general__head {
   flex: 1;
   max-width: 800px;
   /* テキストが広がりすぎないように制限（読みやすさのため） */
}

@media (max-width: 1024px) {
   .p-general__inner {
      flex-direction: column;
      gap: 40px;
   }
}

.p-general__en-bg {
   color: #fff;
   font-size: clamp(70px, calc(2.03rem + 8.72vw), 200px);
   position: relative;
   margin-bottom: 16px;

}

.p-supervision-info {
   background-color: #F5F5F5;
   margin-inline: calc(50% - 50vw);
   width: 100vw;
   padding-inline: var(--gutter-fluid);
   padding-top: 100px;
   padding-bottom: 100px;
}

.p-supervision-info__box {
   background-color: var(--color-white);
   padding: clamp(40px, 5vw, 80px) clamp(20px, 4vw, 60px);
   margin: 0 auto;
}

.p-general__title {
   /* position: absolute; */
   font-size: var(--fs-20-30);
   font-weight: bold;
   text-align: center;
   margin-bottom: clamp(30px, 4vw, 50px);
   color: var(--color-text-main);

}

.p-general__title::after {
   content: "";
   display: inline-block;
   width: 100px;
   height: 1px;
   background-color: #000;
   margin-left: 32px;
   vertical-align: middle;
}

.p-general__label {
   margin-bottom: 16px;
   font-weight: bold;
}

.p-general__name {
   color: var(--color-primary);
   font-size: var(--fs-20-30);
   margin-bottom: 16px;
}

.p-general__name-en {
   color: var(--color-text-main);
   font-size: 12px;
   margin-left: 32px;
   font-weight: normal;
}

.p-general__position {
   margin-bottom: 32px;
}

.p-general__text {
   font-size: var(--fs-18-24);
   margin-bottom: 16px;
}


.p-general__quote-text {
   background-color: #D8F0FF;
   border-radius: 54px 0 57px 0;
   font-size: var(--fs-18-24);
   padding: 30px;
}

/* 3. 画像コンテナの幅制限を緩和（600px → 800px または制限なし） */
.p-general__img-box {
   flex: 0 0 clamp(300px, 48%, 800px);
   /* 幅を 48% まで許容し、最大 800px に拡大 */
}

.p-general__img-box img {
   width: 100%;
   height: auto;
   border-radius: 52px 0 53px 0;
}

.p-supervision-info__title {
   text-align: center;
   margin-bottom: 32px;
   font-size: var(--fs-20-30);
   font-weight: bold;
}

/* 特定のセクション用のテーブル微調整 */
.p-supervision-info__list {
   max-width: 900px !important;
   margin-bottom: clamp(40px, 6vw, 80px);
}

.p-supervision-info__list .p-company-info__label {
   background-color: #E6F7FF;
   /* 少し薄めの水色 */
}

/* 実績サークル画像エリア */
.p-supervision-info__stats {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: clamp(15px, 2vw, 30px);
   align-items: center;
   justify-items: center;
}

.p-supervision-info__stat-item {
   width: 100%;
   max-width: 240px;
   transition: transform 0.3s ease;
}

.p-supervision-info__stat-item:hover {
   transform: scale(1.05);
}

.p-supervision-info__stat-item img {
   width: 100%;
   height: auto;
}

/* レスポンシブ調整 */
@media (max-width: 1024px) {
   .p-supervision-info__stats {
      grid-template-columns: repeat(2, 1fr);
      gap: 30px 20px;
   }

   .p-supervision-info__stat-item {
      max-width: 200px;
   }
}

@media (max-width: 430px) {
   .p-supervision-info__box {
      padding: 40px 15px;
      border-radius: 10px;
   }
}

/* ==========================================================================
   Company - Access Map Section (.p-access-map) - Full Width Fix
   ========================================================================== */
.p-access-map {
   /* コンテナを突き抜けて画面端まで広げる魔法の指定 */
   width: 100vw;
   margin-left: calc(50% - 50vw);

   line-height: 0;
   overflow: hidden;
}

.p-access-map__iframe {
   width: 100%;
   height: clamp(400px, 40vw, 600px);
   /* 画面幅に合わせて高さを調整 */
   position: relative;
}

.p-access-map__iframe iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /* 少しトーンを落としてデザインに馴染ませる */
   filter: grayscale(0.2) contrast(1.1);
}

@media (max-width: 768px) {
   .p-access-map {
      /* スマホでも同様に左右全幅へ */
      width: 100vw;
      margin-left: calc(50% - 50vw);
   }

   .p-access-map__iframe {
      height: 350px;
   }
}