/* ===========================================
   Button Components
   (legacy/components.css + contact-thanks.css から統合、BEM命名規則適用)
   =========================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wp--preset--spacing--space-6);
    border: none;
    border-radius: var(--radius-5);
    text-decoration: none;
    cursor: pointer;
}

.btn--small {
    gap: var(--wp--preset--spacing--space-10);                         /* Small版は間隔10px */
    font-size: var(--font-size-body-5);
    width: 110px;                        /* 固定幅110px */
    height: 26px;                        /* 固定高さ26px */
}  

/* ボタンアイコン */
.btn__icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-circle);
    font-size: var(--font-size-body-6);
    background: var(--wp--preset--gradient--primary-gradient);
    color: var(--wp--preset--color--mono-white);
}
/* Primary ボタン（デフォルト） */
.btn--primary {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);
}

.btn--primary:hover {
    background-color: var(--wp--preset--color--primary-dark);
    box-shadow: var(--shadow-sm);
}

.btn--primary:focus {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* Outline ボタン */
.btn--outline {
    background-color: transparent;
    color: var(--wp--preset--color--primary);
    border: 1px solid var(--wp--preset--color--primary);
    box-shadow: none;
}

.btn--outline:hover {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);
    box-shadow: var(--shadow-sm);
}

.btn--outline:focus {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* =========================
   お問い合わせ ボタン
   ========================= */
.btn--header .btn__link {
    position: relative;
    padding: var(--wp--preset--spacing--space-10) var(--wp--preset--spacing--space-20);
    border: 1px solid var(--wp--preset--color--mono-white);    
    border-radius: var(--radius-10);
    background: var(--wp--preset--gradient--primary-gradient);
    color: var(--wp--preset--color--mono-white);

    overflow: hidden;

}

.btn--header .btn__link::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--wp--preset--color--secondary);
    opacity: 0;
    transition: opacity 0.3s;
    border-radius: var(--radius-10);
    z-index: 0;
}

.btn--header .btn__text {
    position: relative;
    z-index: 1;
}

.btn--header .btn__link:hover::before {
    opacity: 1;
}

/* =========================
   ハンバーガーメニュー（ヘッダーボタン）
   ========================= */
.btn--menu-toggle {
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.btn--menu-toggle .btn__bar {
    display: block;
    position: absolute;
    left: 25%;
    width: 50%;
    height: 3px;
    background-color: var(--wp--preset--color--text-medium);
    border-radius: var(--radius-3);
    transition: all 0.3s ease;
}

/* 開閉状態 */
.is-open .btn--menu-toggle .btn__bar:nth-child(1) {
    top: 50%;
    transform: rotate(45deg);
}

.is-open .btn--menu-toggle .btn__bar:nth-child(2) {
    opacity: 0;
}

.is-open .btn--menu-toggle .btn__bar:nth-child(3) {
    top: 50%;
    transform: rotate(-45deg);
}

/* ===========================================
   Form Components
   (legacy/contact.css から統合、BEM命名規則適用)
   =========================================== */
.form-field {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--space-8);
}

.form-field__label {
    display: block;
    font-weight: var(--font-weight-normal);
    margin-bottom: var(--wp--preset--spacing--space-6);
    color: var(--wp--preset--color--text-darkest);
    font-size: var(--font-size-body-5);
    line-height: 1.43;
    letter-spacing: -0.01em;
}

.form-field__label .required {
    color: var(--wp--preset--color--error);
}

.form-field__error {
    color: var(--wp--preset--color--error);
    font-size: 0.9em;
    margin-top: var(--wp--preset--spacing--space-2);
}

/* Input */
.input {
    width: 100%;
    padding: var(--wp--preset--spacing--space-12) var(--wp--preset--spacing--space-16);
    border: 1px solid var(--wp--preset--color--gray-cool);
    border-radius: var(--radius-6);
    box-shadow: var(--shadow-xs);
    box-sizing: border-box;
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-normal);
    font-size: 15px;
    line-height: 1.47;
    letter-spacing: -0.01em;
    color: var(--wp--preset--color--text-darkest);
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.input:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary);
    box-shadow: var(--shadow-focus);
}

/* Textarea */
.textarea {
    width: 100%;
    height: 120px;
    padding: var(--wp--preset--spacing--space-12) var(--wp--preset--spacing--space-16);
    border: 1px solid var(--wp--preset--color--gray-cool);
    border-radius: var(--radius-6);
    box-shadow: var(--shadow-xs);
    box-sizing: border-box;
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-normal);
    font-size: 15px;
    line-height: 1.47;
    letter-spacing: -0.01em;
    color: var(--wp--preset--color--text-darkest);
    resize: vertical;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.textarea:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary);
    box-shadow: var(--shadow-focus);
}

/* ===========================================
   Card Component
   (legacy/about.css を参考に汎用的なカードコンポーネントを作成)
   =========================================== */
.card {
    background-color: var(--wp--preset--color--mono-white);
    border-radius: var(--radius-8);
    padding: var(--wp--preset--spacing--space-20);
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.3s ease;
}

.card:hover {
    box-shadow: var(--shadow-md);
}

.card__image {
    width: 100%;
    display: block;
    border-radius: var(--radius-8);
    overflow: hidden;
}

.card__header {
    margin-bottom: var(--wp--preset--spacing--space-16);
}

.card__title {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-title-3);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--text-darkest);
    margin: 0 0 var(--wp--preset--spacing--space-8) 0;
}

.card__body {
    font-family: var(--font-family-body);
    font-size: var(--font-size-body-4);
    line-height: var(--line-height-default);
    color: var(--wp--preset--color--text-medium);
}

.card__footer {
    margin-top: var(--wp--preset--spacing--space-16);
    padding-top: var(--wp--preset--spacing--space-16);
    border-top: 1px solid var(--wp--preset--color--gray-light);
}

/* カード内画像の共通スタイル */
.card__image img {
    width: 100%;
    height: auto;
    display: block;
}

/* カード内コンテンツ領域（画像→テキスト間の余白） */
.card__content {
    padding-top: var(--wp--preset--spacing--space-20, 20px);
}

/* 見出し直後の要素余白 */
.card__title + * {
    margin-top: var(--wp--preset--spacing--space-8, 8px);
}

/* ===========================================
   CTA Section
   (legacy/about.css を参考に汎用的なCTAコンポーネントを作成)
   =========================================== */
.cta-section {
    text-align: center;
    padding: var(--wp--preset--spacing--space-80) var(--wp--preset--spacing--space-20);
    background-color: var(--wp--preset--color--primary-lightest);
}

