/*
 * about.css — ABOUT ページ専用スタイル
 * 参考 SVG: ABOUT_pc.svg (width=1440px / design baseline=1420px)
 * フルイドレスポンシブ: 770px〜1920px, clamp() ベース
 *
 * clamp() 計算ルール:
 *   最小値 = 設計値 × (770/1420) ≈ 54%
 *   推奨値 = (設計値px / 1420) * 100vw
 *   最大値 = 設計値 × (1920/1420) ≈ 135%
 *
 * html font-size は廃止し、全値を clamp(min, vw, max) で直接指定。
 */

/* html font-size は common.css の clamp() で一元管理 */

/* ========================================
   ABOUT MAIN SECTIONS
   ======================================== */
.about-sections {
    max-width: clamp(770.000px, 100.000vw, 1980.000px);
    width: clamp(770.000px, 100.000vw, 1980.000px);
    margin: 0 0;
    background: #FBFBF8;
}

/* about FV starts at the page top under the fixed transparent header. */
.low_fv {
    margin-top: 0;
}

.about-page .low_fv__catch {
    top: clamp(292.714px, 38.056vw, 753.500px);
}

/* 各セクション共通コンテナ */
.about-section {
    /* 左右 padding: 設計 120px → clamp(65px, 8.45vw, 162px) */
    padding: 0 clamp(64.083px, 8.333vw, 165.000px);
    box-sizing: border-box;
    scroll-margin-top: clamp(55px, 7.18vw, 97px); /* 設計 102px */
}

/* 上部区切り線 */
.about-section::before {
    content: '';
    display: block;
    height: 1px;
    background: #000000;
}

.about-sections > .about-section:first-child::before {
    display: none;
}

.about-page .cta {
    padding-top: clamp(42.722px, 5.556vw, 110.000px);
    padding-bottom: clamp(42.78px, 5.556vw, 110px);
}

.about-page .page-breadcrumb {
    padding-left: clamp(65px, 8.333vw, 162px);
    margin: 0 0 clamp(85.444px, 11.111vw, 220.000px);
}

/* 2カラムレイアウト
   設計: 左=635px / 右=565px (合計1200px)
   フルイド: 52.9% / 47.1%
*/
.about-section__inner {
    display: grid;
    grid-template-columns: 53.33% 46.67%;
    column-gap: 0;
    padding: clamp(22px, 2.82vw, 54px) 0 clamp(42.722px, 5.556vw, 110.000px);
    /* 設計: 4rem(40px) 0 6rem(60px) */
    align-items: start;
}

.about-section__inner > :nth-child(2) {
    padding-bottom: clamp(21.389px, 2.778vw, 55px);
}

/* セクション区切り線 (非表示) */
.about-section__divider {
    display: none;
}

/* 左カラム: 英語ラベル
   設計: font-size=48px */
.about-section__label {
    font-family: 'Proxima Nova', 'Montserrat', Arial, sans-serif;
    font-size: clamp(26px, 3.33vw, 65px);
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.1;
    color: #000000;
    margin: 0;
}

/* 右カラム: 日本語見出し
   設計: font-size=48px */
.about-section__headline {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(26px, 3.33vw, 65px);
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.3;
    color: #000000;
    margin: 0 0 clamp(22px, 2.82vw, 54px);
}

.about-section__headline__bottomless {
    margin-bottom: 0;
}

.about-section__headline--second {
    margin-top: clamp(22px, 2.82vw, 54px);
}

/* 右カラム: 本文テキスト
   設計: font-size=14px */
.about-section__body {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    line-height: 2;
    letter-spacing: 0.05em;
    color: #000000;
    margin: 0 0 clamp(15.507px, 2.014vw, 39.875px);
    padding-top: clamp(21.389px, 2.778vw, 55px);
}

/* ========================================
   MISSION STATEMENT — ダイアグラム
   設計: diagram w=396px h=387px
   ======================================== */
.about-mission__layout {
    display: flex;
    gap: clamp(32px, 4.17vw, 81px);
    align-items: flex-start;
}

.about-mission__diagram {
    position: relative;
    width: clamp(214px, 27.50vw, 535px);
    height: clamp(209px, 26.88vw, 523px);
    margin-top: clamp(72.188px, 9.375vw, 185.625px);
    margin-left: clamp(37px, 4.72vw, 92px);
}