.cta-section__title {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-title-1);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--text-darkest);
    margin: 0 0 var(--wp--preset--spacing--space-16) 0;
}

.cta-section__text {
    font-family: var(--font-family-body);
    font-size: var(--font-size-body-2);
    line-height: var(--line-height-default);
    color: var(--wp--preset--color--text-medium);
    margin: 0 0 var(--wp--preset--spacing--space-32) 0;
}

.cta-section__button {
    display: inline-flex;
    align-items: center;
    color: var(--wp--preset--color--text-darkest);
    gap: var(--wp--preset--spacing--space-8);
    padding: var(--wp--preset--spacing--space-10) var(--wp--preset--spacing--space-20);
    white-space: nowrap;
    text-decoration: none;
    font-weight: var(--font-weight-bold);
    border-radius: var(--radius-5);
    background-color: var(--wp--preset--color--mono-white);
    border: 1px solid var(--wp--preset--color--gray-light);
    transition: all 0.3s ease;
}

.cta-section__button:hover {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);
    box-shadow: var(--shadow-sm);
}

.cta-section__icon {
    width: 20px;
    height: auto;
    transition: transform 0.3s ease;
}

.cta-section__button:hover .cta-section__icon {
    transform: translateX(4px);
}


/* ===========================================
   Navigation Component
   (legacy/header.css から統合、BEM命名規則適用)
   =========================================== */
.nav {
    display: flex;
    align-items: center;
    gap: var(--wp--preset--spacing--space-40);
    white-space: nowrap;
}

.nav__list {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
    gap: var(--wp--preset--spacing--space-40);
}

.nav__link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    text-decoration: none;
    color: var(--wp--preset--color--text-medium);
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-body-4);
    transition: color 0.3s ease;
}

.nav__link:hover {
    color: var(--wp--preset--color--primary);
}

.nav__icon--arrow {
    display: none;
}

/* ===========================================
   Page Intro Header（セクション見出し共通）
   =========================================== */
.page-intro-header {
    text-align: center;
    padding: var(--wp--preset--spacing--space-50, 50px) 0;
}

/* 見出し内の上下端 margin リセット */
.page-intro-header > *:first-child {
    margin-top: 0;
}

.page-intro-header > *:last-child {
    margin-bottom: 0;
}

.page-intro-header__en {
    color: var(--wp--preset--color--text-medium);
    display: block;
    margin-bottom: var(--wp--preset--spacing--space-8, 8px);
    font-size: var(--font-size-body-5, 0.875rem);
    font-weight: var(--font-weight-normal, 400);
}

.page-intro-header h2 {
    font-size: var(--font-size-title-2); /* 1.5rem / 24px - Figma SP/PC 共通 */
}

/* ===========================================
   More Link（もっと見るリンク共通）
   =========================================== */
.more-link-wrapper {
    text-align: center;
    padding: var(--wp--preset--spacing--space-40, 40px) 0;
}

.more-link-wrapper a {
    display: inline-flex;
    align-items: center;
    gap: var(--wp--preset--spacing--space-8, 8px);
    padding: var(--wp--preset--spacing--space-10, 10px) var(--wp--preset--spacing--space-20, 20px);
    color: var(--wp--preset--color--text-darkest);
    font-size: var(--font-size-body-4);
    font-weight: var(--font-weight-bold, 700);
    text-decoration: none;
    white-space: nowrap;
}

.more-link-wrapper a:hover {
    opacity: 0.7;
}

.more-link-wrapper a img {
    width: 20px;
    height: auto;
}

/* ===========================================
   Vision/Mission Card
   ページ: front-page（トップページ）
   セクション: About（.section-about）
   参照: legacy/about.css
   =========================================== */

/* 親コンテナ: 2カラム横並び */
.vm-card.wp-block-columns {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.08vw, 30px);  /* fluid: 16px@768 → 30px@1440 */
}

/* 画像ボックス */
.vm-card__image-box {
    width: 50%;
    position: relative;
    overflow: hidden;
}

.vm-card__image-box img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 1s ease, filter 1s ease;
}

/* 画像上のテキストオーバーレイ（初期は非表示） */
.vm-card__image-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    color: var(--wp--preset--color--mono-white);
    font-size: var(--font-size-body-3, 1rem);
    line-height: 1.8;
    text-align: center;
    word-break: keep-all;      /* 単語途中で折り返さない */
    overflow-wrap: break-word; /* 長い単語は折り返す */
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
    z-index: 2;
}

/* hover時: 画像ズーム + 暗転 */
.vm-card__image-box:hover img {
    transform: scale(1.1);
    filter: brightness(50%);
}

/* hover時: テキスト表示 */
.vm-card__image-box:hover .vm-card__image-text {
    opacity: 1;
}

/* テキストボックス（PC: 上下中央配置） */
.vm-card__text-box {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* VISION / MISSION 各項目 */
.vm-card__text-item {
    text-align: center;
    margin-bottom: clamp(21px, 2.78vw, 40px);  /* fluid: 21px@768 → 40px@1440 */
}

.vm-card__text-item:last-child {
    margin-bottom: 0;
}

/* VISION / MISSION 見出し */
.vm-card__text-title {
    color: var(--wp--preset--color--text-light);
    margin-bottom: clamp(13px, 1.67vw, 24px);  /* fluid: 13px@768 → 24px@1440 */
}

/* VISION / MISSION 本文（明朝体 + bold） */
.vm-card__text-item p {
    font-family: var(--font-family-heading);  /* 明朝体 */
    font-size: clamp(1.125rem, 2vw, 1.75rem);  /* fluid: 20px@768 → 28px@1440 */
    font-weight: var(--font-weight-bold, 700);
    line-height: var(--line-height-tight, 1.3);
    color: var(--wp--preset--color--text-darkest);
}

/* About セクション: CTA ボタンの上余白を詰める [issue-191] */
.section-about .more-link-wrapper {
    padding-top: var(--wp--preset--spacing--space-10);
}

/* ===========================================
   Business Card
   ページ: front-page（トップページ）
   セクション: Business（.section-business）
   参照: legacy/business.css
   =========================================== */

/* 親コンテナ: 2カラム横並び */
.business-card-list.wp-block-columns {
    display: flex;
    gap: clamp(1.875rem, 0.589rem + 2.68vw, 3rem);
    /* max-width: 800px; */
    margin: 0 auto;
}

/* フロントページ（.section-business）では padding を打消し */
.section-business .business-card-list {
    padding-left: 0;
    padding-right: 0;
}

/* 各カード */
.business-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* 画像 */
.business-card__image {
    width: 100%;
    max-width: 600px;
    margin: 0;
}

.business-card__image img {
    width: 100%;
    height: auto;
    display: block;
}

/* テキスト部分 */
.business-card__content {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 25px auto;
}

/* タイトル（ゴシック体 + bold、左寄せ） */
.business-card__title {
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-bold, 700);
    font-size: clamp(16px, 1.67vw, 24px);    /* fluid: 16px@768 → 24px@1440 */
    line-height: var(--line-height-default, 1.5);
    color: var(--wp--preset--color--text-darkest);
    margin-top: 20px;
    margin-bottom: 15px;
    text-align: left;
}

/* 説明文 */
.business-card__text {
    font-size: clamp(13px, 1.25vw, 18px);    /* fluid: 13px@768 → 18px@1440 */
    line-height: var(--line-height-loose, 1.7);
    color: var(--wp--preset--color--text-darkest);
    text-align: left;
}

/* もっと見るリンク（カラム内右寄せ） */
.business-card .more-link-wrapper {
    width: 100%;
    text-align: right;
    padding: var(--wp--preset--spacing--space-10, 10px) 0;
}

/* ===========================================
   Media/Awards Section
   ページ: front-page（トップページ）
   セクション: Media/Awards（.section-media-awards）
   参照: legacy/media.css
   =========================================== */

/* 親コンテナ: 2カラム横並び */
.media-awards.wp-block-columns {
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 30px;
}

/* メディア画像側 */
.media-awards__media {
    width: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* pictureの余白リセットと中央配置 */
.media-awards__media picture {
    margin: 0;
    width: 100%;
}

.media-awards__media img {
    width: 100%;
    margin: 0 auto;
    display: block;
}

/* 縦の区切り線 */
.media-awards__media::before {
    content: "";
    position: absolute;
    top: -5%;
    bottom: -5%;
    right: 0;
    width: 2px;
    background-color: var(--wp--preset--color--gray-medium);
    z-index: 1;
}

/* Awards側 */
.media-awards__awards {
    width: 50%;
    display: flex;
    flex-direction: column; 
    justify-content: center;
}

/* Awardsリスト */
.awards__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 0;
    margin: auto 0;
    list-style: none;
}

/* 各アイテム */
.awards__item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

/* ロゴ（共通） */
.awards__logo {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.awards__logo img {
    display: block;
    object-fit: contain;
    margin: auto;
}

/* Figaro ロゴ（左）- 高さ・幅を個別設定 */
.awards__item:nth-child(1) .awards__logo {
    height: clamp(7.5rem, 13vw, 11.25rem);  /* fluid: 120px → 180px */
}
.awards__item:nth-child(1) .awards__logo img {
    width: 100%;
    height: 100%;
}

/* Forbes ロゴ（右）- 高さ・幅を個別設定 */
.awards__item:nth-child(2) .awards__logo {
    height: clamp(7.5rem, 13vw, 11.25rem);  /* FIGAROと高さを統一 */
}
.awards__item:nth-child(2) .awards__logo img {
    width: 80%;
    max-height: 100%;
}

/* Figaro テキスト（左）- ロゴ高さ統一により補正不要 */
.awards__item:nth-child(1) .awards__text {
    padding-top: 0;
}

/* テキスト */
.awards__text {
    margin: 0;
    font-weight: var(--font-weight-bold, 700);
    text-align: center;
    font-size: clamp(12px, 1.1vw, 14px);
    line-height: 1.4;
    min-height: 60px;             /* 最小高さでテキスト位置を揃える */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* front-page: company-info の .awards__item 上書きルール（height/padding-bottom）を解除 */
.section-media-awards .awards__item {
    height: auto;
    padding-bottom: 0;
}

/* front-page: 受賞テキスト拡大・flex-grow/margin リセット */
.section-media-awards .awards__text {
    font-size: clamp(0.875rem, 1.3vw, 1.125rem);  /* 14px → 18px */
    flex-grow: 0;
    margin-bottom: 0;
}

/* もっと見るリンク */
.awards__item .more-link-wrapper {
    padding: 0;
    margin-top: auto;
}
.awards__item .more-link-wrapper p {
    margin: 0;
}

/* ===========================================
   Member Card Grid
   ページ: front-page（トップページ）
   セクション: Member（.section-member）
   参照: legacy/member.css
   =========================================== */

/* 親コンテナ: 3カラム横並び */
.member__list.wp-block-columns {
    display: flex;
    justify-content: center;
    gap: clamp(43px, 5.56vw, 80px);  /* fluid: 43px@768 → 80px@1440 */
    margin: 0 auto;
}

/* 各カード */
.member__list .wp-block-column {
    flex: 1 1 0;
}

/* 画像 */
.member__list .wp-block-image {
    margin: 0;
}

.member__list .wp-block-image img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1 / 1;    /* 正方形に統一 */
    object-fit: cover;       /* はみ出し部分をトリミング */
}

/* front-page: 円形クロップ（section-member専用） */
.section-member .member__list .wp-block-image img {
    object-position: center top; 
    border-radius: 50%;      /* 円形 */
}

/* front-page: カラム間の左右余白を縮小 */
.section-member .member__list.wp-block-columns {
    gap: clamp(20px, 2.5vw, 40px);
}

/* front-page: カラム幅を制限・中央寄せ
   !important: wp-block-column のインラインスタイル(flex-basis)を上書きするために必要 */
.section-member .member__item {
    flex: 0 0 clamp(175px, 20vw, 255px) !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 左右端カラムに外側余白を付与 */
.section-member .member__item:first-child {
    margin-left: auto;
}

.section-member .member__item:last-child {
    margin-right: auto;
}

/* front-page: 画像を縮小して中央配置 */
.section-member .member-card__image {
    width: clamp(115px, 13vw, 175px);
    margin: 0 auto;
    position: relative;
}

/* front-page: 紫オーラ（::before で画像の背後に独立したグラデーション層） */
.section-member .member-card__image::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 170%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle at center,
        rgba(193, 175, 210, 0.9) 0%,
        rgba(193, 175, 210, 0.9) 30%,
        rgba(193, 175, 210, 0.45) 48%,
        transparent 68%);
    z-index: 0;
}

.section-member .member-card__image img {
    position: relative;
    z-index: 1;
}

/* front-page: テキストを画像幅に合わせて縮小 */
.section-member .member-card__name .member-card__name-text {
    font-size: clamp(1rem, 1.6vw, 1.375rem);
}