.about-mission__circle {
    position: absolute;
    width: clamp(123px, 15.99vw, 307px);
    height: clamp(123px, 15.99vw, 307px);
    border: clamp(0.535px, 0.069vw, 1.375px) solid #A50C27;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.about-mission__circle span {
    font-family: 'Proxima Nova', 'Montserrat', Arial, sans-serif;
    font-size: clamp(8.544px, 1.111vw, 22.000px);
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #8F001A;
    text-align: center;
}

.about-mission__circle--1 {
    top: 0;
    left: clamp(43px, 5.63vw, 108px);
}

.about-mission__circle--2 {
    bottom: 0;
    left: 0;
}

.about-mission__circle--3 {
    bottom: 0;
    right: 0;
}

.about-mission__items {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: clamp(13px, 1.69vw, 32px);
}

.about-mission__item-title {
    position: relative;
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(10px, 1.25vw, 24px);
    font-weight: 700;
    color: #A50C27;
    margin: 0 0 clamp(3px, 0.42vw, 8px);
    letter-spacing: 0.05em;
}

.about-mission__item-title::first-letter {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.about-mission__item-title::before {
    content: "○";
    position: absolute;
    left: 1%;
    top: 50%;
    font-size: clamp(5.347px, 0.694vw, 13.75px);
    line-height: 1;
    transform: translateY(-50%);
}

.about-mission__item-title {
    padding-left: 1.2em;
}

.about-mission__item-body {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    line-height: 1.9;
    color: #000000;
    margin: 0;
    letter-spacing: 0.05em;
    padding-left: clamp(12px, 1.5vw, 28.8px);
}

/* ========================================
   VALUE — カードグループ
   ======================================== */
.about-value__cards {
    background: #FBFBF8;
    padding: clamp(49px, 6.25vw, 122px) clamp(65px, 8.33vw, 162px) clamp(38px, 4.93vw, 96px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: clamp(38px, 4.86vw, 95px);
}

.about-value__card {
    position: relative;
}

/* 閲覧大数字 01/02/03 */
.about-value__card-num {
    position: absolute;
    top: clamp(-11px, -1.41vw, -27px);
    left: 0;
    font-family: 'Proxima Nova', 'Montserrat', Arial, sans-serif;
    font-size: clamp(97px, 12.50vw, 243px);
    font-weight: 700;
    color: rgba(0, 0, 0, 0.06);
    line-height: 1;
    letter-spacing: -0.02em;
    pointer-events: none;
    user-select: none;
}

/* カード本体 2カラム */
.about-value__card-body {
    display: grid;
    gap: clamp(43px, 5.56vw, 108px);
    align-items: center;
    padding-top: clamp(32px, 4.17vw, 81px);
}

.about-value__card-body--text-first {
    grid-template-columns: 1fr 1fr;
}

.about-value__card-body--img-first {
    grid-template-columns: 1fr 1fr;
}

/* タイトル 設計: 40px */
.about-value__card-title {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(18px, 2.36vw, 46px);
    font-weight: 700;
    line-height: 1.3;
    color: #000000;
    margin: 0 0 clamp(13px, 1.69vw, 32px);
}

.about-value__card-desc {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    line-height: 2;
    color: #000000;
    margin: 0;
}

.about-value__card-img-wrap {
    width: 100%;
}

.about-value__card-imgs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(6px, 0.83vw, 16px);
}

.about-value__placeholder {
    width: 100%;
    height: clamp(173px, 22.54vw, 432px);
    background: #d8d8d8;
    border-radius: clamp(4px, 0.56vw, 11px);
}

.about-value__card-imgs .about-value__placeholder {
    height: clamp(140px, 18.31vw, 351px);
}

/* ========================================
   MESSAGE — 代表メッセージ
   設計: 左=テキスト / 右=CEOポートレート(560px固定→フルイド)
   ======================================== */
/* VALUE section uses the shared services carousel markup. Keep the carousel
   behavior intact and align only the about-page sizing/placement to the SVG. */
#value .about-section__inner {
    padding: clamp(24px, 3.06vw, 59px) 0 clamp(32px, 4.17vw, 80px);
}

#value .about-section__inner--value {
    padding-bottom: clamp(5.347px, 0.694vw, 13.75px);
}

#value .about-section__headline {
    font-weight: 700;
    line-height: 1.33;
    margin-bottom: 0;
    width: clamp(285px, 79.49vw, 611px);
}

#value .services__item {
    position: relative;
    grid-template-columns: clamp(316px, 40.56vw, 779px) clamp(367px, 47.22vw, 907px);
    gap: 0;
    align-items: start;
    width: calc(100% + clamp(35px, 4.44vw, 85px));
    padding: clamp(24px, 3.06vw, 59px) 0 clamp(19.25px, 2.5vw, 49.5px);
}

#value .services__item--03 {
    padding-bottom: clamp(64.167px, 8.333vw, 165px);
}

#value .services__item--reverse {
    grid-template-columns: clamp(367px, 47.22vw, 907px) 1fr;
    column-gap: clamp(114.431px, 14.861vw, 294.250px);
    width: calc(100% + clamp(65px, 8.33vw, 162px));
    margin-left: calc(clamp(65px, 8.33vw, 162px) * -1);
}

#value .services__item::before {
    content: "01";
    position: absolute;
    top: var(--top-80);
    left: 0;
    width: clamp(108.958px, 14.167vw, 280.500px);
    height: clamp(108.958px, 14.167vw, 280.500px);
    display: block;
    background: none;
    color: transparent;
    font-family: "Aktiv Grotesk", Arial, sans-serif;
    font-size: clamp(85.444px, 11.111vw, 220.000px);
    font-weight: 700;
    line-height: 0.82;
    letter-spacing: 0em;
    -webkit-text-stroke: clamp(0.8px, 0.104vw, 2px) #a50c27;
    text-stroke: clamp(0.8px, 0.104vw, 2px) #a50c27;
    pointer-events: none;
    z-index: 0;
    opacity: 0.1;
}

#value .services__item:nth-of-type(3)::before {
    content: "02";
    left: clamp(428.292px, 55.694vw, 1102.750px);
}

#value .services__item:nth-of-type(4)::before {
    content: "03";
}

#value .services__item-text {
    position: relative;
    z-index: 1;
    max-width: clamp(278.05px, 36.111vw, 714.48px);
    gap: var(--top-36);
    padding-top: clamp(68.361px, 8.889vw, 176.000px);
    padding-left: clamp(50px, 6.46vw, 124px);
}

#value .services__item--reverse .services__item-text {
    margin-left: 0;
    padding-left: 0;
    max-width: clamp(228.326px, 29.653vw, 587.125px);
}

#value .services__item-name {
    font-size: clamp(18px, 2.36vw, 45px);
    font-weight: 700;
    line-height: 1.65;
    letter-spacing: 0.05em;
    margin-bottom: 0;
}

#value .services__item-desc {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(7.49px, 0.972vw, 19.25px);
    font-weight: 500;
    line-height: 1.86;
    letter-spacing: 0.05em;
    margin-bottom: 0;
}

#value .services__item-images {
    width: calc(clamp(367px, 47.22vw, 907px) + clamp(30px, 3.89vw, 75px));
    height: clamp(173px, 22.22vw, 432px);
    margin-top: clamp(65px, 8.40vw, 161px);
    border-radius: clamp(5px, 0.69vw, 13px) 0 0 clamp(5px, 0.69vw, 13px);
    background-color: #ffffff;
}

#value .services__item:not(.services__item--reverse) .services__item-images {
    width: calc(clamp(367px, 47.22vw, 907px) + clamp(30px, 3.89vw, 75px));
    margin-right: 0;
}

#value .services__item--reverse .services__item-images {
    margin-top: clamp(65px, 8.40vw, 161px);
    border-radius: 0 clamp(5px, 0.69vw, 13px) clamp(5px, 0.69vw, 13px) 0;
}

#value .value-scroll-blob {
    position: absolute;
    top: clamp(-116px, -6.04vw, -46px);
    right: clamp(-520px, -27.08vw, -208px);
    z-index: 0;
    width: clamp(360px, 50vw, 960px);
    height: auto;
    opacity: 0.65;
    pointer-events: none;
}

#value .services__item--reverse .value-scroll-blob {
    right: auto;
    left: clamp(-520px, -27.08vw, -208px);
}

#value .services__item-images {
    --services-slide-width: clamp(173px, 22.22vw, 432px);
    --services-gap: clamp(1.069px, 0.139vw, 2.75px);
    --services-scroll-offset: calc(-4 * (var(--services-slide-width) + var(--services-gap)));
}

#value .services__img-track {
    position: relative;
    z-index: 1;
    gap: var(--services-gap);
    animation-name: services-img-scroll-about;
}

#value .services__item-img,
#value .services__item-img img {
    width: var(--services-slide-width);
    height: var(--services-slide-width);
}

@keyframes services-img-scroll-about {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(var(--services-scroll-offset));
    }
}