.section-member .member-card__name .member-card__position {
    font-size: clamp(0.6875rem, 1vw, 0.875rem);
}

/* front-page: 画像↔役職名の余白・中央揃え（PC・SP共通） */
.section-member .member-card__name {
    padding-top: clamp(16px, 2.5vw, 24px);
    text-align: center;
}

/* front-page: 名前・肩書きをテキストカラー１に統一 */
.section-member .member-card__name p {
    color: var(--wp--preset--color--text-darkest);
}

/* 名前・肩書き */
.member-card__name {
    padding-top: 15px;
    text-align: left;
    font-weight: var(--font-weight-bold, 700);
}

.member-card__name p {
    margin: 0;
    color: var(--wp--preset--color--text-darkest);
}

/* 名前 */
.member-card__name .member-card__name-text {
    font-size: clamp(1.25rem, 2vw, 1.625rem);
    font-weight: var(--font-weight-bold, 700);
    margin-bottom: 5px;
}

/* 肩書き */
.member-card__name .member-card__position {
    font-size: clamp(0.875rem, 1.4vw, 1.125rem);
}

/* front-page: 2行目member__listの上下余白 */
.section-member .member__list + .member__list {
    margin-top: clamp(1rem, 2vw, 1.5rem);
    padding-bottom: clamp(2rem, 4vw, 3rem);
}

/* front-page: 略歴テキスト（幅・中央配置・左揃え・色） */
.section-member .member__detail {
    width: clamp(160px, 18vw, 250px);
    text-align: left;
    margin-top: 8px;
}

.section-member .member__detail p {
    font-size: clamp(0.75rem, 1vw, 0.875rem);
    color: var(--wp--preset--color--mono-black);
}


/* ===========================================
   Company Info Card
   ページ: front-page（トップページ）
   セクション: Company（.section-company）
   参照: legacy/company-info.css
   =========================================== */

/* 親コンテナ: 2カラム横並び（テキスト左・画像右） */
.company-info-card.wp-block-columns {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
}

/* 各カラム共通: grid アイテムとしてオーバーフロー防止 */
.company-info-card > .wp-block-column {
    min-width: 0;
}

/* 左カラム（テキスト）左余白: セクション共通余白に委ねる・上下中央揃え */
/* max-width: 55% (company-info ページ側ルール) を Grid 内では無効化 */
.company-info-card > .wp-block-column:first-child {
    padding-left: 0;
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* 右カラム（画像）右余白: セクション共通余白に委ねる */
.company-info-card > .wp-block-column:last-child {
    padding-right: 0;
}

.company-info-card picture {
    margin: 0;
    width: 100% !important;
    display: block !important;
}

.company-info-card picture img {
    width: 100%;
    height: auto;
    display: block;
}

/* 会社情報リスト（dl） */
.company-info-card__list {
    margin: 0;
    padding: 0;
}

/* front-page: 後方の同名定義に負けないよう親セレクタで詳細度を上げる */
.section-company .company-info-card__label {
    color: var(--wp--preset--color--text-medium, #6B7280);
    font-size: clamp(14px, 1.39vw, 20px);  /* fluid: 14px@768 → 20px@1440 */
    line-height: 2;
}

.section-company .company-info-card__value {
    color: var(--wp--preset--color--text-darkest);
    font-size: clamp(18px, 1.94vw, 28px);  /* fluid: 18px@768 → 28px@1440 */
    line-height: 2;
    margin: 0;
    padding-bottom: 20px;
}

/* もっと見るリンク */
.company-info-card__box .more-link-wrapper {
    text-align: left;
    padding: var(--wp--preset--spacing--space-20, 20px) 0;
}

.company-info-card__box .more-link-wrapper a {
    padding-left: 0;
}

/* ===========================================
   About Us Page Styles
   ページ: about-us
   セクション: Vision/Mission, CEO Card, CEO Message
   参照: legacy/about.css
   =========================================== */

/* ----- Vision/Mission Card ----- */
/* 親コンテナ: 2カラム横並び + 左右余白 */
.about-us .vm-card.wp-block-columns {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap !important;    /* WPコア(781px)の縦並びを防止 */
    align-items: center;
    justify-content: center;
    gap: var(--content-gap, 30px);
    width: 100%;
    max-width: var(--container-width, 1200px);
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
}

/* 画像ボックス */
.about-us .vm-card__image-box.wp-block-column {
    flex: 1 1 0% !important;        /* 等幅 → GAP中央揃え */
    align-self: stretch !important; /* 行高に合わせて引き伸ばす */
    position: relative;
    overflow: hidden;
}

.about-us .vm-card__image-box .wp-block-image {
    height: 100%;
    margin: 0;
}

.about-us .vm-card__image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1s ease, filter 1s ease;
}

/* 画像上のテキストオーバーレイ（初期は非表示） */
.about-us .vm-card__image-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    color: var(--wp--preset--color--mono-white);
    font-size: var(--font-size-body-3, 1rem);
    line-height: 1.8;
    text-align: center;
    word-break: keep-all;
    overflow-wrap: break-word;
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
    z-index: 2;
}

/* hover時: 画像ズーム + 暗転 */
.about-us .vm-card__image-box:hover img {
    transform: scale(1.1);
    filter: brightness(50%);
}

/* hover時: テキスト表示 */
.about-us .vm-card__image-box:hover .vm-card__image-text {
    opacity: 1;
}

/* テキストボックス（上下中央配置） */
.about-us .vm-card__text-box.wp-block-column {
    flex: 1 1 0% !important;        /* WPコア防止 + 残り幅を使い切る */
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

/* VISION / MISSION 各項目 */
.about-us .vm-card__text-item {
    text-align: center;
    margin-bottom: clamp(21px, 2.78vw, 40px);  /* front-page と統一 */
}

.about-us .vm-card__text-item:last-child {
    margin-bottom: 0;
}

/* VISION / MISSION 見出し */
.about-us .vm-card__text-title {
    color: var(--wp--preset--color--text-light);
    margin-bottom: clamp(16px, 2vw, 24px);
}

/* VISION / MISSION 本文（明朝体 + bold） */
.about-us .vm-card__text-item p {
    font-family: var(--font-family-heading);
    font-size: clamp(1.125rem, 2vw, 1.75rem);  /* front-page と統一: 18px〜28px */
    font-weight: var(--font-weight-bold, 700);
    line-height: var(--line-height-tight, 1.3);
    color: var(--wp--preset--color--text-darkest);
}

/* ----- Section Divider ----- */
/* 紫の区切り線 */
hr.wp-block-separator.section-divider:not(.is-style-wide):not(.is-style-dots) {
    border: none;
    border-bottom: none;
    height: 5px;
    background: var(--wp--preset--color--primary-lightest);
    width: 100%;
    margin: var(--content-gap, 30px) auto;
}

/* ----- CEO Card ----- */
/* 親コンテナ: 2カラム横並び + 中央配置 */
.ceo-card.wp-block-columns {
    display: flex;
    flex-wrap: nowrap !important;    /* WPコア(781px)の縦並びを防止 */
    align-items: center;
    justify-content: center;
    gap: var(--content-gap, 30px);
    width: 100%;
    max-width: var(--container-width, 1200px);
    margin: 0 auto;
    box-sizing: border-box;
}

/* 画像カラム（VMと同じ50%でGAP位置を一致させる） */
.ceo-card .wp-block-column:first-child {
    flex: 1 1 0% !important;      /* 第2カラムと等幅 → GAP中央揃え */
    display: flex;
    justify-content: flex-end;
}

.ceo-card__image {
    width: 100%;
    max-width: clamp(220px, 28vw, 320px);  /* 768px≈220px → 1200px≈320px スケール */
}

/* テキストカラム（VMと同じflex: 1 1 0%で残り幅を使い切る） */
.ceo-card .wp-block-column.ceo-card__intro {
    flex: 1 1 0% !important;      /* VMと同じ → GAP位置が一致 */
}

.ceo-card__image img {
    display: block;
    width: 100%;
    height: auto;
}

/* 名前・リード文カラム */
.ceo-card__intro {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;  /* 上下中央配置 */
}

.ceo-card__name {
    text-align: left;
    padding: 0;
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);  /* 20px〜28px 画面幅に追従 */
    color: var(--wp--preset--color--text-light);
}

.ceo-card__lead {
    text-align: left;
    padding: 0;
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);  /* 20px〜28px 画面幅に追従 */
    margin-top: var(--space-50, 50px);
    color: var(--wp--preset--color--gray-blue);
}

/* ----- CEO Message ----- */
.ceo-card__message.wp-block-group {
    padding: var(--wp--preset--spacing--space-20);
    width: calc(100% - var(--wp--preset--spacing--space-40) * 2);
    max-width: var(--container-width, 1200px);
    margin: var(--wp--preset--spacing--space-30) auto;
    background-color: var(--wp--preset--color--gray-lightest);
}

.ceo-card__message p {
    color: var(--wp--preset--color--text-darkest);
    font-weight: var(--font-weight-normal);
    font-size: clamp(1.125rem, 1.67vw, 1.5rem);  /* 18px〜24px 画面幅に追従 */
}

.ceo-card__message p + p {
    margin-top: var(--space-20, 20px);
}

/* 脚注 */
.ceo-card__footnote {
    margin-top: var(--wp--preset--spacing--space-40, 40px);
}

.ceo-card__footnote p {
    font-size: 0.85em;
    font-weight: var(--font-weight-normal);
}

.ceo-card__footnote a {
    color: var(--wp--preset--color--text-darkest);
    text-decoration: none;
    word-break: break-all;  /* URL などの長い文字列を強制折り返し */
}

.ceo-card__footnote a:hover {
    color: var(--wp--preset--color--primary);
}


/* ===========================================
   DAIVE Page Styles
   ページ: daive
   セクション: Hero, Title, Feature, Female PM, Solution, Case, Contact
   参照: 公開サイト daive.css
   =========================================== */

/* Contact タイトル */
.daive__contact-title {
    position: relative;
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-body-3);
    display: inline-block;
    padding: 3vw 0 1vw;
    color: rgba(255, 255, 255, 1);
    margin: 0;
    line-height: 1.4;
    text-align: center;
}

/* タイトル下線（画像） */
.daive__contact-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 22vw;
    height: 0.8vw;
    background: url("../images/daive/PC_9_contact-line.png") no-repeat center;
    background-size: contain;
}

/* 会社概要リスト */
.daive__contact .company-info-card__list {
    list-style: none;
    margin: 1em auto 3em;
    padding: 0 8em;
    max-width: var(--wp--style--global--content-size, 600px);
    text-align: left;
}

.daive__contact .company-info-card__label {
    display: block;
    font-weight: var(--font-weight-bold);
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 0.3em;
    font-size: var(--font-size-body-4);
}

.daive__contact .company-info-card__value {
    font-size: var(--font-size-body-4);
    color: rgba(255, 255, 255, 1);
    margin: 0 0 1.5em 0;
    line-height: 1.8;
}

/* Contact 注釈テキスト */
.daive__contact-note {
    font-size: var(--font-size-body-3);
    color: rgba(255, 255, 255, 1);
    margin: 3em 0 1em;
    line-height: 1.6;
}