.about-message__body {
    display: grid;
    grid-template-columns: 1fr clamp(302px, 38.89vw, 756px);
    gap: clamp(43px, 5.56vw, 108px);
    padding: 0;
    box-sizing: border-box;
    align-items: start;
}

.about-message__text {
    max-width: clamp(278.056px, 36.111vw, 715px);
    display: flex;
    flex-direction: column;
    gap: clamp(11px, 1.41vw, 27px);
}

.about-message__text p {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    line-height: clamp(13.903px, 1.806vw, 35.75px);
    letter-spacing: 0.05em;
    color: #000000;
    margin: 0;
}

.about-message__sig {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    color: #000000;
    margin-top: clamp(42.722px, 5.556vw, 110.000px) !important;
}

.about-message__sig span {
    display: inline-block;
    margin-top: clamp(4.278px, 0.556vw, 11px);
    font-size: clamp(11px, 1.39vw, 27px);
    font-weight: 500;
}

/* CEOポートレート 設計: 560px */
.about-message__portrait {
    width: 100%;
    height: auto;
    display: block;
    flex-shrink: 0;
}

/* ========================================
   BOARD MEMBER
   ======================================== */
.about-section--board {
    background: #FBFBF8;
    padding: 0 clamp(65px, 8.33vw, 162px);
    box-sizing: border-box;
    position: relative;
}

.about-section--message {
    padding-bottom: clamp(64.083px, 8.333vw, 165.000px);
}

.about-board__inner {
    padding: clamp(21.361px, 2.778vw, 55.000px) 0 clamp(64.083px, 8.333vw, 165.000px);
}

.about-board__label-wrap {
    position: relative;
    margin-bottom: clamp(37.431px, 4.861vw, 96.25px);
}

.about-board__blob {
    display: none;
}

/* gradient blob */
.about-board__blob-img {
    position: absolute;
    top: 0;
    left: clamp(-189px, -24.65vw, -473px);
    width: clamp(377px, 49.15vw, 943px);
    height: clamp(462px, 60.14vw, 1153px);
    opacity: 0.65;
    pointer-events: none;
    z-index: 0;
}

.about-section--board .about-board__inner {
    position: relative;
    z-index: 1;
}

/* 3列グリッド */
.about-board__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(22px, 2.85vw, 55px);
    position: relative;
    z-index: 1;
}

.about-board__card {
    display: flex;
    flex-direction: column;
}

/* 写真ラッパー */
.about-board__photo-wrap {
    width: 100%;
    border-radius: clamp(9px, 1.13vw, 22px);
    overflow: hidden;
    margin-bottom: var(--top-18);
}

.about-board__photo-img {
    width: 100%;
    height: auto;
    display: block;
}

/* 役職名 設計: 13px */
.about-board__title {
    font-family: 'Yu Gothic UI', 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(10px, 1.11vw, 22px);
    font-weight: 600;
    color: #000000;
    letter-spacing: 0.1em;
}

/* 氏名: 設計 28px */
.about-board__name {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(19px, 2.50vw, 49px);
    font-weight: 500;
    color: #000000;
    margin: 0;
    letter-spacing: 0.05em;
    line-height: var(--top-32);
    margin-top: var(--top-10);
    margin-bottom: var(--top-10);
}

/* ローマ字: 設計 14px */
.about-board__name-en {
    font-family: 'Proxima Nova', 'Montserrat', Arial, sans-serif;
    font-size: clamp(10px, 1.11vw, 22px);
    font-weight: 600;
    color: #000000;
    margin: 0 0 var(--top-26);
    letter-spacing: 0.1em;
}

/* 略歴テキスト: 設計 13px */
.about-board__bio {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(10px, 0.97vw, 19px);
    font-weight: 500;
    line-height: 1.86;
    color: #000000;
    margin: 0;
    letter-spacing: 0.05em;
}

#purpose,
#mission,
#vision,
#value,
#message,
#board-member,
#company {
    scroll-margin-top: clamp(64.691px, 8.401vw, 166.348px);
}

/* ========================================
   COMPANY — 会社概要
   ======================================== */

/* COMPANY のみ右カラムを 660px 比率に */
#company .about-section__inner {
    grid-template-columns: 39.6% 60.4%;
}

#company {

}

#company::after {
    content: '';
    display: block;
    height: 1px;
    background: #000000;
    margin-top: clamp(64.083px, 8.333vw, 165.000px);
}