/* Contact CTAボタン */
.daive__contact .wp-block-buttons {
    width: 100%;
    margin: 1em 0 2em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.daive__contact .wp-block-button__link {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: none;
    outline: none;
    width: clamp(180px, 20vw, 500px);
    height: clamp(42px, 3vw, 84px);
    font-size: clamp(13px, 1vw, 20px);
    border-radius: var(--radius-10);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.03em;
    line-height: 1.1;
    color: var(--wp--preset--color--mono-white);
    background: var(--wp--preset--gradient--primary-gradient);
    text-decoration: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.daive__contact .wp-block-button__link:hover {
    opacity: 0.9;
    transform: scale(1.03);
}

/* ===========================================
   Business Overview Page Styles
   ページ: business-overview
   セクション: Business Cards
   参照: 公開サイト business.css
   =========================================== */
.business-card-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: var(--wp--preset--spacing--space-20);
    max-width: var(--wp--style--global--content-size);
    margin: 0 auto;
    padding: 0 var(--wp--preset--spacing--space-40);
}

.business-card {
    flex: 1 1 0%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

div.wp-block-columns.business-card-list > .business-card {
    flex-basis: 0% !important;
}

.business-card__image {
    width: 100%;
    margin: 0 auto;
}

.business-card__image img {
    width: 100%;
    height: auto;
}

.business-card__content {
    margin: 0 auto var(--wp--preset--spacing--space-25) auto;
    text-align: left;
}

.business-card__title {
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-bold);
    font-size: clamp(1rem, 0.41rem + 1.46vw, 1.5rem);
    line-height: var(--line-height-default);
    color: var(--wp--preset--color--text-darkest);
    margin-top: var(--wp--preset--spacing--space-20);
    margin-bottom: var(--wp--preset--spacing--space-15);
}

.business-card__text {
    font-size: clamp(1rem, 0.33rem + 1.39vw, 1.375rem);
    line-height: var(--line-height-loose);
    font-weight: var(--font-weight-normal);
    color: var(--wp--preset--color--text-darkest);
}

.business-card .more-link-wrapper {
    width: 100%;
    text-align: right;
    padding: 0;
    margin-bottom: var(--wp--preset--spacing--space-80);
}


 /* ===========================================
     Company Info Page Styles
     ページ: company-info
     セクション: Page Intro Header, Company Info, Company Results
     参照: 公開サイト company-info.css
     =========================================== */

/* --- Section Company Info（会社概要セクション） --- */
/* 公開サイト: .company */
.section-company-info.container {
    max-width: 100%;
    margin: 0;
    padding: 0 var(--wp--preset--spacing--space-40);
}

/* --- Company Info Card（会社概要2カラム） --- */
/* 公開サイト: .company-flex */
.company-info-card {
    gap: 0;
    align-items: flex-start;
}

/* WPデフォルト(781px以下で縦積み)を上書きし、768px以上では2カラム維持 */
.company-info-card.wp-block-columns {
    flex-wrap: nowrap !important;
}

.company-info-card.wp-block-columns > .wp-block-column.company-info-card__box,
.company-info-card.wp-block-columns > .wp-block-column.company-info-card__image {
    flex-basis: auto !important;
}

/* 公開サイト: .company-box-overview */
.company-info-card__box {
    flex: 1;
    width: 100%;
    text-align: left;
    max-width: 55%;
}

/* 公開サイト: .company-image-box */
.wp-block-column.company-info-card__image {
    flex: 1;
    max-width: none;
    text-align: center;
    /* PC: 見出し（1.5rem × 1.5 line-height + space-24 margin）分下げてリスト上端に揃える */
    padding-top: calc(2.25rem + var(--wp--preset--spacing--space-24));
}

.company-info-card__image img {
    width: 100%;
    height: auto;
    display: inline-block;
    border-radius: var(--radius-4);
}

/* 会社情報リスト（dl/dt/dd） */
/* 公開サイト: .company-box-overview dl/dt/dd */
.company-info-card__list {
    margin: 0;
    padding: 0;
}

.company-info-card__label {
    line-height: 2;
    margin: 0;
    font-size: var(--font-size-body-3);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--text-darkest);
}

.company-info-card__value {
    font-weight: var(--font-weight-normal);
    line-height: 2;
    padding-bottom: var(--space-20);
    margin: 0;
    font-size: var(--font-size-body-5);
}

/* セクション小見出し */
/* 公開サイト: .company-subheading + .font-body-1 */
.section-subheading {
    font-family: var(--font-family-body);
    font-size: var(--font-size-body-1);
    margin-bottom: var(--space-24);
    text-align: left;
    font-weight: var(--font-weight-bold);
}

/* Google Mapリンクボタン */
/* 公開サイト: .google-map-btn */
.section-company-info__map-link {
    display: inline-block;
    margin-left: var(--space-8);
    padding: var(--space-4) var(--space-12);
    background-color: transparent;
    color: var(--wp--preset--color--mono-black);
    text-decoration: none;
    border: 1px solid var(--wp--preset--color--primary-light);
    border-radius: var(--radius-4);
    font-size: var(--font-size-body-6);
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-bold);
    transition: all 0.2s;
    vertical-align: baseline;
    white-space: nowrap;
}

.section-company-info__map-link:hover {
    background-color: var(--wp--preset--color--primary-light);
    color: var(--wp--preset--color--mono-white);
}

/* --- Section Company Results（受賞歴・取引先セクション） --- */
/* 公開サイト: .company-results */
.section-company-results.container {
    max-width: 1200px;
    padding: 0 var(--wp--preset--spacing--space-40);
    padding-bottom: var(--wp--preset--spacing--space-80);
    text-align: center;
}

/* --- Company Results Card（受賞歴・取引先2カラム） --- */
/* 公開サイト: .results-grid */
.company-results-card {
    justify-content: center;
    align-items: flex-start;
    gap: clamp(12px, 1.4vw, 20px);
    flex-wrap: nowrap !important;
}

/* WPデフォルト(781px以下で縦積み)を上書きし、768px以上では2カラム維持 */
.company-results-card.wp-block-columns > .wp-block-column.company-results-card__box {
    flex-basis: auto !important;
}

/* 公開サイト: .result-item */
.wp-block-column.company-results-card__box {
    flex: 1;
    min-width: 280px;
    max-width: 450px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 受賞歴・取引先の小見出し */
.company-results-card__box .section-subheading {
    text-align: center;
    margin-bottom: var(--space-30);
}

/* 取引先リスト */
/* 公開サイト: .result-item p.font-body-3 */
.company-results-card__list {
    width: 100%;
    text-align: center;
}

.company-results-card__list p {
    font-weight: var(--font-weight-bold);
    margin: var(--space-12) 0;
    line-height: 2;
    color: var(--wp--preset--color--text-darkest);
}

/* --- Awards Section（受賞歴） --- */
/* 公開サイト: .awards-grid */
.awards__list {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: clamp(12px, 1.8vw, 40px);
    flex-wrap: nowrap;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    min-height: 250px;
}

/* 公開サイト: .award-item */
.awards__item {
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: clamp(250px, 24vw, 350px);
}

/* 公開サイト: .award-item img */
.awards__logo {
    margin: 0 0 var(--space-20) 0;
}

.awards__logo img {
    max-width: 100%;
    height: clamp(80px, 8.5vw, 120px);
    object-fit: contain;
}

/* 公開サイト: .award-item p */
.awards__text {
    flex-grow: 1;
    margin-bottom: var(--space-10);
    text-align: center;
    line-height: 1.4;
    font-size: clamp(0.65rem, 1vw, 0.875rem);
}

/* 受賞歴内のmore-link調整 */
.awards__item .more-link-wrapper {
    padding: 0;
}

.awards__item .more-link-wrapper a {
    padding: 0;
}

/* ===========================================
   Member Page Styles
   ページ: member
   セクション: Member Profile, Company Info
   参照: 公開サイト member.css
   =========================================== */

/*  Member （経歴セクション） */
.member-card__name .member-card__name-text {
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--text-darkest);
    font-size: clamp(1.5rem, 1.1rem + 0.74vw, 1.75rem);
}

p.member-card__position {
    font-size: clamp(1.125rem, 0.825rem + 0.555vw, 1.3125rem);
    font-weight: var(--font-weight-bold);
}