#company .about-section__content-col{
    margin-top: var(--top-73);
    padding-left: var(--top-7);
}
.about-company__table {
    width: clamp(383.617px, 49.861vw, 987.250px);
    border-collapse: collapse;
}

.table_line {
    width: var(--top-18);
    border: 1px solid #000;
}

.about-company__table th,
.about-company__table td {
    padding: clamp(11px, 1.46vw, 28px) 0;
    border-bottom: clamp(0.535px, 0.069vw, 1.375px) solid #000000;
    vertical-align: top;
    text-align: left;
    letter-spacing: 0.05em;
}

.about-company__table th {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    color: #000000;
    white-space: nowrap;
    padding-right: var(--top-60);
    width: clamp(54.542px, 7.083vw, 140.25px);
}

.about-company__table td {
    font-family: 'Zen Kaku Gothic Antique', 'Noto Sans JP', sans-serif;
    font-size: clamp(11px, 0.99vw, 19px);
    font-weight: 500;
    color: #000000;
    line-height: 1.8;
}

.about-company__table tbody tr:last-child th,
.about-company__table tbody tr:last-child td {
    border-bottom: 0;
}

/* 住所の入れ子 */
.about-company__address {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--top-24);
}

.about-company__address > div {
    display: grid;
    grid-template-columns: clamp(109.493px, 14.236vw, 281.875px) 1fr;
    gap: var(--top-24);
}

.about-company__address dt {
    font-weight: 500;
}

.about-company__address dd {
    margin: 0;
}

/* 建物・集合写真 */
.about-company__photo {
    width: 100%;
    height: auto;
    display: block;
    border-radius: clamp(5px, 0.70vw, 14px);
}

.about-company__photo--sp {
    display: none;
}

/* ========================================
   共通プレースホルダー
   ======================================== */
.about-placeholder {
    background: #d8d8d8;
    border-radius: clamp(4px, 0.56vw, 11px);
}

.about-placeholder--wide {
    border-radius: 0;
}