.member__detail {
    margin-top: var(--space-20);
}

.member__detail p {
    font-size: clamp(1rem, 0.737rem + 0.496vw, 1.1875rem);
}

/*  Company Info Component（会社情報セクション） */
.company-info .company-info__title {
    text-align: center;
    margin-bottom: var(--space-40);
}

.company-info__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.company-info__message {
    color: var(--wp--preset--color--text-darkest);
    font-size: clamp(1.25rem, 2vw, 1.625rem);
    font-weight: var(--font-weight-normal);
}

.company-info__text .more-link-wrapper {
    text-align: left;
    padding-top: var(--space-20);
    padding-bottom: 0;
}

.company-info__text .more-link-wrapper a {
    padding-left: 0;
}

.company-info__image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.company-info__image img {
    width: 100%;
    height: auto;
}

/* ===========================================
   Contact Page Styles
   ページ: contact
   セクション: contact
   =========================================== */
.contact__title {
    font-family: var(--font-family-serif);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-body-1);
    line-height: 160%;
    margin-bottom: var(--wp--preset--spacing--space-18);
}

.contact__lead {
    font-family: "Inter", sans-serif;
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-title-4);
    line-height: 24px;
    letter-spacing: -0.1px;
}

.contact-form {
    border-radius: var(--radius-8);
    background-color: var(--wp--preset--color--gray-lightest);
}

.form-field__label {
    font-weight: var(--font-weight-normal);
    color: var(--wp--preset--color--text-darkest);
}

.contact-form .required {
    color: var(--wp--preset--color--error);
    font-weight: var(--font-weight-normal);
}

.contact-form .optional {
    font-weight: var(--font-weight-normal);
}

.contact-form__check-text {
    margin-bottom: var(--wp--preset--spacing--space-6);
    color: var(--wp--preset--color--text-darkest);
    font-size: var(--font-size-body-5);
    font-weight: var(--font-weight-bold);
    line-height: 1.43;
    letter-spacing: -0.01em;         
    padding: var(--wp--preset--spacing--space-2);
}

.contact-form__check {
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    border-radius: var(--radius-5);
    border: 2px solid var(--wp--preset--color--gray-cool);
    background-color: var(--wp--preset--color--mono-white);
    appearance: none;    
    cursor: pointer;
    position: relative;
}

.contact-form__check:checked {
    background-color: var(--wp--preset--color--primary);
    border-color: var(--wp--preset--color--primary);
}

.contact-form__check:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4px;
    height: 10px;
    border: solid var(--wp--preset--color--mono-white);
    border-width: 0 2px 2px 0;
    transform: translate(-50%, -50%) rotate(45deg);
}    

.contact-form__check:focus {
    outline: 2px solid var(--wp--preset--color--primary);
    outline-offset: 2px;
}

.contact-form__submit {
    width: 262px;
    max-width: 100%;
    padding: 12px 18px;      
    border-radius: var(--radius-6);
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);           
    font-family: 'Inter', sans-serif;
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-body-4);
    line-height: 22px;
    letter-spacing: -0.1px;
    box-shadow: var(--shadow-xs);
    border: none;
    cursor: pointer;
    opacity: 1;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.contact-form__submit:hover {
    background-color: var(--wp--preset--color--primary-dark);
    box-shadow: var(--shadow-sm);
}

.contact-form__submit:focus {
    outline: none;
    box-shadow: var(--shadow-focus-strong);
}

.contact-form .wpcf7-not-valid-tip {
    color: var(--wp--preset--color--error);
    font-size: 0.9em;
    margin-top: var(--wp--preset--spacing--space-10);
}

/* 
   Contact Form 7 は改行を自動で <br> に変換する仕様がある
   レイアウト崩れ防止のため、フォーム内の <br> を非表示にする
*/
.contact-form br {
    display: none;
}

/* ===========================================
   Thanks Page Styles
   ページ: thanks
   セクション: thanks
   =========================================== */
.btn--thanks {
    width: 262px;
    max-width: 100%;
    padding: var(--wp--preset--spacing--space-12) var(--wp--preset--spacing--space-18);
    font-size: var(--font-size-body-4);
    line-height: 22px;
}

/* ===========================================
   Privacy Policy Page Styles
   ページ: privacy
   セクション: poliicy
   =========================================== */
.policy__title {
    color: var(--wp--preset--color--mono-black);
    text-align: center;
    margin-bottom: var(--wp--preset--spacing--space-24);
    border-bottom: 2px solid var(--wp--preset--color--primary-light); 
    padding-bottom: 8px;
}

.policy__heading {
    margin-top: var(--wp--preset--spacing--space-32);
    margin-bottom: var(--wp--preset--spacing--space-16);
    border-left: 4px solid var(--wp--preset--color--primary);
    padding-left: var(--wp--preset--spacing--space-8);
}

.policy__text {
    margin-bottom: var(--wp--preset--spacing--space-16);
}

.policy__list {
    list-style-type: decimal;
    padding-left: var(--wp--preset--spacing--space-48);
}

.policy__sublist {
    list-style-type: disc;
    padding-left: var(--wp--preset--spacing--space-48);
}

.policy__list li,
.policy__sublist li {
    margin-bottom: var(--wp--preset--spacing--space-16);
}

/* ===========================================
     News Page/Category Page Styles
     ページ: news/category
   =========================================== */

/* --- フィルターボタン --- */
.news__filter {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wp--preset--spacing--space-10);
}

.news__filter ul {
    display: flex;
    gap: 10px;
    list-style: none;
    padding: 0;
}

.news__filter .wp-block-navigation-item a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    border: 1px solid var(--wp--preset--color--primary-light);
    border-radius: var(--radius-5);
    font-size: var(--wp--preset--font-size--tiny, 0.75rem);
    font-weight: 500;
}

.news__filter .current-menu-item .wp-block-navigation-item__content {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);
}

.news-filter__button:not(.is-active) .wp-block-button__link {
    background-color: var(--wp--preset--color--mono-white);
    color: var(--wp--preset--color--text-darkest);
}

/* --- ニュースカード --- */
.news-card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 340px;
    height: 270px;
    overflow: hidden;
    border: 1px solid #EFF0F6;
}

.news-card:hover .news-card__image img {
    transform: scale(1.05);
}

.news-card__image {
    flex-shrink: 0;
    width: 100%;
    height: 170px;
    margin: 0;
    overflow: hidden;
}

.news-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.2s ease;
}

.news-card__body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: var(--wp--preset--spacing--space-10);
    flex: 1;
    min-height: 0;
    min-width: 0;
    padding: var(--wp--preset--spacing--space-10) var(--wp--preset--spacing--space-20);
}

.news-card__title {
    grid-column: 1 / -1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: var(--font-family-sans);
    font-size: var(--font-size-title-4);
    font-weight: var(--font-weight-bold);
    line-height: 1.4;
}

.news-card__title a {
    display: block;
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    text-decoration: none;
    color: inherit;
}

.news-card__date {
    grid-column: 1;
    justify-self: start;
    margin: 0;
    min-width: 0;
    font-size: var(--font-size-body-5);
    font-weight: 600;
    color: var(--wp--preset--color--mono-black);
}

.news-card__category {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: var(--wp--preset--spacing--space-4);
    min-width: 0;
    overflow: hidden;
    font-size: var(--wp--preset--font-size--tiny, 0.75rem);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--primary);
}

.news-card__category > * {
    display: inline-flex;
}

.news-card__category .wp-block-post-terms__separator {
    display: none;
}

.news-card__category a {
    display: inline-block;
    flex-shrink: 1;
    padding: var(--wp--preset--spacing--space-6) var(--wp--preset--spacing--space-10);
    border-radius: var(--radius-5);
    background-color: var(--wp--preset--color--primary-lightest);
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    font-size: var(--wp--preset--font-size--small);
}

.news-pagination__label {
    color: #6C757D;
    font-size: var(--font-size-body-5);
    margin-right: var(--wp--preset--spacing--space-5);
}

.news-pagination__select {
    padding: var(--wp--preset--spacing--space-4) 28px var(--wp--preset--spacing--space-4) var(--wp--preset--spacing--space-10);
    border: 1px solid #DFDFDF;
    border-radius: var(--radius-5);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.news-pagination__select-wrap {
    position: relative;
    margin-right: var(--wp--preset--spacing--space-30);
}

.news-pagination__select-wrap::before {
    content: "";
    position: absolute;
    top: var(--wp--preset--spacing--space-8);
    right: var(--wp--preset--spacing--space-8);
    border-left: var(--wp--preset--spacing--space-5) solid transparent;
    border-right: var(--wp--preset--spacing--space-5) solid transparent;
    border-bottom: var(--wp--preset--spacing--space-6) solid var(--wp--preset--color--text-medium);
    pointer-events: none;
}

.news-pagination__select-wrap::after {
    content: "";
    position: absolute;
    right: var(--wp--preset--spacing--space-8);
    bottom: var(--wp--preset--spacing--space-8);
    border-left: var(--wp--preset--spacing--space-5) solid transparent;
    border-right: var(--wp--preset--spacing--space-5) solid transparent;
    border-top: var(--wp--preset--spacing--space-6) solid var(--wp--preset--color--text-medium);
    pointer-events: none;
}

.wp-block-query-pagination {
    display: flex;
    align-items: center;
    gap: var(--wp--preset--spacing--space-10);
}

.wp-block-query-pagination a,
.wp-block-query-pagination span {
    color: var(--wp--preset--color--text-medium);
    line-height: 1;
    text-decoration: none;
    transition: background-color 0.2s;
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: #DFDFDF;
    border-radius: var(--radius-5);
    font-size: var(--wp--preset--font-size--normal);
    line-height: 1;
}

.wp-block-query-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

.wp-block-query-pagination .page-numbers.current {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--mono-white);
}

.wp-block-query-pagination a:hover {
    background: #f5f5f5;
    color: #6C757D;
}

/* ===========================================
    Single Page Styles
   ページ: single
   セクション: single-news
   =========================================== */
.single-news__back a {
    color: #0B2A3A;
    font-size: var(--font-size-body-4);
    font-weight: var(--font-weight-bold);
    text-decoration: none;
}

.single-news__title {
    font-family: var(--font-family-sans);
}

.single-news__date {
    font-size: var(--font-size-body-3);
    font-weight: var(--font-weight-bold);
}

.single-news__category a {
    display: inline-block;
    font-size: var(--wp--preset--font-size--small);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--primary);
    background: var(--wp--preset--color--primary-lightest);
    border-radius: var(--radius-5);
    text-decoration: none;
    padding: var(--wp--preset--spacing--space-6) var(--wp--preset--spacing--space-10);
}

/* 本文全体 */
.single-news__content {
    color: var(--wp--preset--color--text-darkest);
}

.single-news__content p {
    color: inherit;
    font-size: var(--font-size-body-5);
    font-weight: var(--font-weight-bold);
}
  
  /* 見出し */
  .single-news__content h1,
  .single-news__content h2,
  .single-news__content h3,
  .single-news__content h4,
  .single-news__content h5,
  .single-news__content h6 {
      font-family: var(--font-family-sans);
      color: var(--wp--preset--color--mono-black);
  }  

  /* リンク */
.single-news__content a {
    color: #003DF5;
    font-weight: var(--font-weight-bold);
    text-decoration: underline;
}

/* ============================================================
   トップページ News セクション
   ============================================================ */
.section-news .page-intro-header {
    text-align: left;
}

.section-news .more-link-wrapper {
    text-align: right;
}

.section-news__list {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--wp--preset--spacing--space-40);
    padding-right: var(--wp--preset--spacing--space-40);
}

.news-list-item {
    display: flex;
    align-items: center;
    gap: var(--wp--preset--spacing--space-20);
    padding: var(--wp--preset--spacing--space-20) 0;
    border-bottom: 1px solid var(--wp--preset--color--primary-lightest);
}

.news-list-item__date {
    font-size: var(--wp--preset--font-size--medium);
    font-weight: var(--font-weight-bold);
    color: var(--wp--preset--color--text-medium);
    white-space: nowrap;
    flex-shrink: 0;
    width: var(--wp--preset--spacing--space-80);
}

.news-list-item__category {
    flex-shrink: 0;
    width: 7.5rem;
}

.news-list-item__category a {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    padding: var(--wp--preset--spacing--space-6) var(--wp--preset--spacing--space-10);
    background-color: var(--wp--preset--color--primary-lightest);
    color: var(--wp--preset--color--primary);
    font-size: var(--wp--preset--font-size--small);
    font-weight: var(--font-weight-bold);
    border-radius: var(--radius-5);
    text-decoration: none;
    white-space: nowrap;
}

.news-list-item__title {
    flex: 1;
}

.news-list-item__title a {
    color: var(--wp--preset--color--text-darkest);
    text-decoration: none;
    font-size: var(--wp--preset--font-size--medium);
    font-family: var(--wp--preset--font-family--sans-serif-base);
}