@media screen and (max-width: 769px) {
    .about-page .about-sections {
        width: 100%;
        max-width: none;
        overflow: hidden;
    }

    .about-page .about-section,
    .about-page .about-section--board {
        padding: 0 var(--sp-24);
        scroll-margin-top: 18vw;
    }

    .about-page .page-breadcrumb {
        padding-left: var(--sp-24);
        margin-bottom: var(--sp-95);
    }

    .about-page .about-section__inner,
    .about-page #company .about-section__inner {
        display: grid;
        grid-template-columns: 1fr;
        padding: var(--sp-40) 0 0;
    }

    .about-page .about-section__label-col {
        margin-bottom: var(--sp-42);
    }

    .about-page .about-section__label {
        font-size: 8.205vw;
        line-height: 1.05;
        letter-spacing: 0.1em;
    }

    .about-page .about-section__headline {
        font-size: var(--sp-32);
        line-height: 1.42;
        letter-spacing: 0.01em;
        margin-bottom: 8.205vw;
    }

    .about-section__inner > :nth-child(2) {
        padding-bottom: 0;
    }

    .about-page .about-section__headline--second {
        margin-top: 8.205vw;
    }

    .about-page .about-section__body {
        padding-top: 0;
        margin: 0 0 7.692vw;
        font-size: 3.59vw;
        line-height: 2.05;
        letter-spacing: 0.05em;
    }

    .about-page .about-mission__layout {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10.256vw;
    }

    .about-page .about-mission__diagram {
        order: 2;
        width: clamp(315px, 87.69vw, 675px);
        height: clamp(307px, 85.64vw, 659px);
        margin: 0 auto;
    }

    .about-page .about-mission__circle {
        width: clamp(180px, 50.26vw, 386px);
        height: clamp(180px, 50.26vw, 386px);
    }

    .about-page .about-mission__circle span {
        font-size: 3.59vw;
        line-height: 1.2;
    }

    .about-page .about-mission__circle--1 {
        left: 16.923vw;
    }

    .about-page .about-mission__items {
        order: 1;
        gap: 7.692vw;
    }

    .about-page .about-mission__item-title {
        font-size: 4.103vw;
        line-height: 1.45;
        margin-bottom: 2.564vw;
        padding-left: 4.103vw;
    }

    .about-page .about-mission__item-title::before {
        left: 0;
        font-size: 2.051vw;
    }

    .about-page .about-mission__item-body {
        font-size: 3.59vw;
        line-height: 2;
    }

    .about-page #value .about-section__inner,
    .about-page #value .about-section__inner--value {
        padding: var(--sp-40) 0 var(--sp-34);
    }

    .about-page #value .about-section__headline {
        margin-bottom: 0;
        width: clamp(285px, 79.49vw, 611px);
    }

    .about-page #value .services__item,
    .about-page #value .services__item--reverse {
        display: flex;
        flex-direction: column;
        width: 100%;
        margin-left: 0;
        gap: 7.692vw;
        padding: 7.692vw 0 var(--sp-10);
    }

    .about-page #value .services__item--03 {
        padding-bottom: var(--sp-80);
    }

    .about-page #value .services__item::before {
        top: var(--sp-58);
        left: 0;
        width: clamp(109px, 30.26vw, 233px);
        height: clamp(118px, 32.82vw, 252px);
        background: none;
        font-size: var(--sp-100);
        line-height: 0.82;
    }

    .about-page #value .services__item--reverse::before {
        left: auto;
        right: 0;
    }

    .about-page #value .services__item--03::before {
        left: 0;
        right: auto;
    }

    .about-page #value .services__item-text,
    .about-page #value .services__item--reverse .services__item-text {
        display: flex;
        max-width: none;
        gap: 5.128vw;
        padding: 19.487vw 0 0;
        margin: 0;
    }

    .about-page #value .services__item--reverse .services__item-text {
        align-items: flex-end;
        text-align: right;
    }

    .about-page #value .services__item-name {
        font-size: var(--sp-24);
        line-height: 1.5;
        letter-spacing: 0.05em;
    }

    .about-page #value .services__item-desc {
        font-size: 3.59vw;
        line-height: 2;
        letter-spacing: 0.05em;
    }

    .about-page #value .services__item-images,
    .about-page #value .services__item:not(.services__item--reverse) .services__item-images,
    .about-page #value .services__item--reverse .services__item-images {
        --about-value-slide: 44.615vw;
        order: 2;
        width: calc(100vw - var(--sp-24));
        height: var(--about-value-slide);
        margin-top: 0;
        background: #fff;
    }

    .about-page #value .services__item:not(.services__item--reverse) .services__item-images,
    .about-page #value .services__item--03 .services__item-images {
        margin-left: 0;
        margin-right: calc(var(--sp-24) * -1);
        border-radius: 2.564vw 0 0 2.564vw;
        align-self: flex-end;
    }

    .about-page #value .services__item--reverse .services__item-images {
        margin-left: calc(var(--sp-24) * -1);
        margin-right: 0;
        border-radius: 0 2.564vw 2.564vw 0;
        align-self: flex-start;
    }

    .about-page #value .services__img-track {
        gap: 0.513vw;
        animation-name: services-img-scroll-about-sp;
    }

    .about-page #value .services__item-img,
    .about-page #value .services__item-img img {
        width: var(--about-value-slide);
        height: var(--about-value-slide);
    }

    .about-page #value .value-scroll-blob {
        top: clamp(-237px, -30.77vw, -111px);
        right: clamp(-434px, -56.41vw, -202px);
    }

    #value .services__item--reverse .value-scroll-blob {
        left: clamp(-513px, -66.67vw, -239px);
        top: var(--sp-20);
    }

    .about-page #value .value-scroll-blob_03 {
        top: 0;
    }

    .about-page .about-section--message {
        padding-bottom: var(--sp-80);
    }

    .about-page .about-message__body {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10.256vw;
    }

    .about-page .about-message__text {
        max-width: none;
        gap: 5.128vw;
    }

    .about-page .about-message__text p {
        font-size: 3.59vw;
        line-height: 2;
    }

    .about-page .about-message__sig {
        margin-top: var(--sp-20) !important;
        font-size: 3.59vw;
        line-height: 1.9;
        font-weight: 700;
    }

    .about-page .about-message__sig span {
        font-size: var(--sp-20);
    }

    .about-page .about-message__portrait {
        width: 100%;
        border-radius: 2.564vw;
    }

    .about-page .about-board__inner {
        padding: var(--sp-40) 0 20.513vw;
    }

    .about-page .about-board__label-wrap {
        margin-bottom: var(--sp-43);
    }

    .about-page .about-board__blob-img {
        top: var(--sp-60);
        left: clamp(-394px, -51.28vw, -184px);
        width: 100%;
        height: auto;
    }

    .about-page .about-board__grid {
        grid-template-columns: 1fr;
        gap: 15.385vw;
    }

    .about-page .about-board__photo-wrap {
        border-radius: 2.564vw;
        margin-bottom: 6.154vw;
    }

    .about-page .about-board__title {
        font-size: 3.333vw;
        line-height: 1.5;
    }

    .about-page .about-board__name {
        font-size: 7.179vw;
        line-height: 1.45;
        margin-top: var(--sp-8);
    }

    .about-page .about-board__name-en {
        font-size: 3.59vw;
        margin-bottom: var(--sp-25);
        margin-top: var(--sp-4);
    }

    .about-page .about-board__bio {
        font-size: var(--sp-14);
        line-height: 1.9;
    }

    .about-page #company .about-section__content-col {
        margin-top: 0;
    }

    .about-page .about-company__table,
    .about-page .about-company__table tbody,
    .about-page .about-company__table tr,
    .about-page .about-company__table th,
    .about-page .about-company__table td {
        display: block;
        width: 100%;
    }

    .about-page .about-company__table tr {
        border-bottom: clamp(0.535px, 0.069vw, 1.375px) solid #E2E2E2;
        padding: var(--sp-24) 0;
    }

    .about-page .about-company__table th,
    .about-page .about-company__table td {
        border-bottom: 0;
        padding: 0;
        font-size: 3.59vw;
        line-height: 1.9;
    }

    .about-page .about-company__table th {
        margin-bottom: 2.564vw;
        padding-right: 0;
        font-weight: 700;
    }

    .about-page .about-company__address {
        gap: var(--sp-24);
    }

    .about-page .about-company__address > div {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .about-page .about-company__photo {
        margin-top: var(--sp-36);
        border-radius: 2.564vw;
        width: clamp(315px, 87.69vw, 675px);
        height: clamp(221px, 61.54vw, 473px);
        object-fit: cover;
    }

    .about-page .about-company__photo:not(.about-company__photo--sp) {
        display: none;
    }

    .about-page .about-company__photo--sp {
        display: block;
    }

    .about-page #company::after {
        margin-top: clamp(111px, 30.77vw, 237px);
    }

    .about-page #mission .about-section__inner {
        display: flex;
        flex-direction: column;
        padding-bottom: 20.513vw;
    }

    .about-page #mission .about-section__label-col,
    .about-page #mission .about-section__content-col {
        display: contents;
    }

    .about-page #mission .about-section__label {
        order: 1;
        margin-bottom: 10.256vw;
    }

    .about-page #mission .about-section__headline {
        order: 2;
        margin-bottom: 10.256vw;
    }

    .about-page #mission .about-mission__diagram {
        order: 3;
        margin-bottom: 11.282vw;
    }

    .about-page #mission .about-section__body {
        order: 4;
    }

    .about-page #mission .about-mission__items {
        order: 5;
    }

    .about-page #value .services__item,
    .about-page #value .services__item--reverse {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .about-page #value .services__item-text,
    .about-page #value .services__item--reverse .services__item-text {
        display: contents;
    }

    .about-page #value .services__item-name {
        order: 1;
        margin: 0 0 var(--sp-40);
        padding-top: 19.487vw;
    }

    .about-page #value .services__item-images,
    .about-page #value .services__item:not(.services__item--reverse) .services__item-images,
    .about-page #value .services__item--reverse .services__item-images {
        order: 2;
        margin-bottom: 7.692vw;
    }

    .about-page #value .services__item-desc {
        order: 3;
        margin: 0;
    }

    .about-page #value .services__item--reverse .services__item-name,
    .about-page #value .services__item--reverse .services__item-desc {
        text-align: left;
    }

    .about-page #value .services__item--reverse .services__item-name {
        text-align: right;
    }

    .about-page .about-message__body {
        display: flex;
        flex-direction: column;
    }

    .about-page .about-message__portrait {
        order: 1;
        margin-bottom: 0;
    }

    .about-page .about-message__text {
        order: 2;
    }

    .about-page .about-board__inner {
        overflow: visible;
    }

    .about-page .about-board__grid {
        display: flex;
        grid-template-columns: none;
        gap: var(--sp-24);
        width: 100vw;
        margin-left: calc(var(--sp-24) * -1);
        padding: 0 var(--sp-55);
        box-sizing: border-box;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: var(--sp-55);
        scrollbar-width: none;
    }

    .about-page .about-board__grid::-webkit-scrollbar {
        display: none;
    }

    .about-page .about-board__card {
        flex: 0 0 calc(100vw - (var(--sp-55) * 2));
        scroll-snap-align: center;
        scroll-snap-stop: always;
    }

    .about-page .about-board__dots {
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 2.564vw;
        margin-top: var(--sp-40);
    }

    .about-page .about-board__dot {
        display: block;
        width: 2.051vw;
        height: 2.051vw;
        border-radius: 50%;
        background: rgba(165, 12, 39, 0.11);
    }

    .about-page .about-board__dot--active {
        background: #000;
    }

    @keyframes services-img-scroll-about-sp {
        0% {
            transform: translateX(0);
        }

        100% {
            transform: translateX(calc(-4 * (44.615vw + 0.513vw)));
        }
    }
}

@media screen and (max-width: 769px) {
    .about-page .about-board__grid {
        display: flex;
        gap: var(--sp-24);
        width: 100vw;
        margin-left: calc(var(--sp-24) * -1);
        padding: 0 var(--sp-55);
        box-sizing: border-box;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: var(--sp-55);
        scrollbar-width: none;
    }

    .about-page .about-board__grid::-webkit-scrollbar {
        display: none;
    }

    .about-page .about-board__card {
        flex: 0 0 calc(100vw - (var(--sp-55) * 2));
        width: calc(100vw - (var(--sp-55) * 2));
        scroll-snap-align: center;
        scroll-snap-stop: always;
    }

    .about-page .about-board__photo-wrap {
        width: 100%;
        height: calc(100vw - (var(--sp-55) * 2));
        margin-bottom: var(--sp-30);
        border-radius: 2.564vw;
    }

    .about-page .about-board__photo-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .about-page .about-board__dots {
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 2.564vw;
        margin-top: 7.692vw;
    }

    .about-page .about-board__dot {
        display: block;
        width: 2.051vw;
        height: 2.051vw;
        border-radius: 50%;
        background: rgba(165, 12, 39, 0.11);
    }

    .about-page .about-board__dot--active {
        background: #a50c27;
    }

    .about-page .about-company__table tbody > *:nth-child(1) {
        padding-top: 0;
    }

    .about-page .about-company__table tbody tr:last-child {
        border-bottom: 0;
    }

    .about-page .about-company__address > div {
        display: grid;
        grid-template-columns: 28.205vw minmax(0, 1fr);
        gap: var(--sp-16) var(--sp-40);
        align-items: start;
    }

    .about-page .about-company__address dt,
    .about-page .about-company__address dd {
        min-width: 0;
    }

    .about-page .about-company__address-row--sp-gap-24 {
        margin-top: var(--sp-8);
    }
}

@media screen and (max-width: 769px) {
    .about-page #value .services__item-images,
    .about-page #value .services__item:not(.services__item--reverse) .services__item-images,
    .about-page #value .services__item--reverse .services__item-images,
    .about-page #value .services__item--03 .services__item-images {
        --services-slide-width: 71.795vw;
        --services-gap: 0.513vw;
        --services-scroll-offset: calc(-4 * (var(--services-slide-width) + var(--services-gap)));
        order: 2;
        justify-self: auto;
        align-self: auto;
        width: 93.846vw;
        height: 71.795vw;
        margin: 0 0 var(--sp-24) 0;
        border-radius: 2.564vw;
        background: #fff;
        overflow: hidden;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .about-page #value .services__img-track {
        gap: var(--services-gap);
        width: max-content;
        animation-name: services-img-scroll-about-sp-index;
        animation-duration: 45s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }

    .about-page #value .services__item-img,
    .about-page #value .services__item-img img {
        width: var(--services-slide-width);
        height: var(--services-slide-width);
    }

    .about-page #value .services__item-img {
        flex-shrink: 0;
        border-radius: 0;
        overflow: hidden;
    }

    .about-page #value .services__item-img img {
        object-fit: cover;
    }

    @keyframes services-img-scroll-about-sp-index {
        0% {
            transform: translateX(0);
        }

        100% {
            transform: translateX(var(--services-scroll-offset));
        }
    }
}

@media screen and (max-width: 769px) {
    .about-page #value .services__item--reverse .services__item-name {
        width: max-content;
        max-width: 100%;
        margin-left: auto;
        margin-right: 0;
        text-align: right;
    }

    #purpose,
    #mission,
    #vision,
    #value,
    #message,
    #board-member,
    #company {
        scroll-margin-top: var(--sp-72);
    }

    #purpose,
    #vision {
        padding-bottom: var(--sp-40);
    }

    .table_line {
        width: var(--sp-16);
    }
}