/* CSS Document */
.sr-only{
    position:absolute;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

.base_next_btn{
    width: 100%;
    max-width: 260px;
    height: 64px;
    display: flex;
    border-radius: 999px;
    background: var(--text-gray_5, #282B33);
    color: var(--text-gray_100, #FFF);
    font-size: 16px;
    font-weight: 500;
    line-height: 100%; /* 16px */
    letter-spacing: 0.32px;
    padding: 24px 32px 0 40px ;
    justify-content: space-between;
    transition: all 0.4s;
}

.base_next_btn:hover{
    background: #5666BE;
    color: #FFF;
}

.sub_kv{
    margin-top: 80px;
    position: relative;
    width: 100%;
    overflow-x: hidden;
}

.sub_kv .sub_kv__inner{
    padding: 76px 40px 0;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    height: 394px;
    position: relative;
}

.sub_kv.culture .sub_kv__inner{
    height: 406px;
}

.sub_kv.culture .sub_kv__inner.top{
    height: 436px;
}

.sub_kv.culture.entry .sub_kv__inner{
    height: 330px;
}

.sub_kv .sub_kv__inner h2{
    width: 100%;
    position: relative;
    z-index: 2;
}

.sub_kv h2 span{
    color: var(--text-gray_25, #8E8E8E);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 14px */
    margin-bottom: 15px;
    display: block;
}

.sub_kv .sub_kv__inner p{
    margin-top: 108px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.32px;
}

.sub_kv .sub_kv__marquee{
    position: absolute;
    left: 0;
    top: 248px;
    width: 100%;
    height: 88px;
    z-index: 1;
}

.sub_kv.culture .sub_kv__marquee{
    top: 150px;
}

.sub_kv .sub_kv__marquee p{
    /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
    position: relative;
    margin: 0;
    overflow: hidden;      /* はみ出しを隠す */
    width: 100%;
    height: 88px;
}

.sub_kv .sub_kv__marquee p svg{
    display: block;
    height: auto;
}


.sub_kv__marquee{
    margin: 0;
    width: 100%;
    overflow: hidden;
}

.sub_kv__marquee-track{
    display: flex;
    width: max-content;
    will-change: transform;
    animation: topEntryMarquee 18s linear infinite;
}



.sub_kv__marquee-item{
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
}

.sub_kv__marquee-item.mr{
    margin-right: 40px;
}

/* SVGの高さは見た目に合わせて調整 */
.sub_kv__marquee-item svg{
    display: block;
    height: 190px;  /* 必要なら */
    width: auto;
}

.sub_kv.entry .sub_kv__marquee,
.sub_kv.our_company .sub_kv__marquee,
.sub_kv.data .sub_kv__marquee,
.sub_kv .sub_kv__marquee.member{
    height: 110px;
}

.sub_kv.entry .sub_kv__marquee p,
.sub_kv.our_company .sub_kv__marquee p,
.sub_kv.data .sub_kv__marquee p,
.sub_kv .sub_kv__marquee.member p{
    /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
    height: 110px;
}

.sub_kv .sub_kv__marquee.member,
.sub_kv.culture .sub_kv__marquee,
.return-kv .sub_kv__marquee{
    height: 115px;
}
.sub_kv .sub_kv__marquee.member p,
.sub_kv.culture .sub_kv__marquee p,
.return-kv .sub_kv__marquee p{
    /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
    height: 115px;
}

.sub_kv.msg .sub_kv__marquee{
    height: 112px;
}
.sub_kv.msg .sub_kv__marquee p{
    /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
    height: 112px;
}

.sub_kv.data .sub_kv__marquee{
    top: 150px;
}

@media (max-width: 900px){

    .base_next_btn{
        width: 100%;
        max-width: 208px;
        height: 48px;
        font-size: 14px;
        letter-spacing: 0.28px;
        padding: 17px 24px 0 24px ;
    }

    .base_next_btn.w100{
        max-width: 100%;
    }

    .base_next_btn svg{
        width: 12px;
        height: auto;
    }

    .sub_kv{
        margin-top: 84px;
        position: relative;
        width: 100%;
        overflow-x: hidden;
    }

    .sub_kv.member.detail{
        margin-top: 54px;
    }

    .sub_kv .sub_kv__inner{
        padding: 0px 20px 0;
        width: 100%;
        max-width: 100%;
        height: auto;
    }

    .sub_kv.culture .sub_kv__inner{
        height: auto;
    }
    .sub_kv.culture .sub_kv__inner.top{
        height: auto;
    }
    .sub_kv.culture.entry .sub_kv__inner{
        height: 130px;
    }
    .sub_kv h2 span{
        font-size: 12px;
        margin-bottom: 10px;
    }

    .sub_kv.culture h2 svg{
        width: 260px;
        height: auto;
    }

    .sub_kv.data.employee-benefits h2 svg{
        width: 194px;
        height: auto;
    }

    .sub_kv.culture.our_company h2 svg{
        width: 115px;
        height: auto;
    }

    .sub_kv.culture.jobs h2 svg{
        width: 116px;
        height: auto;
    }

    .sub_kv.msg h2 svg{
        width: 335px;
        max-width: 100%;
        height: auto;
    }

    .sub_kv.culture.entry h2 svg{
        width: 161px;
        max-width: 100%;
        height: auto;
    }

    .sub_kv .sub_kv__inner p{
        margin: 60px auto 40px;
        font-size: 14px;
        line-height: 200%; /* 28px */
        letter-spacing: 0.28px;
    }

    .sub_kv .sub_kv__marquee{
        top: 123px;
        height: 88px;
        z-index: 1;
    }

    .sub_kv.culture .sub_kv__marquee{
        top: 40px;
    }

    .sub_kv.msg .sub_kv__marquee{
        top: 80px;
    }

    .sub_kv.msg{
        padding-bottom: 90px;
    }

    .sub_kv .sub_kv__marquee p{
        /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
        height: 70px;
    }

    .sub_kv .sub_kv__marquee p svg{
        height: 65px;
        width: auto;
    }

    /* SVGの高さは見た目に合わせて調整 */
    .sub_kv__marquee-item svg{
        height: 70px;  /* 必要なら */
    }

}

@media (max-width: 768px) {
    .sub_kv.data h2 svg{
        max-width: 317px;
        height: auto;
    }

    .sub_kv.data .sub_kv__inner p{
        margin: 60px auto 40px;
    }

    .sub_kv.data .sub_kv__marquee{
        top: 40px;
    }
}

/* TOP
------------------------------------------------------------*/

/* =========================
   KV (full viewport split)
========================= */
.kv{
    height: 100vh;
    display: flex;
    width: 100%;
    position: relative;
    min-height: 550px;
}

/* split はそのまま */
.kv__split{
    position: relative;
    width: 50%;
    overflow: hidden;   /* 窓 */
}

/* ===== 追加ここから ===== */

/* 3枚縦スタック用 */
.kv__stack{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 300%;              /* 3枚分 */
    transform: translateY(0);
    will-change: transform;

    transform-style: preserve-3d;
}

/* stack 内の画像 */
.kv__stack .kv__img{
    position: relative;
    inset: auto;
    width: 100%;
    height: calc(100% / 3);
    object-fit: cover;

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}
@media (min-width: 769px) {
    .kv__img.sp { display: none; }
}

/* SPのとき：PC画像を非表示にして高さをなくす */
@media (max-width: 768px) {
    .kv__img.pc { display: none; }
}



/* 画像は全面カバー */
.kv__img{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 左側：薄い暗幕 + コピー */
.kv__split--left{
    color: #fff;
}

.kv__overlay{
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.25); /* ここで暗さ調整 */
    z-index: 1;
}

/* コピー（左下寄せ） */
.kv__content{
    position: absolute;
    z-index: 2;
    line-height: 0;
    left: 0;
    top: 0%;
    height: 100%;
    line-height: 0;
    font-size: 0; /* 空白文字による隙間も完全に消す */
    display: flex;
    align-items: end;
}

.kv__content img{
    display: block;

}

/* スマホは縦積み */
@media (max-width: 900px){

    .kv__content{
        padding: 0;
    }

    .kv{
        height: 100%;           /* iOS含め安定 */
        min-height: 600px;        /* 任意：小さすぎ対策 */
        display: block;
        width: 100%;
        position: relative;
    }

    .kv__split{
        position: relative;
        width: 100%;
        overflow: hidden;
    }

    /* 画像は全面カバー */
    .kv__img{
        position: relative;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }



    /* 左側：薄い暗幕 + コピー */
    .kv__split--left{
        color: #fff;
    }

    .kv__overlay{
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,.25); /* ここで暗さ調整 */
        z-index: 1;
    }

    /* コピー（左下寄せ） */
    .kv__content{
        position: absolute;
        z-index: 2;
    }

    .kv__content img{
        width: 184px;
        height: auto;
    }

    .kv__lead{
        margin: 0;
        font-weight: 800;
        letter-spacing: .02em;
        line-height: 1.05;
        font-size: clamp(44px, 5vw, 92px);
        text-shadow: 0 10px 30px rgba(0,0,0,.35);
    }

    .kv{
        height: auto;        /* svhを解除 */
        min-height: auto;
        /*margin-top: 54px;*/
    }

    .kv__split{
        height: 375px;       /* ★ 見える窓の高さを固定 */
    }

    /* stack は3枚分なので 375px * 3 */
    .kv__stack{
        height: calc(375px * 3);
    }

    .kv__stack .kv__img{
        top: 0;
        height: 375px;       /* 1枚ぶんを固定 */
    }
}

@media screen and (max-width: 768px) {
    .kv{
        margin-top: 54px;
    }
}


.top-message{
    width: 100%;
    max-width: 630px;
    margin: 180px auto 0;
}

.top-message .top-message__eyebrow{
    color: var(--text-gray_25, #8E8E8E);
    font-size: 14px;
    font-weight: 500;
    line-height: 100%; /* 14px */
    letter-spacing: 0.28px;
}

.top-message .top-message__title{
    margin-top: 28px;
}

.top-message .top-message__body{
    margin-top: 45px;

}

.top-message .top-message__body p{
    color: var(--text-gray_5, #282B33);
    font-family: "Noto Sans JP";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 230%; /* 50px */
    letter-spacing: 0.4px;
    white-space: nowrap;
}

@media screen and (max-width: 1000px) {
    .top-message .top-message__body p {
        white-space: wrap;
    }
}

.top-message .top-message__btn{
    margin-top: 45px;
}

@media screen and (max-width: 768px) {
    .top-message{
        width: 100%;
        max-width: 100%;
        margin: 75px auto 0;
        padding: 0 20px;
    }

    .top-message .top-message__eyebrow{
        font-size: 12px;
    }

    .top-message .top-message__title{
        margin-top: 15px;
    }

    .top-message .top-message__title svg{
        width: 100%;
        max-width: 335px;
        height: auto;
    }

    .top-message .top-message__body{
        margin-top: 30px;
        width: 100%;
    }

    .top-message .top-message__body p{
        font-size: 16px;
        line-height: 220%; /* 35.2px */
        letter-spacing: 0.32px;
        white-space: wrap;
    }

    .top-message .top-message__btn{
        margin-top: 30px;
    }
}

/* =========================
   Top flowing slider
========================= */
.top-photoFlow{
    width: 100%;
    overflow: hidden;
    margin-top: 120px;
}

.top-photoFlow__track{
    display: flex;
    width: max-content;
    gap: 0 !important; /* ★念のため強制リセット（これがないとズレる原因に） */
    will-change: transform;
    margin-bottom: 0px;
}

.top-photoFlow__track,
.top-photoFlow__track img {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    /* 画像のフチがチラつくのを防ぐ */
    -webkit-font-smoothing: antialiased;
}

.top-photoFlow__item img,
.top-member-card__image img,
.top-member-card__body{
    -webkit-user-drag: none; /* Chrome, Safari用 */
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    pointer-events: none; /* クリックやドラッグの対象から外す */
}

.top-photoFlow__set{
    display: flex;
    align-items: center;
    gap: 24px;
    padding-right: 24px;
    flex: 0 0 auto; /* ★ここを追加！セットの幅が縮むのを防ぐ */
}

.top-photoFlow__item{
    flex: 0 0 auto;
    border-radius: 18px;
    overflow: hidden;

}

.top-photoFlow__item img{
    display: block;
    width: 100%;
    object-fit: cover;
}

/* sizes (ざっくり添付の雰囲気) */
.top-photoFlow__item.is-md{ width: 375px;}
.top-photoFlow__item.is-lg{ width: 668px;}

/* Respect reduced motion */



/* シーン1全体のエリア */

.culture-hero__title{
    position: absolute;
    left: 0;
    top: 7vh;
    width: 100%;
    text-align: center;
    z-index: 10;
}

.culture-hero__btn{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 7vh;
    width: 260px;
    text-align: center;
    z-index: 101;
}

.culture-hero__btn .top-member__more{
    margin-top: 0;
}

.culture-hero__btn,
.culture-hero__title{
    opacity: 0;
}

.culture-hero__title svg{
    display: inline-block;
}

.culture-hero__scene2{
    height: 100vh;                 /* 画面いっぱい */
    background: url(../images/culture/bg.png) repeat;
    background-size: auto;
    background-size: 25px 25px;
}

.culture-hero {
    height: 100vh;                 /* 画面いっぱい */
    background: var(--primary-corporate_blue, #5666BE);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    position: relative;
    overflow: hidden;
    margin-top: 160px;
}

/* テキストのコンテナ（最前面） */
.culture-hero__inner {
    position: relative;
    z-index: 5;
    text-align: center;
}

/* 1行目：細くて長い文字 */
.culture-hero__line1 {
    margin: 0;
}

/* 2行目：太くて大きい文字 */
.culture-hero__line2 {
    margin: 27px 0 0;
    text-align: center;
}

/* ドット（今回はJSで常に非表示にしているが、層は整える） */
.culture-hero__dot {
    display: block;
    width: 20px;
    height: 20px;
    margin: 0;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1);
    transform-origin: center center;
    opacity: 0;
    z-index: 4; /* sceneより上、テキストより下 */
}

/* ★ scene2 / scene3 共通（全面・中央） */
/* ★ scene2〜scene9 共通（全面・中央） */
.culture-hero__scene2,
.culture-hero__scene3,
.culture-hero__scene4,
.culture-hero__scene5,
.culture-hero__scene6,
.culture-hero__scene7,
.culture-hero__scene8,
.culture-hero__scene9{
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;                 /* JSで切替 */
}

/* scene2 だけ丸マスク（展開用） */
.culture-hero__scene2{
    clip-path: circle(0% at 50% 50%);
    z-index: 2;
}



/* scene3〜scene9 は scene2 より上（切替で前面） */
.culture-hero__scene3{ z-index: 3; }
.culture-hero__scene4{ z-index: 3; }
.culture-hero__scene5{ z-index: 3; }
.culture-hero__scene6{ z-index: 3; }
.culture-hero__scene7{ z-index: 3; }
.culture-hero__scene8{ z-index: 3; }
.culture-hero__scene9{ z-index: 3; }

/* 3Dキャンバスを全面表示（scene2/scene3両方） */
#scene2-3d,
#scene3-3d,
#scene4-3d,
#scene5-3d,
#scene6-3d,
#scene7-3d,
#scene8-3d,
#scene9-3d{
    position: absolute;
    inset: 0;
}

#scene2-3d canvas,
#scene3-3d canvas,
#scene4-3d canvas,
#scene5-3d canvas,
#scene6-3d canvas,
#scene7-3d canvas,
#scene8-3d canvas,
#scene9-3d canvas{
    display: block;
    /*width: 100%;
  height: 100%;*/
}

/* ScrollTrigger pin時の微妙な隙間/ちらつき対策（任意） */
.culture-hero{
    transform: translateZ(0);
}

.culture-hero__scene2,
.culture-hero__scene3,
.culture-hero__scene4,
.culture-hero__scene5,
.culture-hero__scene6,
.culture-hero__scene7,
.culture-hero__scene8,
.culture-hero__scene9{
    /*will-change: opacity, clip-path;*/
}

.culture-hero__scene3{
    background: url(../images/top/ani_last.webp) no-repeat center center;
    background-size: cover;
    opacity: 1;
    width: 100%;
    height: 100%;
}

/* scene3の親 */
.culture-hero__scene3 {
    z-index: 100; /* 念のため一番手前に */
    /*opacity: 1 !important; /* ★これで強制的に見せる */
    /*visibility: visible !important; /* ★念のためこれも */
    opacity: 0;
    background: none;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

/* 16:9枠（デバッグ用 赤枠付き） */
.culture-hero__frame16x9 {
    position: relative;
    width: min(100vw, calc(100vh * 16 / 9));
    height: min(100vh, calc(100vw * 9 / 16));
    aspect-ratio: 16 / 9;

    background: url(../images/top/ani_last.webp) no-repeat center center;
    background-size: contain;

    /* デバッグ用の赤枠 */
    pointer-events: auto;
}

canvas {
    display: block;
    /*width: 100% !important;
  height: 100% !important;*/
}

.top-Movie{
    width: 100%;
    height: 100vh;
    background: url(../images/top/movie.jpg) no-repeat center center;
    background-size: cover;
    position: relative;
}

.top-Movie a{
    display: block;
    width: 100%;
    height: 100%;
}

.top-Movie a div{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 300px;
    transform: translate(-50%,-50%) scale(1);
    transition: transform .35s ease;
    display: flex;
    flex-direction: column;     /* ←これ */
    justify-content: center;
    align-items: center;
    gap: 23px;                  /* ←SVGと文字の間隔 */
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.80);
    box-shadow: 0 3.491px 6.982px 0 rgba(0, 0, 0, 0.05);
}

.top-Movie a svg{
    position: relative;
    left: 8px;
}

.top-Movie a:hover div {
    transform: translate(-50%,-50%) scale(1.15); /* 300 → 約345 */
}

.top-Movie a span{
    display: block;
    color: var(--primary-corporate_blue, #5666BE);
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 22px */
    letter-spacing: 0.44px;
    width: 100%;
}

@media screen and (max-width: 768px) {

    .top-photoFlow{
        margin-top: 80px;
    }

    .top-photoFlow__track{
        margin-bottom: 0px;
    }

    .top-Movie{
        width: 100%;
        height: 280px;

    }

    .top-Movie{
        width: 100%;
        height: 280px;
        background: url(../images/top/movie_sp.jpg) no-repeat center center;
        background-size: cover;
        position: relative;
    }

    .top-Movie a div{

        width: 144px;
        gap: 8px;                  /* ←SVGと文字の間隔 */
        height: 144px;
    }

    .top-Movie a svg{
        position: relative;
        left: 4px;
    }

    .top-Movie a svg{
        width: 32px;
        height: auto;
    }

    .top-Movie a:hover{
        transform: none; /* 300 → 約345 */
    }

    .top-Movie a span{
        font-size: 13px;
        line-height: 100%; /* 13px */
        letter-spacing: 0.26px;
    }

    .top-photoFlow__item.is-md{ width: 200px;}
    .top-photoFlow__item.is-lg{ width: 357px;}

    .culture-hero__btn{
        width: 208px;
        bottom: 12vh;
    }

    .culture-hero__title{
        top: 9vh;
    }

    .culture-hero__title svg{
        width: 260px;
        height: auto;
    }
}

/* =========================
   Top Member
========================= */
.top-member{
    padding: 160px 0 120px;
    background: #fff;
}

.top-member__inner{
    width: min(1200px, 100% - 64px);
    margin: 0 auto;
}

/* header */
.top-member__eyebrow,
.top-recruit__eyebrow,
.top-company__eyebrow{
    margin: 0 0 14px;
    color: var(--text-gray_25, #8E8E8E);
    font-size: 14px;
}

.top-member__title{
    margin: 0;
    font-style: normal;
    font-weight: 500;
}

/* slider */
.top-member__slider{
    position: relative;
    margin-top: 60px;
}

/* list */
.top-member__list{
    display: flex;
    gap: 32px;
    padding: 0 0 0px;
    margin: 0;
    list-style: none;
}

/* card */
.top-member-card{
    flex: 0 0 360px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

.top-member-card a{
    display: block;
    position: relative;
}

/* image */
.top-member-card__image{
    margin: 0;
    height: 450px;
    position: relative;
    z-index: 1;

}
.top-member-card__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    z-index: 1;
    display: none;
}

.top-member-card__image img.ab{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

.top-member-card__image img.active{
    display: block;
}

/* body */
.top-member-card__body{
    padding: 15px 20px;
    color: var(--text-gray_100, #FFF);
    font-size: 20px;
    font-weight: 500;
    line-height: 125%; /* 25px */
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 104px;
    z-index: 3;
}


.top-member-card__meta{
    margin-top: 5px ;
    font-size: 14px;
    position: absolute;
    bottom: 15px;
}

/* color variations */
.top-member-card01 .top-member-card__body{ background:#194989; }
.top-member-card02 .top-member-card__body{ background:#788C9E; }
.top-member-card03 .top-member-card__body{ background:#00A4C7; }
.top-member-card04 .top-member-card__body{ background:#788C9E; }
.top-member-card05 .top-member-card__body{ background:#81B04D; }
.top-member-card06 .top-member-card__body{ background:#194989; }

/* nav */

.top-member__footer{
    position: relative;
}

.top-member__nav{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    gap: 16px;
}

.top-member__nav-btn{
    width: 52px;
    height: 52px;
    border-radius: 52px;
    border: 1px solid var(--text-gray_5, #282B33);
    cursor: pointer;
    position: relative;
    background:#FFF;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;;
}


/* footer */
.top-member__more{
    margin-top: 48px;
}


/* responsive */
@media screen and (max-width: 768px) {
    .top-member__inner{
        width: min(1200px, 100% - 32px);
    }
    .top-member-card{
        flex-basis: 300px;
    }
    .top-member-card__image{
        height: 254px;
    }
    .top-member{
        padding: 80px 0;
    }

    .top-member__inner{
        width: 100%;
        padding: 0 20px;
        margin: 0 auto;
    }

    /* header */
    .top-member__eyebrow,
    .top-recruit__eyebrow,
    .top-company__eyebrow{
        margin: 0 0 15px;
        font-size: 12px;
    }

    .top-member__title{
        margin: 0;
    }

    .top-member__title svg{
        width: 306px;
        height: auto;
    }

    /* slider */
    .top-member__slider{
        margin-top: 40px;
    }

    /* list */
    .top-member__list{
        gap: 16px;
    }

    /* card */
    .top-member-card{
        flex: 0 0 180px;
        border-radius: 6px;
    }

    /* image */
    .top-member-card__image{
        margin: 0;
        height: 254px;
    }

    /* body */
    .top-member-card__body{
        padding: 12px 10px;
        font-size: 14px;
        height: 80px;
        z-index: 5;
        opacity: 1;
    }

    .top-member-card__meta{
        margin-top: 5px ;
        font-size: 12px;
    }


    .top-member__nav{
        display: flex;
        gap: 8px;
    }

    .top-member__nav-btn{
        width: 40px;
        height: 40px;
        border-radius: 40px;
    }

    .top-member__nav-btn svg{
        width: 12px;
        height: auto;
    }

    /* footer */

    .top-member__more{
        margin-top: 40px;
    }

    /* 1行目：細くて長い文字 */
    .culture-hero__line1 img{
        width: 85.86vw;
        height: auto;
    }

    /* 2行目：太くて大きい文字 */
    .culture-hero__line2 {
        margin: 2.6vw 0 0;
    }

    .culture-hero__line2 img{
        width: 53.3vw;
        height: auto;
    }

    .culture-hero__frame16x9 {
        width: 100vw;
        height: 100%;
        aspect-ratio: auto;
        transform: none;
        position: relative; /* 追加 */
        background: none;
    }

    .culture-hero__overlay {
        position: absolute;
        top: 30vw;
        left: 0;
        width: 100%;
        height: auto; /* 縦横比を維持 */
        display: block;
    }

}

/* =========================
   Top Return
========================= */


.top-return {
    background: var(--primary-corporate_blue, #5666BE);
    color: #fff;
}

.top-return__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 160px 40px;
    display: flex;
    position: relative;
    justify-content: space-between;;
}

.top-return__inner .top-return__bg{
    position: absolute;
    left: 256px;
    top: 100px;
    z-index: 1;
}

.top-return__header{
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 13px;
}

/* 左 */
.top-return__content {
    flex: 1;
    max-width: 504px;
    width: 100%;
    padding-right: 10px;
}

.top-return__title {
    color: var(--text-gray_100, #FFF);
    font-size: 36px;
    font-weight: 700;
    line-height: 150%; /* 54px */
    letter-spacing: 0.72px;
}

.top-return__ratio {
    position: relative;
    top: 5px;
    right: 5px;
}

.top-return__lead {
    margin-top: 25px;
    color: var(--text-gray_100, #FFF);
    font-size: 16px;
    line-height: 200%; /* 32px */
}

.top-return__list {
    margin-top: 52px;
    border-top: 1px solid rgba(255,255,255,.3);
}

/* アイテム（リンク行） */
.top-return__item {
    border-bottom: 1px solid rgba(255,255,255,.3);
}

.top-return__item-link {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 24px 0;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

.top-return__item-link:hover svg,
.top-return__item-link:hover svg circle,
.top-return__item-link:hover svg path{
    transition: all 0.4s;
}

.top-return__item-link:hover svg{
    fill: #FFF;
}

.top-return__item-link:hover svg circle{
    stroke:#FFF;
}
.top-return__item-link:hover svg path{
    stroke:#5666BE;
}

/* サムネ */
.top-return__thumb img {
    width: 104px;
    height: 104px;
    object-fit: cover;
    border-radius: 4px;
}

/* テキスト */
.top-return__item-title {
    font-size: 20px;
    font-weight: 500;
}

.top-return__item-desc {
    margin-top: 12px;
    color: var(--text-gray_100, #FFF);
    font-size: 14px;
    font-weight: 400;
    line-height: 175%; /* 24.5px */
    letter-spacing: 0.56px;
    padding-right: 20px;
}

/* 矢印 */
.top-return__arrow {
    margin-left: auto;
    width: 40px;
    height: 40px;
    position: relative;
    transition: transform .2s ease;
}


/* hover */
.top-return__item-link:hover {
    /*opacity: 0.85;*/
}

.top-return__item-link:hover .top-return__arrow {
    transform: translateX(4px);
}

/* 右ビジュアル */
.top-return__visual {
    width: 100%;
    max-width: 510px;
}

@media screen and (max-width: 1100px) {
    .top-return__inner {
        padding: 160px 20px;
    }
    .top-return__title {
        font-size: 32px;
    }
}
@media screen and (max-width: 1000px) {

    .top-return__title {
        font-size: 26px;
    }
    .top-return__inner {
        align-items: end;
    }
    .top-return__visual {
        width: 100%;
        max-width: 300px;
    }

    .top-return__lead {
        width: 100%;
    }
}

.top-return__visual .top-return__image a{
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    position: relative;
}

.top-return__image img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    display: block;
    transition: all 0.4s;
}

.top-return__visual .top-return__image a:hover img{
    scale: 1.1;
}

.top-return__image img.active {
    scale: 1.1;
}

/* img2を最初から opacity で制御するように変更（推奨） */
.top-return__image img.img2 {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0; /* display: none の代わりに opacity */
    visibility: hidden;
    z-index: 2;
    transition: all 0.4s; /* transitionを共通で持たせる */
    scale: 1;
}

/* activeが付いた時の処理 */
.top-return__image img.img2.active {
    opacity: 1;
    visibility: visible;
}

.top-return__image img.img2.active2 {
    scale: 1.1;
}


/* ここのspはmemberの下へ移動 */

/* =========================
   Top Company
========================= */
/* セクション全体 */
.top-company {
    position: relative;
    padding: 336px 0 160px;
}

/* 背景写真 */
.top-company__bg {
    position: absolute;
    inset: 0 0 auto 0;
    height: 550px;
    background-image: url("../images/top/bg_company.jpg");
    background-size: cover;
    background-position: center;
    z-index: 0;
}

/* 中央寄せ */
.top-company__inner {
    position: relative;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}

/* 白パネル */
.top-company__panel {
    border-radius: 12px;
    background: var(--text-gray_75, #F2F2F3);
    padding: 80px;
}

/* 見出し */

.top-company__title {
    margin-top:13px;
}

/* リスト */
.top-company__list {
    margin-top: 64px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

/* アイテム */
.top-company__item {
    text-align: center;
    padding: 5px 0 16px;
    border-left: 1px solid #D4D4D4;

}

.top-company__item:first-child {
    border-left: none;
}

.top-company__item a{
    display: block;
}

/* アイコン枠（SVG差し込み用） */
.top-company__icon {
    display: flex;
    justify-content: center;
    height: 124px;
    align-items: center;
}

/* ラベル */
.top-company__label {
    margin-top: 15px;
    color: var(--text-gray_5, #282B33);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 27px */
    letter-spacing: 0.36px;
    height: 54px;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 768px) {
    .top-company {
        position: relative;
        padding: 140px 20px 0px;
    }

    /* 背景写真 */
    .top-company__bg {
        height: 400px;
    }

    /* 中央寄せ */
    .top-company__inner {
        max-width: 100%;
        margin: 0 auto;
        padding: 0;
    }

    /* 白パネル */
    .top-company__panel {
        border-radius: 6px;
        padding: 32px 35px 35px;
    }

    /* 見出し */

    .top-company__title {
        margin-top:12px;
    }

    .top-company__title svg{
        width: 230px;
        height: auto;
    }

    /* リスト */
    .top-company__list {
        margin-top: 15px;
        display: block;
    }

    /* アイテム */
    .top-company__item {
        text-align: center;
        padding: 0px;
        border-top: 1px solid #D4D4D4;
        border-left: none;

    }

    .top-company__item a{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px 16px 0;
    }

    .top-company__item:first-child {
        border-top: none;
    }

    /* アイコン枠（SVG差し込み用） */
    .top-company__icon {
        display: flex;
        height: auto;
        justify-content: center;
        width: 64px;
    }

    .top-company__icon svg{
        width: 100%;
        height: auto;
    }

    .top-company__item:first-child .top-company__icon svg{
        width: 54px;
    }

    .top-company__item:last-child .top-company__icon svg{
        width: 55px;
    }

    /* ラベル */
    .top-company__label {
        width: calc(100% - 104px);
        margin-top: 0px;
        text-align: left;
        font-size: 16px;
        font-weight: 500;
        line-height: 150%; /* 24px */
        letter-spacing: 0.32px;
        height: auto;
        display: block;
    }
}

/* =========================
   Top Recruit
========================= */
.top-recruit {
    padding: 0px 0 160px;
}

.top-recruit__inner {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-recruit__content{
    width: 100%;
    max-width: 292px;
    padding-right: 10px;
}


.top-recruit__title {
    margin-top: 8px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2;
    color: #111;
}

.top-recruit__lead {
    margin-top: 37px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.32px;
}


.top-recruit__btn {
    margin-top: 140px;
}

.top-recruit__btn-icon {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 50%;
    position: relative;
    flex: 0 0 auto;
}



.top-recruit__media {
    width: 100%;
    max-width: 790px;
    border-radius: 16px;
}

/* SP */
@media (max-width: 768px) {
    .top-recruit__inner {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .top-recruit__media {
        order: -1;
        min-height: 240px;
    }
    .top-recruit__title {
        font-size: 32px;
    }
    .top-recruit__actions {
        margin-top: 32px;
    }
}

@media screen and (max-width: 768px) {
    .top-recruit {
        padding: 80px 20px;
    }

    .top-recruit__inner {
        width: 100%;
        max-width: 100%;
        padding: 0 ;
        display: block;
    }

    .top-recruit__content{
        width: 100%;
        padding-right: 0;
        max-width: 100%;
    }


    .top-recruit__title {
        margin-top: 13px;
        font-size: 10px;
    }

    .top-recruit__title svg{
        width: 178px;
        height: auto;
    }

    .top-recruit__lead {
        margin-top: 20px;
        font-size: 15px;
        font-weight: 400;
        line-height: 200%; /* 30px */
        letter-spacing: 0.3px;
    }


    .top-recruit__btn {
        margin-top: 0px;
    }



    .top-recruit__media {
        width: 100%;
        max-width: 100%;
        margin: 30px 0 0;
        min-height: auto;
    }
}

/* =========================
   Top Entry
========================= */

.top-entry .top-entry__inner{
    width: 100%;
    height: 650px;
    background: url(../images/top/bg_entry.webp) no-repeat center center #5666BE;
    background-size: 2155px auto;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.top-entry .top-entry__inner a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 568px;
    height: 96px;
    border-radius: 999px;
    background: var(--text-gray_100, #FFF);

    /* btn_4 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 36px;
    font-weight: 700;
    line-height: 100%; /* 36px */
    letter-spacing: 2.88px;
    border: 3px solid #FFF;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .15s ease;
}

.top-entry .top-entry__inner a:hover{
    border-radius: 999px;
    border: 3px solid #FFF;
    background: var(--primary-corporate_blue, #5666BE);
    color: #FFF;
    /* btn_4 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.top-entry .top-entry__inner div{
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: 139px;
}

.top-entry p{
    /* いまの absolute は外す（無限スライドは下固定じゃなく“横流し”なので） */
    position: relative;
    margin: 0;
    overflow: hidden;      /* はみ出しを隠す */
    width: 100%;
    height: 139px;
}

.top-entry p svg{
    display: block;
    height: auto;
}

.top-entry__marquee{
    margin: 0;
    width: 100%;
    overflow: hidden;
}

.top-entry__marquee-track{
    display: flex;
    width: max-content;
    will-change: transform;
    animation: topEntryMarquee 18s linear infinite;
}

.top-entry__marquee-item{
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
    position: relative;
    top: -0px;
}

.top-entry__marquee-item.mr{
    margin-right: 80px;
}

/* SVGの高さは見た目に合わせて調整 */
.top-entry__marquee-item svg{
    display: block;
    height: 190px;  /* 必要なら */
    width: auto;
}

@keyframes topEntryMarquee{
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}


@media screen and (max-width: 768px) {
    .top-entry .top-entry__inner{
        background: url(../images/top/bg_entry_sp.png) no-repeat center center #5666BE;
        background-size: auto 168px;
        height: 305px;
    }

    .top-entry .top-entry__inner div{
        bottom: -0px;
    }

    .top-entry .top-entry__inner a{
        width: 240px;
        height: 48px;
        font-size: 20px;
        letter-spacing: 1.6px;
        border: 3px solid #FFF;
        transition: background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .15s ease;
    }

    .top-entry .top-entry__inner a:hover{
        background: #FFF;
        color: #5666BE;
    }

    /*
  .top-entry .top-entry__inner div{
    bottom: -5px;
    height: 56px;
  }

  .top-entry p{
    height: 56px;
  }
  .top-entry__marquee-item svg{
    height: 100%;
  }
  /*
  .top-entry p svg{
    display: block;
    width: auto;
    height: 56px;
  }




  .top-entry p,
  .top-entry__marquee-track,
  .top-entry p .top-entry__marquee-item svg{
    height: 80px;
  }
  .top-entry p .top-entry__marquee-item svg{
    height: 70px;
  }

  .top-entry__marquee-item{
   top: -4px;
  }
  */
    .top-entry .top-entry__inner div,
    .top-entry p .top-entry__marquee-item svg{
        height: 56px;
    }
}

/*TOP------------------------------------------------------------*/


/* MSG
------------------------------------------------------------*/

.msg_block01 .msg_block01__visial{
    width: 100%;
    height: 580px;
    background: url(../images/msg/image01.jpg) no-repeat center center;
    background-size: cover;
}

.msg_block__inner{
    width: 100%;
    max-width: 792px;
    margin: 110px auto 0;

}

.msg_block__inner h3 span.ttl{
    position: relative;
    color: var(--text-gray_5, #282B33);
    font-size: 30px;
    font-weight: 700;
    line-height: 150%; /* 45px */
    padding-left: 102px;
    display: block;
}

.msg_block__inner h3 span.ttl:before{
    content: "";
    display: block;
    width: 78px;
    height: 2px;
    background: var(--text-gray_5, #282B33);
    position: absolute;
    left: 0;
    top: 22px;
}

.msg_block__inner h3 span.catch{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
    display: block;
    margin-bottom: 15px;
}

.msg_block__inner p{
    margin-top: 35px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.32px;
}

.msg_block02{
    margin-top: 115px;
}

.msg_block02.last{
    margin-bottom: 120px;
}

.msg_block02 .msg_block02__visial{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.msg_block__inner h4{
    margin-top: 75px;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 30px;
    font-weight: 700;
    line-height: 100%; /* 30px */
    letter-spacing: 0.6px;
}

.msg_block__inner h4 span{
    display: block;
    color: var(--text-gray_25, #8E8E8E);
    font-size: 16px;
    font-weight: 500;
    line-height: 100%; /* 16px */
    letter-spacing: 0.32px;
    margin-top: 24px;
}

@media screen and (max-width: 768px) {

    .msg_block01 .msg_block01__visial{
        width: 100%;
        height: 220px;
        background: url(../images/msg/image01_sp.jpg) no-repeat center center;
        background-size: cover;
    }

    .msg_block__inner{
        width: 100%;
        max-width: 100%;
        padding: 0 20px;
        margin: 40px auto 0;

    }

    .msg_block__inner h3 span.ttl{
        position: relative;
        font-size: 20px;
        font-weight: 700;
        line-height: 150%; /* 30px */
        letter-spacing: 0.4px;
        padding-left: 48px;
    }

    .msg_block__inner h3 span.ttl:before{
        width: 40px;
        height: 2px;
        top: 15px;
    }

    .msg_block__inner h3 span.catch{
        position: relative;
        top: auto;
        font-size: 15px;
        line-height: 150%; /* 22.5px */
        letter-spacing: 0.3px;
        margin-bottom: 13px;

    }

    .msg_block__inner p{
        margin-top: 15px;
        font-size: 14px;
        font-weight: 400;
        line-height: 200%; /* 28px */
        letter-spacing: 0.28px;
    }

    .msg_block02{
        margin-top: 80px;
    }

    .msg_block02.last{
        margin-bottom: 80px;
    }

    .msg_block02 .msg_block02__visial{
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding: 0 20px;
    }

    .msg_block__inner h4{
        margin-top: 20px;
        font-size: 20px;
        line-height: 100%; /* 30px */
        letter-spacing: 0.4px;
    }

    .msg_block__inner h4 span{
        font-size: 14px;
        font-weight: 500;
        line-height: 100%; /* 14px */
        letter-spacing: 0.28px;
        margin-top: 13px;
    }
}

/*MSG------------------------------------------------------------*/


/* culture
------------------------------------------------------------*/
.culture_tub{
    border-top: 1px solid var(--text-gray_50, #D4D4D4);
    border-bottom: 1px solid var(--text-gray_50, #D4D4D4);
}
.culture_tub ul{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;

}

.culture_tub ul li{
    width: 50%;
}

.culture_tub ul li a{
    display: flex;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 80px;
    border: 1px solid var(--text-gray_50, #D4D4D4);
    background: var(--text-gray_75, #F2F2F3);
    color: var(--text-gray_25, #8E8E8E);
    font-size: 20px;
    font-weight: 700;
    line-height: 100%; /* 20px */
    letter-spacing: 0.4px;
    position: relative;
    border-top: none;
    border-bottom: none;
}

.culture_tub ul li:not(.active) a{
    transition: all 0.3s;
}

.culture_tub ul li:not(.active) a:hover{
    background: #5666BE;
    color: #FFF;
}

.culture_tub ul li.active a{
    background: var(--text-gray_100, #FFF);
    color: var(--primary-corporate_blue, #5666BE);
}

.culture_tub ul li.active a:before{
    content: "";
    display: block;
    width: 100%;
    height: 8px;
    background: var(--primary-corporate_blue, #5666BE);
    position: absolute;
    left: 0;
    top: 0;
}

.culture-tab-panel {
    display: none;
    opacity: 0;
}

.culture-tab-panel.is-active {
    display: block;
    opacity: 1;
}

.culture-tab-panels{
    background: url(../images/culture/bg.png) repeat;
    background-size: 25px 25px;
    padding-bottom: 120px;
}

.culture-tab-panel__visal01{
    width: 100%;
    height: 580px;
    background: url(../images/culture/image01.jpg) no-repeat center center;
    background-size: cover;
}

.culture-tab-panel h3{
    margin-top: 120px;
    text-align: center;
    font-size: 40px;
    font-weight: 500;
    line-height: 100%; /* 40px */
    letter-spacing: 0.8px;
}

/* ===== profile list ===== */
.profile-list{
    list-style: none;
    margin: 40px auto 0;
    padding: 0 40px;
    display: flex;
    justify-content: center;
    width: 100%;
    flex-wrap: wrap;
    max-width: 1280px;
}

.profile-card{
    width: 200px;
    text-align: center;
    color: #fff;
    margin-right: 40px;
    padding-bottom: 20px;
}

.profile-card:last-child{
    margin-right: 0;
}

/* circle photo */
.profile-card__photo{
    width: 200px;
    margin: 0 auto 16px;
}
.profile-card__photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* name badge */
.profile-card__name{
    display: inline-block;
    margin: 0 0 10px;
    padding: 1px 2px 3px;
    font-weight: 700;
    font-size: 20px;
    line-height: 1;
    letter-spacing: .02em;
}

/* english + dept */
.profile-card__en{
    margin: 0 0 8px;
    color: var(--primary-corporate_blue, #5666BE);
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    line-height: 100%; /* 12px */
    letter-spacing: 0.24px;
}
.profile-card__dept{
    color: var(--text-gray_5, #282B33);
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 125%; /* 18.75px */
    letter-spacing: 0.3px;
}

/* badge colors (適宜調整) */
.profile-card__name--blue{  background:#5666BE; }
.profile-card__name--orange{background:#D47F0F; }
.profile-card__name--green{ background:#81B04D; }
.profile-card__name--beige{ background:#A68C73; }
.profile-card__name--navy{  background:#788C9E; }

.profile-card__en.blue{  color:#5666BE; }
.profile-card__en.orange{color:#D47F0F; }
.profile-card__en.green{ color:#81B04D; }
.profile-card__en.beige{ color:#A68C73; }
.profile-card__en.navy{  color:#788C9E; }

@media screen and (max-width: 768px) {

    .culture_tub ul{
        width: 100%;
        max-width: 100%;
        padding: 0;
    }

    .culture_tub ul li{
        width: 50%;
    }

    .culture_tub ul li a{
        height: 72px;
        font-size: 15px;
        font-weight: 700;
        line-height: 125%; /* 18.75px */
        letter-spacing: 0.3px;
        text-align: center;
    }
    .culture-tab-panels{
        background-size: 25px 25px;
        padding-bottom:120px;
    }

    .culture-tab-panel__visal01{
        height: 220px;
        background: url(../images/culture/image01_sp.jpg) no-repeat center center;
        background-size: cover;
    }

    .culture-tab-panel h3{
        margin-top: 40px;
        font-size: 24px;
        letter-spacing: 0.48px;
    }

    /* ===== profile list ===== */
    .profile-list{
        list-style: none;
        margin: 24px auto 0;
        padding: 0 20px;
        display: flex;
        justify-content: center;
        width: 100%;
        flex-wrap: wrap;
        max-width: 1280px;
    }

    .profile-card{
        width: 111px;
        padding: 0 9px;
        margin-right: 0px;
    }

    .profile-card:nth-child(4n)::after {
        content: "";
        display: block;
        width: 100%;
    }

    .profile-card:nth-child(4),
    .profile-card:nth-child(5){
        margin-top: 20px;
    }

    .profile-card:last-child{
        margin-right: 0;
    }

    /* circle photo */
    .profile-card__photo{
        width: 100%;
        margin: 0 auto 7px;
    }
    .profile-card__photo img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    /* name badge */
    .profile-card__name{
        display: inline-block;
        margin: 0 0 4px;
        padding: 1px 2px 3px;
        font-size: 14px;
        line-height: 1;
        letter-spacing: 0.28px;
    }

    /* english + dept */
    .profile-card__en{
        margin: 0 0 3px;
        font-size: 10px;
        letter-spacing: 0.2px;
    }
    .profile-card__dept{
        font-size: 12px;
        letter-spacing: 0.24px;

    }

}


/* ==============================
  culture-talk (layout)
============================== */
.culture-talk{
    padding: 0;
}


.culture-talk__inner{
    width: 100%;
    max-width: 1280px;
    padding: 0 40px;
    margin: 100px auto 0;
    display: flex;
    justify-content: space-between;
}

/* ==============================
  Index (left)
============================== */
.culture-talk__index{
    padding-top: 16px;
    width: 280px;
}

.culture-talk__index-title{
    font-family: Roboto;
    font-size: 15px;
    font-weight: 500;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
    padding-bottom: 4px;
}

.culture-talk__index-list{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: hidden;
}

.culture-talk__index-list li{
    margin: 10px 0 0px;
}

.culture-talk__index-list a{
    color: var(--text-gray_5, #282B33);
    font-size: 15px;
    font-weight: 700;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
    position: relative;
    transition: all 0.4s;
    left: 0;
}

.culture-talk__index-list li.is-current > a{
    color: #5467ff; /* スクショの青っぽい強調 */
    left: -15px;
}

.culture-talk__index-list li.is-current > a span{
    display: inline-block;
    opacity: 1;
    transform: translateX(0);
    transition:
        opacity .25s ease,
        transform .25s ease;
}

/* active（現在地）：ドットを消す */
.culture-talk__index-list li.is-current a span{
    /*opacity: 0;
  transform: translateX(-6px);*/
}

/* hover（非current時だけ、少しだけ動かす） */
.culture-talk__index-list li:not(.is-current) a:hover span{
    transform: translateX(2px);
}


/* ==============================
  Right white card
============================== */
.culture-talk__card{
    width: 1014px;
    background: #fff;
    border-radius: 12px 0 0 12px;
    background: var(--text-gray_100, #FFF);
    padding: 120px 110px 165px 120px;
    position: relative;
    right: -80px;
}

/* block spacing */
.culture-talk__block + .culture-talk__block{
    margin-top: 40px;
}

.culture-talk__block + .culture-talk__block.long{
    margin-top: 120px;
}

/* 小カテゴリ（ものづくりの楽しさ みたいな） */
.culture-talk__kicker{
    margin: 0 0 10px;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 15px;
    font-weight: 700;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
}

/* 見出し：左に短い罫線 */
.culture-talk__headline{
    display: flex;

    margin: 0 0 35px;
}

.culture-talk__line{
    width: 78px;
    height: 2px;
    background: var(--text-gray_5, #282B33);
    margin-right: 24px;
    position: relative;
    top: 24px;
}

.culture-talk__h4{
    color: var(--text-gray_5, #282B33);
    font-size: 30px;
    font-weight: 700;
    line-height: 150%; /* 45px */
    letter-spacing: 0.6px;
}

/* 発言（左に小さな色タグ） */
.culture-talk__say{
    display: flex;
    justify-content: space-between;
    margin: 0 0 30px;
}

.culture-talk__say.mid{
    margin-bottom: 40px;
}

.culture-talk__say p,
.culture-talk__say > div{
    color: var(--series-ondo_mane, #07243A);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.32px;
    width: calc(100% - 102px);
}

.culture-talk__say ul.caution{
    margin-top: 25px;
}

.culture-talk__say ul.caution li{
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 200%; /* 24px */
    letter-spacing: 0.24px;
    text-indent: -2.6em;
    padding-left: 2.6em;
}

/* タグ（スクショの小さい四角） */
.culture-talk__tag{
    width: 47px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-corporate_blue, #5666BE);
    color: var(--text-gray_100, #FFF);
    font-size: 15px;
    font-weight: 500;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
    position: relative;
    top: 7px;
}

/* タグ色（スクショに近いトーン） */
.culture-talk__tag--blue{   background:#5666BE; }
.culture-talk__tag--orange{ background:#D47F0F; }
.culture-talk__tag--green{  background:#81B04D; }
.culture-talk__tag--brown{  background:#A68C73; }
.culture-talk__tag--navy{   background:#788C9E; }

/* ==============================
  responsive
============================== */
@media (max-width: 980px){
    .culture-talk__inner{
        grid-template-columns: 1fr;
    }


    .culture-talk__card{
        width: 100%;
        border-radius: 0;
        padding: 80px 20px ;
        right: 0px;
    }

    /* block spacing */
    .culture-talk__block + .culture-talk__block.long{
        margin-top: 80px;
    }

    /* 小カテゴリ（ものづくりの楽しさ みたいな） */
    .culture-talk__kicker{
        font-size: 15px;
    }

    /* 見出し：左に短い罫線 */
    .culture-talk__headline{
        display: flex;
        margin: 0 0 20px;
    }

    .culture-talk__line{
        width: 40px;
        margin-right: 8px;
        top: 14px;
    }

    .culture-talk__h4{
        font-size: 20px;
        font-weight: 700;
        line-height: 150%; /* 30px */
        letter-spacing: 0.4px;
    }

    /* 発言（左に小さな色タグ） */
    .culture-talk__say{
        margin: 0 0 20px;
    }

    .culture-talk__say.mid{
        margin: 0 0 30px;
    }

    .culture-talk__say p,
    .culture-talk__say > div{
        font-size: 14px;
        font-weight: 400;
        line-height: 200%; /* 28px */
        letter-spacing: 0.28px;
        width: calc(100% - 70px);
    }

    .culture-talk__say ul.caution{
        margin-top: 20px;
    }


    /* タグ（スクショの小さい四角） */
    .culture-talk__tag{
        width: 45px;
        height: 22px;
        font-size: 14px;
        line-height: 100%; /* 14px */
        letter-spacing: 0.28px;
        top: 7px;
    }

}


/* 画像：薄いグレーの台＋角丸（スクショの雰囲気） */
.culture-talk__photo{
    margin: 0px 0 0;
    padding-top: 10px;
}

.culture-talk__photo img{
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
    background: #fff;
}

.culture-talk__inner{
    display: flex;
    align-items: flex-start; /* これ大事 */
}

/* Indexを追従 */
.culture-talk__index{
    position: sticky;
    top: 170px;      /* 固定ヘッダー分 */
    align-self: flex-start;
}

/* ==============================
  culture-connector
  背景は外で組む前提
============================== */

.culture-connector__inner{
    width: 100%;
    max-width: 880px;
    margin: 0 auto;
    /*padding: 170px 0 120px;*/
    padding: 170px 0 0;
    display: flex;
    flex-direction: column;
    gap: 120px; /* 各段の縦間隔 */
}


/* 1段 */
.culture-connector__item{
    position: relative;
    display: grid;
    grid-template-columns: 394px 1fr;
    align-items: center;
    column-gap: 0px;
}

/* 左右反転 */
.culture-connector__item.is-image-right{
    grid-template-columns: 1fr 394px;
}

/* 丸画像 */
.culture-connector__media{
    width: 291px;
    height: 291px;
    position: relative;
}
.culture-connector__media img{
    width: 425px;
    height: auto;
    display: block;
    position: absolute;
    max-width: initial;
    left: 0;
    top: -77px;
    z-index: 3;
}

.culture-connector__media.img01 img{
    top: -40px;
}

.culture-connector__media.img02 img{
    left: -28px;
    top: -10px;
}

.culture-connector__media.img03 img{
    top: 10px;
}

.culture-connector__media.img04 img{
    left: -28px;
    top: -40px;
}

.culture-connector__media.img05 img{
    top: -65px;
}

.culture-connector__media.img06 img{
    left: -28px;
    top: -20px;
}

/* 白カード */
.culture-connector__card{
    padding: 78px 48px 35px;
    border-radius: 12px;
    background: #FFF;
    position: relative;
}

.culture-connector__item.min .culture-connector__card{
    padding-top: 35px;
}

/* 見出し：青ラベル */
.culture-tab-panel h3.culture-connector__title{
    color: #FFF;
    font-size: 30px;
    font-weight: 700;
    line-height: 100%; /* 30px */
    letter-spacing: 0.6px;
    text-align: left;
    position: absolute;
    left: 48px;
    top: -24px;
    margin-top: 0;

}
.culture-tab-panel h3.culture-connector__title span{
    display: inline-flex;
    padding: 5px 5px 7.5px 5px;
    justify-content: left;
    gap: 10px;
    background: var(--primary-corporate_blue, #5666BE);
}

/* 部署 */
.culture-connector__role{
    margin: 0px 0 13px;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 15px;
    font-weight: 700;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
}

/* 本文 */
.culture-connector__text{
    font-size: 15px;
    font-weight: 400;
    line-height: 175%; /* 26.25px */
    letter-spacing: 0.3px;
}

@media screen and (max-width: 768px) {

    /* 画像：薄いグレーの台＋角丸（スクショの雰囲気） */
    .culture-talk__photo{
        margin: 0px 0 0;
        padding-top: 10px;
    }

    .culture-talk__photo img{
        width: 100%;
        height: auto;
        display: block;
        border-radius: 10px;
        background: #fff;
    }

    .culture-talk__inner{
        width: 100%;
        max-width: 100%;
        padding: 0 0px;
        margin: 40px auto 0;
        display: flex;
        justify-content: space-between;
    }

    /* Indexを追従 */
    .culture-talk__index{
        display: none;
    }

    /* ==============================
    culture-connector
    背景は外で組む前提
  ============================== */

    .culture-connector__inner{
        width: 100%;
        max-width: 100%;
        padding: 0px 0 0px;
        display: flex;
        flex-direction: column;
        gap: 0px; /* 各段の縦間隔 */
    }

    /* 1段 */
    .culture-connector__item{
        position: relative;
        display: block;
        width: calc(100% - 40px);
        margin: 0 auto;
        padding-top: 80px;
    }

    /* 丸画像 */
    .culture-connector__media{
        width: 240px;
        height: auto;
        position: absolute;
        top: 50px;
        left: 20px;
    }

    .is-image-right .culture-connector__media{
        left: auto;
        right: -0px;
    }

    .culture-connector__media img{
        width: 100%;
        position: relative;
        top: auto;
        z-index: 3;
    }

    .culture-connector__media.img01 img{
        top: -15px;
    }

    .culture-connector__media.img02 img{
        left: auto;
        top: -5px;
    }

    .culture-connector__item.article03{
        padding-top: 70px;
    }
    .culture-connector__media.img03 img{
        top: -20px;
    }

    .culture-connector__media.img04 img{
        left: auto;
        top: -10px;
    }

    .culture-connector__media.img05 img{
        top: -5px;
    }

    .culture-connector__item.article06{
        padding-top: 50px;
    }
    .culture-connector__media.img06 img{
        left: auto;
        top: -25px;
    }

    /* 白カード */
    .culture-connector__card{
        padding: 150px 20px 20px;
        border-radius: 6px;
    }

    .culture-connector__item.min .culture-connector__card{
        padding-top: 150px;
    }

    /* 見出し：青ラベル */
    .culture-tab-panel h3.culture-connector__title{
        font-size: 22px;
        letter-spacing: 0.44px;
        position: relative;
        left: auto;
        top: auto;
        margin-top: 0;
        margin-bottom: 10px;

    }
    .culture-tab-panel h3.culture-connector__title span{
        padding: 5px 5px 6px 5px;
    }

    /* 部署 */
    .culture-connector__role{
        margin: 0px 0 10px;
        font-size: 15px;
        line-height: 150%; /* 22.5px */
        letter-spacing: 0.3px;
    }

    /* 本文 */
    .culture-connector__text{
        font-size: 14px;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.28px;
    }

}

/*culture------------------------------------------------------------*/

/* MEMBER
------------------------------------------------------------*/
/* ===== member grid ===== */
.member-grid{
    padding: 0;
}

.member-grid__inner{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}

.member-grid__list{
    list-style: none;
    margin: 0;
    padding: 0;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

/* ===== card ===== */
.member-card{
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

.member-card__link{
    display: block;
    color: inherit;
    text-decoration: none;
}

.member-card__media{
    margin: 0;
    background: #f4f4f4;
    /* 画像の見え方を揃える（縦長カード感） */
    aspect-ratio: 4 / 5;
    position: relative;
}

.member-card__img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* 下の帯 */
.member-card__meta{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 15px 20px 16px;
    color: #fff;
    z-index: 2;
    border-radius: 0 0 12px 12px;
}

.member-card__role{
    color: #FFF;
    font-size: 24px;
    font-weight: 500;
    line-height: 125%; /* 30px */
    letter-spacing: 0.48px;
}

.member-card__year{
    color: #FFF;
    font-size: 15px;
    font-weight: 500;
    line-height: 100%; /* 15px */
    letter-spacing: 0.3px;
    margin-top: 35px;
}

/* 色バリエーション（画像の下帯だけ色が変わる想定） */
.member-card--blue .member-card__meta{ background: #194989; }
.member-card--gray .member-card__meta{ background: #788C9E; }
.member-card--cyan .member-card__meta{ background: #00A4C7; }
.member-card--green .member-card__meta{ background: #81B04D; }

/* ===== responsive ===== */
@media (max-width: 900px){
    .member-grid__list{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}

@media (max-width: 560px){
    /* ===== member grid ===== */
    .member-grid{
        padding: 0;
    }

    .member-grid__inner{
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding: 0 20px;
    }

    .member-grid__list{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px;
    }

    /* ===== card ===== */
    .member-card{
        border-radius: 6px;
    }

    .member-card__link{
        position: relative;
    }

    .member-card__media{
        /* 画像の見え方を揃える（縦長カード感） */
        aspect-ratio:auto;
        width: 100%;
        height: 264px;
    }

    .member-card__img{
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

    /* 下の帯 */
    .member-card__meta{
        position: absolute;
        width: 100%;
        height: 72px;
        left: 0;
        bottom: 0;
        padding: 8px 10px;
        border-radius: 0 0 6px 6px;
    }

    .member-card__role{
        font-size: 14px;
        font-weight: 500;
        line-height: 125%; /* 17.5px */
        letter-spacing: 0.28px;
    }

    .member-card__year{
        font-size: 12px;
        line-height: 100%; /* 12px */
        letter-spacing: 0.24px;
        position: absolute;
        left: 10px;
        bottom: 8px;
    }
}

.top-return.member {
    width: 100%;
    max-width: 1280px;
    padding: 0 40px;
    margin: 80px auto 120px;
    background: none;
    color: #fff;
    overflow: hidden;
    position: relative;
}

.top-return.member .top-return__inner {
    max-width: 100%;
    padding: 80px;
    border-radius: 12px;
    background: var(--primary-corporate_blue, #5666BE);
}

.top-return.member .top-return__inner .top-return__bg{
    left: -20px;
    top: 0px;
}

.top-return.member .top-return__header{
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 0px;
}

/* 左 */
.top-return.member .top-return__content {
    flex: 1;
    max-width: 494px;
    width: 100%;
}

.top-return.member .top-return__title {
    font-size: 30px;
    font-weight: 700;
    line-height: 150%; /* 45px */
    letter-spacing: 0.6px;
}

.top-return.member .top-return__lead {
    font-size: 16px;
    font-weight: 500;
    line-height: 175%; /* 28px */
    letter-spacing: 0.32px;
    margin-top: 20px;
}

.top-return.member .top-return__list {
    margin-top: 0px;
    border-top: 1px solid rgba(255,255,255,.3);
}

/* アイテム（リンク行） */
.top-return.member .top-return__item {
    border-bottom: 1px solid rgba(255,255,255,.3);
}

.top-return.member .top-return__item-link {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 24px 0;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

/* サムネ */
.top-return.member .top-return__thumb img {
    width: 104px;
    height: 120px;
    border-radius: 4px;
}

@media screen and (max-width: 1100px) {
    .top-return.member .top-return__inner{
        display: block;
    }

    .top-return.member .top-return__content{
        margin-bottom: 40px;
    }
}
@media screen and (max-width: 768px) {
    .top-return.member {
        max-width: 100%;
        padding: 0 20px;
        margin: 40px auto 80px;
    }

}

@media screen and (max-width: 768px) {
    .top-return.member .top-return__inner,
    .top-return__inner {
        max-width: 100%;
        padding: 80px 20px 100px;
        display: block;
    }

    .top-return.member .top-return__inner .top-return__bg,
    .top-return__inner .top-return__bg{
        left: 50%;
        transform: translateX(-50%);
        top: 12px;
        width: 354px;
    }

    .top-return.member .top-return__inner .top-return__bg img,
    .top-return__inner .top-return__bg img{
        width: 100%;
        height: auto;
    }

    .top-return.member .top-return__header,
    .top-return__header{
        padding-top: 0px;
    }

    .top-return__header{
        display: block;
    }

    /* 左 */
    .top-return.member .top-return__content,
    .top-return__content {
        max-width: 100%;
    }

    .top-return.member .top-return__title,
    .top-return__title {
        font-size: 28px;
        line-height: 150%; /* 42px */
        letter-spacing: 0.56px;
    }

    .top-return.member .top-return__ratio,
    .top-return__ratio {
        position: absolute;
        top: 110px;
        right: 5px;
    }

    .top-return.member .top-return__ratio svg,
    .top-return__ratio svg{
        width: 95px;
        height: auto;
    }

    .top-return.member .top-return__lead,
    .top-return__lead {
        margin-top: 22px;
        font-size: 15px;
        font-weight: 500;
        line-height: 175%; /* 26.25px */
        letter-spacing: 0.3px;
    }

    .top-return.member .top-return__list,
    .top-return__list {
        margin-top: 65px;
    }


    .top-return.member .top-return__item-link,
    .top-return__item-link {
        display: flex;
        align-items: center;
        padding: 32px 8px;
        width: 100%;
    }

    /* サムネ */

    .top-return.member .top-return__thumb,
    .top-return__thumb{
        width: 104px;
    }

    .top-return.member .top-return__thumb img ,
    .top-return__thumb img {
        width: 100%;
        height: auto;
    }

    .top-return.member .top-return__text,
    .top-return__text{
        width: calc(100% - 156px);
    }

    /* テキスト */
    .top-return.member .top-return__item-title,
    .top-return__item-title {
        font-size: 18px;
        white-space: nowrap;
    }

    .top-return.member .top-return__item-desc,
    .top-return__item-desc {
        margin-top: 12px;
        font-size: 14px;
        font-weight: 400;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.56px;
        width: calc(100%);
        padding-right: 0;
    }

    /* 矢印 */
    .top-return.member .top-return__arrow,
    .top-return__arrow {
        width: 32px;
        height: 32px;
    }

    .top-return.member .top-return__arrow svg,
    .top-return__arrow svg{
        width: 100%;
        height: auto;
    }


    /* hover */
    /*
  .top-return.member .top-return__item-link:hover,
  .top-return__item-link:hover {
    opacity: 0.85;
  }
  */
    .top-return.member .top-return__item-link:hover .top-return__arrow,
    .top-return__item-link:hover .top-return__arrow {
        transform: translateX(4px);
    }

    /* 右ビジュアル */
    .top-return.member .top-return__visual,
    .top-return__visual {
        display: none;
    }

}


/*/MEMBER------------------------------------------------------------*/

/* MEMBER DETAIL
------------------------------------------------------------*/

.sub_kv.member{
    height: 970px;
    position: relative;
}

.sub_kv.member:before{
    content: "";
    display: block;
    background: var(--series-TR-7, #194989);
    width: 100%;
    height: 593px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.sub_kv.member .sub_kv__marquee{
    top: 20px;
    z-index: 5;
}
.sub_kv.member .sub_kv__marquee p,
.return-kv .sub_kv__marquee p{
    height: 115px;
}


.sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic{
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;

}
.sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic figure{
    width: 636px;
    height: auto;
    background: #D9D9D9;
    position: relative;
}

.sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic figure img{
    position: relative;
    z-index: 10;
}

.sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic > p{
    writing-mode: vertical-rl;
    color:#194989;
    font-size: 14px;
    font-weight: 500;
    line-height: 100%; /* 14px */
    letter-spacing: 0.28px;
    position: relative;
    z-index: 100;
}

.sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic p span{
    margin-top: 48px;
    color: #FFF;
}

/* 土俵を作る（同一セクション内でz-indexを効かせる） */
.sub_kv.member{
    position: relative; /* 既にあるけど念のため */
}

/* 吹き出し */
.speech{
    position: relative;
    display: inline-block;
    background: #fff;
    border-radius: 12px;
    padding: 25px 45px 25px 40px;

    border-radius: 12px;
    border: 2px solid var(--series-TR-7, #194989);
    background: var(--text-gray_100, #FFF);
    position: absolute;
    right: -180px;
    bottom: 55px;
    z-index: 20;
}

.speech .icon{
    position: absolute;
    left: -24px;
    top: 35px;
}


/* ラベル */
.speech__label{
    margin: 0 0 13px;
    display: inline-block;
    background: #194989;
    color: #FFF;
    font-family: Roboto;
    font-size: 18px;
    font-weight: 500;
    line-height: 100%; /* 18px */
    letter-spacing: 0.36px;
    padding: 2px 3px;
}

/* 本文 */
.speech__text{
    color: var(--series-TR-7, #194989);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 27px */
    letter-spacing: 0.36px;
}

.member-profile{
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 1080px;
    padding: 0 40px;
    margin: 0 auto;
}

.member-profile__ttlarea{
    position: relative;
    top: -15px;
}

.member-profile h2 span{
    display: inline-block;
    color: var(--series-TR-7, #194989);
    font-size: 36px;
    font-weight: 700;
    line-height: 100%; /* 36px */
    letter-spacing: 0.72px;
    background: #FFF;
    padding: 0 2px 3px;
    margin: 0;
}

.member-profile  .member-profile__year{
    color: var(--series-TR-7, #194989);
    font-size: 16px;
    font-weight: 700;
    line-height: 100%; /* 16px */
    letter-spacing: 0.32px;
    padding: 0 2px 3px;
    background: #FFF;
    display: inline-block;
    margin-top: 8px;
}

.member-profile .member-profile__body{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.member-profile .member-profile__body .member-profile__name{
    width: 150px;
    color: var(--text-gray_100, #FFF);
    font-size: 18px;
    font-weight: 700;
    line-height: 100%; /* 18px */
    letter-spacing: 0.36px;
}

.member-profile .member-profile__body .member-profile__name span{
    display: block;
    color: var(--text-gray_100, #FFF);
    font-size: 12px;
    font-weight: 400;
    line-height: 100%; /* 12px */
    letter-spacing: 0.24px;
    margin-top: 7px;
}

.member-profile .member-profile__body .member-profile__text{
    color: var(--text-gray_100, #FFF);
    font-size: 16px;
    font-weight: 500;
    line-height: 200%; /* 32px */
    letter-spacing: 0.48px;
    width: calc(100% - 150px);
}

/* interview */
.member-interview__inner{
    max-width: 1080px;
    padding: 0 40px;
    margin: 120px auto 0;
}

.member-interview__list{
    list-style: none;
    margin: 0;
    padding: 0;
}

.member-interview__item{
    padding: 0px 0 70px;
}

.member-interview__item:last-child{
    padding-bottom: 0;
}

/* 01 の左の線＋番号 */
.member-interview__head{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
}

.member-interview__head::before{
    content: "";
    width: 78px;
    height: 2px;
    background: #5666BE;
    flex: 0 0 auto;
}

.member-interview__no{
    color: var(--primary-corporate_blue, #5666BE);
    font-family: Roboto;
    font-size: 14px;
    font-weight: 500;
    line-height: 100%; /* 14px */
    letter-spacing: 0.28px;
}

/* 質問 */
.member-interview__q{
    margin: 0 0 13px;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 18px;
    font-weight: 700;
    line-height: 175%; /* 31.5px */
    letter-spacing: 0.54px;
    padding-left: 40px;
}

/* 回答 */
.member-interview__a{
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.48px;
    padding-left: 40px;
}

.detail02 .sub_kv.member:before{
    background: #788C9E;
}
.detail02 .sub_kv__marquee svg path {
    fill: #788C9E;
}

.detail02 .speech{
    border-color: #788C9E;
}

.detail02 .speech__label{
    background: #788C9E;
}

.detail02 .speech__text,
.detail02 .member-profile h2 span,
.detail02 .member-profile .member-profile__year,
.detail02 .sub_kv.member .sub_kv__introduction .sub_kv__introduction-pic > p{
    color: #788C9E;
}

.detail03 .sub_kv.member:before{
    background: #00A4C7;
}
.detail03 .sub_kv__marquee svg path {
    fill: #00A4C7;
}

.detail03 .speech{
    border-color: #00A4C7;
}

.detail03 .speech__label{
    background: #00A4C7;
}

.detail03 .speech__text,
.detail03 .member-profile h2 span,
.detail03 .member-profile .member-profile__year,
.detail03 .sub_kv.member .sub_kv__introduction .sub_kv__introduction-pic > p{
    color: #00A4C7;
}

.detail03 .member-schedule__list:before{
    bottom: 45px;
}

.detail04 .member-schedule__list:before{
    top: 25px;
    bottom: 65px;
}

.detail05 .member-schedule__list:before{
    bottom: 65px;
}

.detail06 .sub_kv.member:before{
    background: #81B04D;
}
.detail06 .sub_kv__marquee svg path {
    fill: #81B04D;
}

.detail06 .speech{
    border-color: #81B04D;
}

.detail06 .speech__label{
    background: #81B04D;
}

.detail06 .speech__text,
.detail06 .member-profile h2 span,
.detail06 .member-profile .member-profile__year,
.detail06 .sub_kv.member .sub_kv__introduction .sub_kv__introduction-pic > p{
    color: #81B04D;
}

.detail06 .member-schedule__list:before{
    top: 25px;
    bottom: 45px;
}

@media (max-width: 1010px) {
    /* 吹き出し */
    .speech {
        right: -70px;
    }
}

/* responsive */
@media (max-width: 768px){
    .sub_kv.member{
        height: auto;
    }

    .sub_kv.member:before{
        height: auto;
        min-height: 475px;
        position: absolute;
        bottom: 0;
    }

    .detail06 .sub_kv.member:before,
    .detail02 .sub_kv.member:before{
        height: 510px;
    }

    .detail05 .sub_kv.member:before{
        height: 485px;
    }

    .sub_kv.member .sub_kv__marquee{
        top: 16px;
    }
    .sub_kv.member .sub_kv__marquee p,
    .return-kv .sub_kv__marquee p{
        height: 50px;
    }

    .sub_kv.member .sub_kv__marquee p{
        height: 70px;
    }

    .sub_kv.member .sub_kv__marquee p svg{
        height: 70px;
        width: auto;
    }

    .sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic{
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 24px;

    }
    .sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic figure{
        width: 245px;
        height: 350px;
    }

    .sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic > p{
        font-size: 12px;
    }

    .sub_kv.member  .sub_kv__introduction .sub_kv__introduction-pic p span{
        margin-top: 37px;
        color: #FFF;
    }

    /* 吹き出し */
    .speech{
        padding: 10px 18px 17px 24px;

        right: -40px;
        bottom: -40px;
        z-index: 20;
    }

    /* ラベル */
    .speech__label{
        margin: 0 0 7px;
        font-size: 12px;
    }

    /* 本文 */
    .speech__text{
        font-size: 12px;
        letter-spacing: 0.24px;
    }


    .member-profile{
        position: relative;
        z-index: 10;
        width: 100%;
        max-width: 1080px;
        padding: 80px 40px 0;
        margin: 0 auto;
    }

    .member-profile__ttlarea{
        top: -0px;
    }

    .member-profile h2 span{
        font-size: 28px;
        line-height: 100%; /* 28px */
        letter-spacing: 0.56px;
        padding: 0 2px 3px;
    }

    .member-profile  .member-profile__year{
        font-size: 14px;
        line-height: 100%; /* 14px */
        letter-spacing: 0.28px;
        padding: 2px 2px 3px;
        margin-top: 2px;
    }

    .member-profile .member-profile__body{
        display: block;
    }

    .member-profile .member-profile__body .member-profile__name{
        width: 100%;
        font-size: 18px;
        line-height: 100%; /* 18px */
        letter-spacing: 0.36px;
        display: flex;
        align-items: end;
        margin-top: 23px;
    }

    .member-profile .member-profile__body .member-profile__name span{
        font-size: 12px;
        font-weight: 400;
        line-height: 100%; /* 12px */
        letter-spacing: 0.24px;
        margin-top: 0px;
        margin-left: 15px;
    }

    .member-profile .member-profile__body .member-profile__text{
        font-size: 14px;
        font-weight: 500;
        line-height: 200%; /* 28px */
        letter-spacing: 0.42px;
        margin-top: 10px;
        padding-bottom: 0px;
        height: 130px;
        padding-bottom: 0px;
        width: 100%;
        box-sizing: inherit;
    }

    /* interview */
    .member-interview__inner{
        max-width: 100%;
        padding: 0 20px;
        margin: 80px auto 0;
    }

    .member-interview__item{
        padding: 0px 0 40px;
    }

    .member-interview__item:last-child{
        padding-bottom: 0;
    }

    /* 01 の左の線＋番号 */


    /* 質問 */
    .member-interview__q{
        margin: 0 0 20px;
        line-height: 150%;
        letter-spacing: 0.36px;
        padding-left: 0px;
    }

    /* 回答 */
    .member-interview__a{
        font-size: 14px;
        line-height: 200%; /* 28px */
        letter-spacing: 0.42px;
        padding-left: 0px;
    }
}

.member-interview-top{
    margin: 80px auto 0;
    width: 100%;
    max-width: 1080px;
    padding: 0 40px;
}

.member-interview-top ul{
    display: flex;
    justify-content: space-between;
}

.member-interview-top ul li{
    width: 47.8%;
    padding: 35px 40px;
    border-radius: 12px;
    background: #EEF0F8;
}

.member-interview-top ul li .ttl{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 18px;
    font-weight: 700;
    line-height: 175%; /* 31.5px */
    letter-spacing: 0.54px;
}

.member-interview-top ul li .txt{
    margin-top: 13px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.48px;
}

/* responsive */
@media (max-width: 768px){
    .member-interview-top{
        width: 100%;
        max-width: 100%;
        padding: 0 20px;
        margin: 40px auto 0;
    }

    .member-interview-top ul{
        display: block;
    }

    .member-interview-top ul li{
        width: 100%;
        padding: 20px 24px;
    }

    .member-interview-top ul li:last-child{
        margin-top: 16px;
    }

    .member-interview-top ul li .ttl{
        font-size: 18px;
        font-weight: 700;
        line-height: 150%; /* 27px */
        letter-spacing: 0.54px;
    }

    .member-interview-top ul li .txt{
        margin-top: 5px;
        font-size: 14px;
        font-weight: 400;
        line-height: 200%; /* 28px */
        letter-spacing: 0.42px;
    }
}

/* ===== schedule ===== */
.member-schedule{
    background: var(--text-gray_75, #F2F2F3);
    padding-top: 360px;
    position: relative;
    margin-top: 360px;
    padding-bottom: 160px;
}

.member-schedule .member-schedule__image{
    width: 100%;
    max-width: 1080px;
    padding: 0 40px;
    position: absolute;
    left: 50%;
    top: 0%;
    transform: translate(-50%, -50%); /* ← ここが肝 */
}

.member-schedule__inner{
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 40px;
    position: relative;
}

/* head */
.member-schedule__head{
    display:flex;
    align-items:flex-end;
    gap: 16px;
    margin: 0 0 28px;
}
.member-schedule__title{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 42px;
    font-weight: 500;
    line-height: 100%; /* 42px */
    letter-spacing: 0.84px;
}
.member-schedule__sub{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 18px;
    font-weight: 700;
    line-height: 100%; /* 18px */
    letter-spacing: 0.36px;
    margin-bottom: 8px;
}

/* card */
.member-schedule__card{
    border-radius: 12px;
    background: #FFF;
    padding: 85px 120px;
}

/* list + timeline */
.member-schedule__list{
    list-style:none;
    margin:0;
    padding:0;
    position: relative;
}

/* 縦ライン（タイムピルの中心を通す） */
.member-schedule__list::before{
    content:"";
    position:absolute;
    left: 60px;           /* タイム列の中心位置 */

    top: 18px;
    bottom: 35px;
    width: 2px;
    background:#5666BE;
}

.member-schedule__item{
    display:grid;
    grid-template-columns: 160px 1fr;
    column-gap: 0px;
    align-items:center;
    padding: 0px 0 35px;
}

.member-schedule__item.image{
    padding-left: 160px ;
    width: 100%;
    display: block;
}


.member-schedule__time{
    position: relative;
    z-index: 1; /* ラインより前 */
    display:flex;
    justify-content:left;

}
.member-schedule__time span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width: 120px;
    height: 40px;
    border-radius: 999px;
    background:#5666BE;

    color: var(--text-gray_100, #FFF);
    font-family: Roboto;
    font-size: 20px;
    font-weight: 500;
    line-height: 100%; /* 20px */
    letter-spacing: 0.8px;
}

/* content */
.member-schedule__content p{
    color: var(--text-gray_5, #282B33);
    font-size: 16px;
    font-weight: 500;
    line-height: 175%; /* 28px */
    letter-spacing: 0.32px;
}

.member-schedule__photo{
    margin: 0px 0 0;
    width: 480px;
    max-width: 100%;
    border-radius: 12px;
    overflow:hidden;
}
.member-schedule__photo img{
    width:100%;
    height:auto;
    display:block;
}

/* ▼▼ 全画面共通：最後のアイテムからはみ出る線を隠す ▼▼ */
.member-schedule__item:last-child {
    position: relative;
}
.member-schedule__item:last-child::after {
    content: "";
    position: absolute;
    /* PCの線の位置(left: 60px)を覆い隠すように配置 */
    left: 58px;
    top: 30px;  /* 時間の丸薬の裏側付近から下をマスク */
    bottom: 0;
    width: 6px; /* 2pxの線を完全に隠す太さ */
    background-color: #FFF; /* 背景色で塗りつぶし */
    z-index: 0;
}
/* ▲▲ ここまで ▲▲ */

/* responsive */
@media (max-width: 820px){
    .member-schedule__card{
        padding: 26px 18px 32px;
    }

    .member-schedule__item{
        grid-template-columns: 150px 1fr;
        column-gap: 22px;

    }

    .member-schedule__list::before{
        left: 52px;
    }

    .member-schedule__time span{
        width: 104px;
        height: 40px;
        font-size: 16px;
    }

    .member-schedule__item:last-child::after {
        left: 50px;
    }
}



@media (max-width: 768px){
    /* ===== schedule ===== */
    .member-schedule{
        padding: 28vw 20px 80px;
        position: relative;
        margin-top: 190px;
    }

    .member-schedule .member-schedule__image{
        width: 100%;
        max-width: 100%;
        padding: 0 20px;
    }

    .member-schedule__inner{
        width: 100%;
        max-width: 100%;
        padding: 0 0px;

    }

    /* head */
    .member-schedule__head{
        display:block;
        gap: 0px;
        margin: 0 0 22px;
    }
    .member-schedule__title{
        font-size: 36px;
        font-weight: 500;
        line-height: 100%; /* 36px */
        letter-spacing: 0.72px;
    }
    .member-schedule__sub{
        display: block;
        font-size: 16px;
        font-weight: 700;
        line-height: 100%; /* 16px */
        letter-spacing: 0.32px;
        margin-bottom: 20px;
        margin-top: 7px;
    }

    /* card */
    .member-schedule__card{
        border-radius: 12px;
        padding: 24px 20px;
    }


    /* 縦ライン（タイムピルの中心を通す） */
    .member-schedule__list::before{
        left: 32px;
        top: 18px;
        bottom: 24px;   /* ← ここだけ調整値 */
        width: 2px;
    }

    .member-schedule__item:last-child{
        padding-bottom: 0; /* 最後の余白を消す */
    }

    .member-schedule__item{
        grid-template-columns: 80px 1fr;
        padding: 0px 0 24px;
        align-items:flex-start;
    }

    .member-schedule__item.image{
        padding-left: 80px ;
    }

    .member-schedule__time span{
        width: 64px;
        height: 26px;
        font-size: 14px;
        line-height: 100%; /* 14px */
        letter-spacing: 0.56px;
    }

    .member-schedule__item:last-child {
        position: relative;
    }
    .member-schedule__item:last-child::after {
        content: "";
        position: absolute;
        left: 30px; /* 線の位置(32px)を覆うように配置 */
        top: 20px;  /* 時間の丸薬の裏側付近から下を全てマスク */
        bottom: 0;
        width: 6px; /* 線幅(2px)を完全に隠す太さ */
        background-color: #FFF; /* カードの背景色（白）で塗りつぶし */
        z-index: 0;
    }
    /* content */
    .member-schedule__content p{
        font-size: 14px;
        font-weight: 500;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.28px;
    }

    .member-schedule__photo{
        width: 220px;
        border-radius: 6px;
    }
}


@media screen and (max-width: 768px) {
}

/*MEMBER DETAIL------------------------------------------------------------*/

/* RETURN
------------------------------------------------------------*/

/* return-kv */
.return-kv{
    width: 100%;
    position: relative;
    margin-top: 80px;
}

.return-kv .sub_kv__marquee{
    position: absolute;
    left: 0;
    top: 20px;
    z-index: 5;
    width: 100%;
    /*height: 88px;*/
}

.return-kv .sub_kv__marquee-item svg{
    height: auto;
}

.return-kv__inner{
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 700px;
}

.return-kv__media{
    position: relative;
    overflow: hidden;
}

.return-kv__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.return-kv__panel{
    background: #5A64C8; /* 画像の青っぽい色に寄せた */
    color: #fff;
    display: flex;
}

.return-kv__panel-inner{
    width: 100%;
    margin: auto;
    padding: 250px 40px 80px 80px;
}

.return-kv__catch{
    color: var(--text-gray_100, #FFF);
    font-size: 32px;
    font-weight: 700;
    line-height: 150%; /* 48px */
    letter-spacing: 0.64px;
}

.return-kv__name{
    margin: 45px 0 30px;
}

.return-kv__jp{
    color: var(--text-gray_100, #FFF);
    font-size: 18px;
    font-weight: 700;
    line-height: 100%; /* 18px */
    letter-spacing: 0.36px;
}

.return-kv__en{
    color: var(--text-gray_100, #FFF);
    font-size: 12px;
    font-weight: 400;
    line-height: 100%; /* 12px */
    letter-spacing: 0.24px;
    margin-top: 7px;
}

.return-kv__tag{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 16px */
    letter-spacing: 0.32px;
    background: #FFF;
    display: inline-block;
    padding: 2px 4px 4px;
}

.return-kv__meta{
    margin: 30px 0 0;
}

.return-kv__row{
    display: grid;
    grid-template-columns: 160px 1fr;
    column-gap: 40px;
    /*padding: 0px 0 10px;*/
}

.return-kv__row:last-child{
    padding-bottom: 0;
}

.return-kv__row dt{
    color: var(--text-gray_100, #FFF);
    font-size: 14px;
    font-weight: 700;
    line-height: 200%; /* 28px */
    letter-spacing: 0.28px;
}

.return-kv__row dd{
    color: var(--text-gray_100, #FFF);
    font-size: 14px;
    font-weight: 400;
    line-height: 200%; /* 28px */
    letter-spacing: 0.28px;
}

.return-photo{
    margin: 80px auto 0;
    max-width: 1280px;
    width: 100%;
    padding: 0 40px;
}

.return-photo ul{
    width: 100%;
    display: flex;
    justify-content: space-between;

}

.return-photo li{
    width: 49%;
}

.member-interview.mt_min{
    margin-top: 80px;
}

.return-link{
    max-width: 1280px;
    width: 100%;
    padding: 0 40px;
    margin: 80px auto 120px;
}

.return-link a{
    display: flex;
    border-radius: 12px;
    background: var(--text-gray_75, #F2F2F3);
    width: 100%;
    height: 200px;
    align-items: center;
    position: relative;
    padding: 0 130px 0 142px;
    color: var(--text-gray_5, #282B33);
}

.return-link a svg{
    position: absolute;
    right: 102px;
    top: 50%;
    transform: translateY(-50%);
}

.return-link a > span{
    display: block;
    padding-left: 40px;
}

.return-link a > span .ttl{
    font-size: 20px;
    font-weight: 500;
    line-height: 100%; /* 20px */
    letter-spacing: 0.8px;
}

.return-link a > span .txt{
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 175%; /* 24.5px */
    letter-spacing: 0.56px;
    margin-top: 15px;
}

@media screen and (max-width: 768px) {
    /* return-kv */
    .return-kv{
        margin-top: 54px;
        position: relative;
    }

    .return-kv .sub_kv__marquee{
        top: 15px;
        height: 75px;
    }

    .return-kv .sub_kv__marquee-item svg{
        height: 80px;
    }

    .return-kv__inner{
        display: block;
        min-height: auto;
    }


    .return-kv__panel-inner{
        width: 100%;
        margin: auto;
        padding: 104px 20px 33px;
    }

    .return-kv__catch{
        font-size: 20px;
        font-weight: 700;
        line-height: 150%; /* 30px */
        letter-spacing: 0.4px;
    }

    .return-kv__name{
        margin: 20px 0 10px;
    }

    .return-kv__jp{
        font-size: 16px;
    }

    .return-kv__en{
        font-size: 12px;
        font-weight: 400;
        line-height: 100%; /* 12px */
        letter-spacing: 0.24px;
    }

    .return-kv__meta{
        margin: 25px 0 0;
    }

    .return-kv__row{
        display: grid;
        grid-template-columns: 160px 1fr;
        column-gap: 0px;
        padding: 0px 0 0px;
    }

    .return-kv__row dt{
        font-size: 12px;
        font-weight: 700;
        line-height: 175%; /* 21px */
        letter-spacing: 0.24px;
    }

    .return-kv__row dd{
        font-size: 12px;
        font-weight: 400;
        line-height: 175%; /* 21px */
        letter-spacing: 0.24px;
    }

    .return-photo{
        margin: 40px auto 0;
        max-width: 100%;
        padding: 0 20px;
    }

    .return-photo ul{
        display: block;
    }

    .return-photo li{
        width: 100%;
        margin-bottom: 24px;
    }

    .return-photo li:last-child {
        margin-bottom: 0;
    }

    .member-interview.mt_min{
        margin-top: 40px;
    }

    .return-link{
        max-width: 100%;
        width: 100%;
        padding: 0 20px;
        margin: 40px auto 80px;
    }

    .return-link a{
        display: flex;
        border-radius: 6px;
        width: 100%;
        height: auto;
        padding: 32px 8px;
    }

    .return-link a img {
        width: 104px;
        height: auto;
    }

    .return-link a svg{
        position: absolute;
        right: 8px;
        width: 32px;
        height: 32px;
    }

    .return-link a > span{
        display: block;
        padding-left: 24px;
        padding-right: 40px;
    }

    .return-link a > span .ttl{
        font-size: 16px;
        line-height: 100%; /* 16px */
    }

    .return-link a > span .txt{
        font-size: 14px;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.56px;
    }
}

/*RETURN------------------------------------------------------------*/

/* our_company
------------------------------------------------------------*/
.culture-tab-panel__visal01.our_company01{
    background: url(../images/our_company/kv01.jpg) no-repeat center center;
    background-size: cover;
}
.culture-tab-panel__visal01.our_company02{
    background: url(../images/our_company/kv02.jpg) no-repeat center center;
    background-size: cover;
}

.culture-tab-panels.our_company{
    background: none;
}

.oc-tab__panel{
    width: 100%;
    max-width: 1280px;
    margin: 80px auto 120px;
    padding: 0 40px;
}

/* lead text */
.oc-section__lead {
    margin: 0 0 75px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.32px;
}
.oc-section__lead .top{
    font-size: 24px;
    font-weight: 700;
    line-height: 175%; /* 42px */
    letter-spacing: 0.48px;
    margin: 0 0 10px;
}

/* points */
.oc-points {
    margin-bottom: 80px;
}

.culture-tab-panel h3.oc-points__title {
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 20px;
    font-weight: 700;
    line-height: 100%; /* 20px */
    letter-spacing: 0.6px;
    margin-bottom: 20px;
    text-align: left;
}

.oc-points__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.oc-point {
    border-radius: 12px ;
}


.oc-point__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.oc-point__body {
    background: var(--text-gray_75, #F2F2F3);
    padding: 24px;
    border-radius:0 0 12px 12px;
    min-height: 128px;

    margin-bottom: 10px;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 18px */
}
.oc-point__text {
    font-size: 14px;
    font-weight: 400;
    line-height: 175%; /* 24.5px */
    letter-spacing: 0.28px;
    margin-top: 12px;
}

/* gallery */
.oc-gallery {
    margin-bottom: 120px;
}
.oc-gallery__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}
.oc-gallery__item {
    border-radius: 12px;
    overflow: hidden;
}
.oc-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.oc-about{
    width: 100%;
    max-width: 1280px;
    margin: 0px auto 0px;
    padding: 0 40px;
}

.oc-about .block{
    margin-top: 30px;
    border-radius: 12px;
    background: var(--text-gray_75, #F2F2F3);
    padding: 40px 0 56px;
    display: flex;
    justify-content: center;
    gap: 260px;
}

.oc-about .block li{
    position: relative;

}

.oc-about .block li svg{
    position: absolute;
    left: 50%;
    top: 0;
    max-width: none;
    transform: translateX(-50%);
}

.oc-about .block li a{
    display: block;
    padding-top: 135px;
}

.oc-about .block li.top1 svg{
    top: 16px;
}

.oc-about .block li.top2 svg{
    top: 12px;
}

.oc-about .block li:nth-child(2):before{
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background: #D4D4D4;
    position: absolute;
    left: -130px;
    top: 0;
}

.oc-about .block span{
    display: flex;
    color: var(--text-gray_5, #282B33);
    font-size: 18px;
    font-weight: 500;
    line-height: 150%; /* 27px */
    letter-spacing: 0.36px;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 54px;

}

/* responsive */
@media (max-width: 980px) {
    .oc-points__grid {
        grid-template-columns: 1fr;
    }
    .oc-gallery__grid {
        grid-template-columns: 1fr;
    }
}


@media screen and (max-width: 768px) {
    .culture-tab-panel__visal01.our_company01{
        background: url(../images/our_company/kv01.jpg) no-repeat center center;
        background-size: cover;
    }

    .culture-tab-panels.our_company{
        background: none;
    }

    .oc-tab__panel{
        width: 100%;
        max-width: 100%;
        margin: 40px auto 80px;
        padding: 0 20px;
    }

    /* lead text */
    .oc-section__lead {
        font-size: 14px;
        font-weight: 400;
        line-height: 200%; /* 28px */
        letter-spacing: 0.28px;
    }
    .oc-section__lead .top{
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 175%; /* 35px */
        letter-spacing: 0.4px;
        margin: 0 0 10px;
    }

    /* points */

    .culture-tab-panel h3.oc-points__title {
        font-size: 20px;
        font-weight: 700;
        line-height: 100%; /* 20px */
        letter-spacing: 0.6px;
        margin-bottom: 40px;
    }

    .oc-points__grid {
        display: block;
    }

    .oc-point {
        border-radius: 6px ;
        margin-bottom: 16px;
    }

    .oc-point:last-child{
        margin-bottom: 0;
    }


    .oc-point__body {
        padding: 20px;
        border-radius:0 0 6px 6px;
        min-height: 1px;
    }
    .oc-point__head {
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: 500;
        line-height: 100%; /* 16px */
        letter-spacing: 0.32px;
    }

    /* gallery */
    .oc-gallery {
        margin-bottom: 80px;
    }
    .oc-gallery__grid {
        display: block;
    }
    .oc-gallery__item {
        border-radius: 6px;
        overflow: hidden;
        margin-bottom: 16px;
    }

    .oc-gallery__item:last-child {
        margin-bottom: 0px;
    }
    .oc-about{
        padding: 0 20px;
    }
    .oc-about .block{
        margin-top: 30px;
        border-radius: 6px;
        padding: 12px 32px 12px;
        display: block;
    }

    .oc-about .block li{
        display: flex;
        padding-top: 0px;

    }

    .oc-about .block li:nth-child(1){
        border-bottom: 1px solid var(--text-gray_50, #D4D4D4);
    }

    .oc-about .block li a{
        display: grid;
        grid-template-columns: 104px 1fr;
        align-items: center;
        text-align: left;
        padding-bottom: 0px;
        padding: 20px 0;
        width: 100%;
    }

    .oc-about .block li a span{
        text-align: left;
    }

    .oc-about .block li a div{
        text-align: center;
        padding-right: 40px;
    }

    .oc-about .block li svg{
        display: inline;
        position: relative;
        left: auto;
        top: auto;
        transform: none;
        width: 64px;
        height: auto;
    }

    .oc-about .block li.num svg{
        left: -7px;
    }

    .oc-about .block li:nth-child(2) svg{
        top: auto;

    }

    .oc-about .block li.top1 svg{
        top: auto;
        width: 58px;
        height: auto;
    }

    .oc-about .block li.top2 svg{
        top: auto;
        width: 55px;
        height: auto;
    }

    .oc-about .block li:nth-child(2):before{
        display: none;
    }

    .oc-about .block span{
        display: block;
        height: auto;
        font-size: 16px;
        font-weight: 500;
        line-height: 150%; /* 24px */
        letter-spacing: 0.32px;

    }
}

/*our_company------------------------------------------------------------*/

/* data
------------------------------------------------------------*/
/* =========================
  Our Company / Stats blocks
========================= */
.oc-stats{
    background: rgba(86,102,190,0.1);
    padding-bottom: 160px;
}

.oc-block{
    max-width: 1200px;
    margin: 0 auto;
    padding: 1px 0 0;
}

.oc-block__title,
.job-list__base{
    margin: 0 0 40px;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 32px */
    letter-spacing: 0.64px;
    padding-left: 18px;
    margin-top: 120px;
    position: relative;
}

.job-list__base{
    margin-top: 0;
}

.oc-block__title:before,
.job-list__base:before{
    content: "";
    display: block;
    width: 6px;
    height: 34px;
    background: url(../images/data/ttl.svg) no-repeat left top;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 2px;
}

/* tabs */
.oc-tabs,
.job-tabs{
    display: inline-flex;
    gap: 0;
    border: 2px solid #5666BE;
    border-radius: 8px;
    overflow: hidden;
    margin: 0 0 40px;
    background: #fff;
}

.job-tabs{
    margin-bottom: 64px;
}

.oc-tab,
.job-tabs__btn{
    appearance: none;
    border: 0;
    background: transparent;
    padding: 12px 8px;
    font-weight: 700;
    letter-spacing: .06em;
    color: #4b55b8;
    cursor: pointer;
    width: 136px;
    font-size: 16px;
    letter-spacing: 0.32px;
    text-align: center;
}
.oc-tab + .oc-tab,
.job-tabs__btn + .job-tabs__btn{ border-left: 2px solid #5666BE; }
.oc-tab.is-active,
.job-tabs__btn.is-active{
    background: #5666BE;
    color: #fff;
}

/* grids */
.oc-grid{
    display: grid;
    gap: 24px;
}
.oc-grid--company{
    grid-template-columns: repeat(12, 1fr);
}
.oc-grid--staff,
.oc-grid--work{
    display: none;
    grid-template-columns: repeat(12, 1fr);
}

.oc-grid--staff.is-active,
.oc-grid--work.is-active{
    display: grid; /* 元のレイアウトに合わせて調整してください */
}

.oc-grid--work{
    grid-template-columns: repeat(3, 1fr);
}

/* card */
.oc-card{
    background: #fff;
    border-radius: 12px;
    padding: 35px 40px 0px;
    min-height: 480px;
}

.oc-grid--company > .oc-card{
    grid-column: span 4;
}

/* 下段（wide だけ） */
.oc-grid--company > .oc-card--wide{
    grid-column: span 6;

}

.oc-grid--company .oc-card.oc-card--wide{
    min-height: 420px;
}

.oc-card__head{
    margin: 0 0 24px;
    font-size: 26px;
    font-weight: 700;
    line-height: 125%; /* 32.5px */
    letter-spacing: 0.52px;
}

/* layout helpers */
.oc-center{
    text-align: center;
}
.oc-stack{
    display: grid;
    gap: 12px;
}
.oc-split{
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: center;
    gap: 16px;
}

/* big numbers */
.oc-big{
    margin: 0;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .02em;
    color: #4b55b8;
    text-align: center;
    position: relative;
}

.oc-big .ttl_bg{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 236px;
    height: 127px;
    top: 8px;
}

.oc-big__prefix{
    margin-right: 6px;
    font-size: 16px;
    font-weight: 700;
    vertical-align: baseline;
    color: #4b55b8;
}
.oc-big__num{
    color: var(--primary-corporate_blue, #5666BE);
    font-family: Roboto;
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 100px */
}
.oc-big__unit{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 200%; /* 72px */
    letter-spacing: 0.72px;
    margin-left: 10px;
}

.oc-big__unit.ml0{
    margin-left: 0;
}

.oc-big__unit.block{
    display: block;
    margin-left: 0;
    width: 100%;
    line-height: 100%;
    position: relative;
    top: -4px;
}

.oc-big--tight .oc-big__num{ font-size: 52px; }

/* sub/note */
.oc-sub{
    margin: 23px 0 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 150%; /* 27px */
    letter-spacing: 0.36px;
}
.oc-sub--small{
    margin-top: 10px;
    font-size: 11px;
    font-weight: 600;
    color: #333;
    line-height: 1.7;
}
.oc-sub--mid{
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #4b55b8;
}

.oc-note{
    font-size: 12px;
    font-weight: 400;
    line-height: 175%; /* 21px */
    letter-spacing: 0.24px;
    text-align: center;
    margin-top: 26px;
}

.hmin4 .oc-note{
    font-size: 18px;
    font-weight: 500;
    line-height: 150%; /* 27px */
    letter-spacing: 0.36px;
    margin-top: 15px;
}

.hmin4 .oc-note span{
    display: inline-block;
    padding-right: 18px;
}

.oc-note--bottom{
    margin-top: 12px;
    text-align: left;
}
.oc-note--bottom2{
    margin-top: 45px;
    text-align: left;
}

/* illust/chart */
.oc-illust{
    margin: 30px auto 0;
    display: flex;
    justify-content: center;
}

.staff2 .oc-illust{
    margin-top: 0;
}

.oc-illust img{
    width: 100%;
    height: auto;
    display: block;
}

.oc-illust03{
    margin-top: 0;
    padding: 23px 41px 0;
}

.oc-illust.country{
    width: 100%;
    max-width: 423px;
    margin: 10px auto 0;
}

.oc-illust.num{
    width: 100%;
    max-width: 240px;
    margin: 14px auto 0;
}

.oc-chart{
    width: 100%;
    max-width: 260px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* bars */
.oc-bars{
    display: grid;
    gap: 10px;
    margin-top: 50px;
}
.oc-bar{
    display: grid;
    grid-template-columns: 1fr; /* 縦積み */
    gap: 6px;
}

.oc-bar__label{
    width: 100%;
    font-weight: 500;
}

/* 下段：バー＋数値 */
.oc-bar__track{
    display: inline-block;
    width: 100%;
    height: 36px;
}

.oc-bar__val{
    font-family: Roboto;
    font-size: 34px;
    font-weight: 500;
    line-height: 100%; /* 59.5px */
    letter-spacing: -1.02px;
    margin-left: 8px;
}

.oc-bar__val span{
    font-family: "Noto Sans JP";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 175%; /* 28px */
}

/* 横並び用ラッパー */
.oc-bar__row{
    display: flex;
    align-items: center;
}
.oc-bar__fill{
    display: block;
    height: 100%;
    width: 0;
    border-radius: 0;
    transition: width 1.0s ease-out;
}
.oc-bar__fill.is-blue{ background: #5666BE; }
.oc-bar__fill.is-brown{ background: #A68C73; }
.oc-bar__val{ text-align: left; white-space: nowrap;
}

/* legend */
.oc-legend{
    margin: 0;
    display: grid;
    gap: 10px;
}
.oc-legend__row{
    display: flex;

}

.oc-legend dt{
    display: inline-flex;
    align-items: center;
    font-size: 18px;
    font-weight: 500;
    line-height: 175%; /* 31.5px */
    letter-spacing: 0.36px;
    white-space: nowrap;

}
.oc-legend dd{
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: #4b55b8;
    margin-left: 16px;

}
.oc-per{
    font-family: Roboto;
    font-size: 100px;
    font-weight: 700;
    line-height: 100%; /* 100px */
    width: 2.5ch;   /* ← 数字の左端を揃える */
}

.oc-per__unit{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 36px;
    font-weight: 700;
    line-height: 200%; /* 72px */
    letter-spacing: 0.72px;
}
.oc-dot{
    width: 32px;
    height: 32px;
    display: inline-block;
    margin-right: 8px;
}
.oc-dot.is-green{ background:#81B04D; }
.oc-dot.is-blue{ background:#5666BE; }
.oc-dot.is-gray{ background:#D4D4D4; }
.oc-dot.is-cyan{ background:#00A4C7; }
.oc-dot.is-dark{ background:#A3A19E; }

/* responsive */
/*
@media (max-width: 980px){
  .oc-grid--company,
  .oc-grid--staff,
  .oc-grid--work{
    grid-template-columns: 1fr;
  }
  .oc-card--wide{ grid-column: auto; }
  .oc-split{
    grid-template-columns: 1fr;
    text-align: center;
  }
  .oc-note--bottom{ text-align: left; }
  .oc-illust{ max-width: 260px; }
  .oc-big__num{ font-size: 48px; }
}
*/

/* --- SVGグループ全体の初期状態 --- */
.svg-group-blue, .svg-group-brown {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* --- 背景ドットの初期状態 --- */
.svg-dots path {
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* --- 画面に入った時（is-activeがついた時）の表示設定 --- */
.js-svg-reveal.is-active .svg-group-blue {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition-delay: 0.2s;
}

.js-svg-reveal.is-active .svg-group-brown {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition-delay: 0.5s;
}

/* JSから付与するドット表示用クラス */
.svg-dots path.is-visible {
    opacity: 1 !important;
}

/* 青い円：1.2秒かけて描画 */
.js-svg-pie .pie-blue {
    transition: stroke-dashoffset 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 緑の円：0.3秒かけて描画 */
.js-svg-pie .pie-green {
    transition: stroke-dashoffset 0.3s ease-out;
    /* 青(1.2秒)の描画終盤に合わせてスタート */
    transition-delay: 0.9s;
}

/* 画面に入った時（is-activeがついた時）の目標値 */
.js-svg-pie.is-active .pie-blue {
    /* 全体の長さ(565.49)から 92% 分を描画 */
    stroke-dashoffset: 45.24;
}

.js-svg-pie.is-active .pie-green {
    /* 全体の長さ(565.49)から 8% 分を描画 */
    stroke-dashoffset: 520.25;
}

/* 画面に入った時（is-activeがついた時）の目標値 */
.js-svg-pie.js-svg-pie1_2.is-active .pie-blue {
    /* 全体の長さ(565.49)から 89% 分を描画 */
    stroke-dashoffset: 62.20;
}

.js-svg-pie.js-svg-pie1_2.is-active .pie-green {
    /* 全体の長さ(565.49)から 11% 分を描画 */
    stroke-dashoffset: 503.29;
}

/* 画面に入った時（is-activeがついた時）の目標値 */
.js-svg-pie.js-svg-pie1_3.is-active .pie-blue {
    /* 全体の長さ(565.49)から 100% 分を描画 */
    stroke-dashoffset: 0;
}

.js-svg-pie.js-svg-pie1_3.is-active .pie-green {
    /* 全体の長さ(565.49)から 0% 分を描画（表示しない） */
    stroke-dashoffset: 565.49;
}

/* --- 5色円グラフのアニメーション設定 --- */

/* 1. グレー(4%) */
.js-svg-pie2 .part1 { transition: stroke-dashoffset 0.03s linear; }
.js-svg-pie2.is-active .part1 { stroke-dashoffset: 542.87; }

/* 2. 青(31%) */
.js-svg-pie2 .part2 { transition: stroke-dashoffset 0.25s linear; transition-delay: 0.03s; }
.js-svg-pie2.is-active .part2 { stroke-dashoffset: 390.19; }

/* 3. 緑(29%) */
.js-svg-pie2 .part3 { transition: stroke-dashoffset 0.23s linear; transition-delay: 0.28s; }
.js-svg-pie2.is-active .part3 { stroke-dashoffset: 401.50; }

/* 4. 水色(22%) */
.js-svg-pie2 .part4 { transition: stroke-dashoffset 0.18s linear; transition-delay: 0.51s; }
.js-svg-pie2.is-active .part4 { stroke-dashoffset: 441.08; }

/* 5. 薄グレー(14%) */
.js-svg-pie2 .part5 { transition: stroke-dashoffset 0.11s ease-out; transition-delay: 0.69s; }
.js-svg-pie2.is-active .part5 { stroke-dashoffset: 486.32; }

/* 1. グレー(3%) */
.js-svg-pie2.js-svg-pie2_2 .part1 { transition: stroke-dashoffset 0.02s linear; }
.js-svg-pie2.js-svg-pie2_2.is-active .part1 { stroke-dashoffset: 548.53; }

/* 2. 青(14%) */
.js-svg-pie2.js-svg-pie2_2 .part2 { transition: stroke-dashoffset 0.11s linear; transition-delay: 0.02s; }
.js-svg-pie2.js-svg-pie2_2.is-active .part2 { stroke-dashoffset: 486.32; }

/* 3. 緑(33%) */
.js-svg-pie2.js-svg-pie2_2 .part3 { transition: stroke-dashoffset 0.26s linear; transition-delay: 0.13s; }
.js-svg-pie2.js-svg-pie2_2.is-active .part3 { stroke-dashoffset: 378.88; }

/* 4. 水色(31%) */
.js-svg-pie2.js-svg-pie2_2 .part4 { transition: stroke-dashoffset 0.25s linear; transition-delay: 0.39s; }
.js-svg-pie2.js-svg-pie2_2.is-active .part4 { stroke-dashoffset: 390.19; }

/* 5. 薄グレー(19%) */
.js-svg-pie2.js-svg-pie2_2 .part5 { transition: stroke-dashoffset 0.15s ease-out; transition-delay: 0.64s; }
.js-svg-pie2.js-svg-pie2_2.is-active .part5 { stroke-dashoffset: 458.05; }

/* 1. グレー(8%) */
.js-svg-pie2.js-svg-pie2_3 .part1 { transition: stroke-dashoffset 0.06s linear; }
.js-svg-pie2.js-svg-pie2_3.is-active .part1 { stroke-dashoffset: 520.25; }

/* 2. 青(77%) */
.js-svg-pie2.js-svg-pie2_3 .part2 { transition: stroke-dashoffset 0.62s linear; transition-delay: 0.06s; }
.js-svg-pie2.js-svg-pie2_3.is-active .part2 { stroke-dashoffset: 130.06; }

/* 3. 緑(15%) */
.js-svg-pie2.js-svg-pie2_3 .part3 { transition: stroke-dashoffset 0.12s ease-out; transition-delay: 0.68s; }
.js-svg-pie2.js-svg-pie2_3.is-active .part3 { stroke-dashoffset: 480.67; }

/* 4. 水色(0% - 表示しない) */
.js-svg-pie2.js-svg-pie2_3 .part4 { transition: none; }
.js-svg-pie2.js-svg-pie2_3.is-active .part4 { stroke-dashoffset: 565.49; }

/* 5. 薄グレー(0% - 表示しない) */
.js-svg-pie2.js-svg-pie2_3 .part5 { transition: none; }
.js-svg-pie2.js-svg-pie2_3.is-active .part5 { stroke-dashoffset: 565.49; }

.op0{
    position: relative;
    opacity: 0;
    top: 10px;
    transition: all 0.8s;
}

.op0.is-active{
    top: 0;
    opacity: 1;
}

@media screen and (max-width: 900px) {
    .oc-stats{
        padding:40px 20px 80px;
    }


    .oc-tab,
    .job-tabs__btn{

        width: 33%;
    }

    .oc-tabs.sp50 .oc-tab{
        width: 50%;
    }

    .oc-tab:last-child,
    .job-tabs__btn:last-child{
        width: 34%;
    }

    .oc-block{
        max-width: 100%;
        margin: 0 auto;
        padding: 1px 0 0;
    }

    .oc-block__title,
    .job-list__base{
        margin: 0 0 20px;
        font-size: 20px;
        line-height: 100%; /* 20px */
        letter-spacing: 0.4px;
        padding-left: 18px;
        margin-top: 40px;
        position: relative;
    }

    .oc-block__title{
        margin-top: 70px;
        margin-bottom: 30px;
    }

    .oc-block__title.sp_mt0{
        margin-top: 0;
    }

    .job-list__base{
        margin-top: 0;
    }

    .oc-block__title:before,
    .job-list__base:before{

        width: 6px;
        height: 22px;
        background: url(../images/data/ttl_sp.svg) no-repeat left top;
        background-size: cover;
        top: 2px;
    }

    /* tabs */
    .oc-tabs,
    .job-tabs{
        width: 100%;
    }

    .job-tabs{
        margin-bottom: 40px;
    }

    .oc-grid--staff.is-active,
    .oc-grid--work.is-active{
        display: block; /* 元のレイアウトに合わせて調整してください */
    }

    /* grids */
    .oc-grid{
        /*display: block;*/
        gap: 0;
    }

    .oc-grid.is-active{
        display: block;
    }
    /* card */
    .oc-card{
        border-radius: 6px;
        padding: 22px 24px 0px;
        min-height: 344px;
        margin-bottom: 15px;
    }

    .oc-grid--company .oc-card.oc-card--wide{
        min-height: 344px;
    }

    .oc-card__head{
        margin: 0 0 20px;
        font-size: 21px;
        font-weight: 700;
        line-height: 125%; /* 32.5px */
        letter-spacing: 0.52px;
    }

    /* layout helpers */
    .oc-center{
        text-align: center;
    }
    .oc-stack{
        display: grid;
        gap: 12px;
    }
    .oc-split{
        display: grid;
        grid-template-columns: 1.1fr .9fr;
        align-items: center;
        gap: 16px;
    }

    /* big numbers */
    .oc-big{
        margin: 0;
        line-height: 1;
        font-weight: 800;
        letter-spacing: .02em;
        color: #4b55b8;
        text-align: center;
        position: relative;
    }

    .oc-big .ttl_bg{
        width: 150px;
        height: 89px;
        top: 8px;
    }

    .oc-big__prefix{
        margin-right: 6px;
        font-size: 16px;
        font-weight: 700;
        vertical-align: baseline;
        color: #4b55b8;
    }

    .oc-big__num{
        font-size: 60px;
    }
    .oc-big__num.top{
        font-size: 64px;
    }
    .oc-big__unit{
        font-size: 25px;
        font-style: normal;
        font-weight: 700;
        line-height: 200%; /* 72px */
        letter-spacing: 0.72px;
        margin-left: 10px;
    }

    .oc-big__unit.ml0{
        margin-left: 0;
    }

    .oc-big__unit.block{
        display: block;
        margin-left: 0;
        width: 100%;
        line-height: 100%;
        position: relative;
        top: -4px;
    }

    .oc-big--tight .oc-big__num{ font-size: 52px; }

    /* sub/note */
    .oc-sub{
        margin: 15px 0 0;
        font-size: 15px;
    }
    .oc-sub--small{
        margin-top: 10px;
        font-size: 11px;
        font-weight: 600;
        color: #333;
        line-height: 1.7;
    }
    .oc-sub--mid{
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #4b55b8;
    }

    .oc-note{
        margin-top: 5px;
    }

    .hmin4 .oc-note{
        font-size: 15px;
        margin-top: 15px;
        padding-bottom: 15px;
    }

    .hmin4 .oc-note span{
        display: inline-block;
        padding-right: 15px;
    }

    .oc-note--bottom{
        margin-top: 12px;
        text-align: left;
    }
    .oc-note--bottom2{
        margin-top: 30px;
        text-align: left;
    }

    /* illust/chart */
    .oc-illust{
        margin: 20px auto 0;
        display: flex;
        justify-content: center;
    }

    .oc-illust svg{
        width: 230px;
        height: auto;
    }

    .oc-illust img{
        width: 100%;
        height: auto;
        display: block;
    }

    .oc-illust03{
        width: 161px;
        margin: 20px auto 0;
        padding: 0px 0px 0;
    }

    .oc-illust.country{
        width: 100%;
        max-width: 268px;
        margin: 30px auto 0;
    }

    .oc-illust.num{
        width: 100%;
        max-width: 200px;
        margin: 14px auto 0;
    }

    .oc-chart{
        width: 100%;
        max-width: 260px;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    /* bars */
    .oc-bars{
        display: grid;
        gap: 10px;
        margin-top: 10px;
    }
    .oc-bar{
        display: grid;
        grid-template-columns: 1fr; /* 縦積み */
        gap: 6px;
        width: 220px;
        margin: 0 auto;
    }


    /* 下段：バー＋数値 */
    .oc-bar__track{
        height: 32px;
    }

    .oc-bar__val{
        font-size: 30px;
    }

    .oc-bar__val span{
        font-size: 14px;
    }

    /* 横並び用ラッパー */
    .oc-bar__row{
        display: flex;
        align-items: center;
    }
    .oc-bar__fill{
        display: block;
        height: 100%;
        border-radius: 0;
    }
    .oc-bar__fill.is-blue{ background: #5666BE; }
    .oc-bar__fill.is-brown{ background: #A68C73; }
    .oc-bar__val{ text-align: left; white-space: nowrap;
    }

    /* legend */
    .oc-legend{
        margin: 0;
        display: grid;
        gap: 10px;
    }
    .oc-legend__row{
        display: flex;

    }

    .oc-legend dt{
        font-size: 16px;

    }
    .oc-legend dd{
        margin: 0;
        font-size: 16px;
        font-weight: 800;
        color: #4b55b8;
        margin-left: 8px;

    }
    .oc-per{
        font-size: 60px;
        width: 2.5ch;   /* ← 数字の左端を揃える */
    }

    .oc-per__unit{
        font-size: 24px;
    }
    .oc-dot{
        width: 24px;
        height: 24px;
    }
}
/* staff */

/* staff: 2カラム(左小/右大) → 1カラム → 3カラム */
.oc-grid--staff > .oc-card{
    grid-column: span 4; /* デフォ：3カラム(4/12×3) */
}

.oc-grid--staff > .oc-card.oc-card3{
    grid-column: span 3;
}

.oc-grid--staff > .oc-card--half-left{
    grid-column: span 5; /* 1段目 左 */
}

.oc-grid--staff > .oc-card--half-right{
    grid-column: span 7; /* 1段目 右 */
}

.oc-grid--staff > .oc-card--full{
    grid-column: 1 / -1; /* 2段目 1カラム */
}

.staff1 .oc-center{
    padding-top: 10px;
}

.staff1 .oc-big__unit{
    font-size: 84px;
    font-weight: 700;
    line-height: 100%; /* 84px */
    margin-right: 10px;
    margin-left: 5px;
}

.staff1 .oc-illust{
    margin-top: 35px;
}

.staff2 .oc-split{
    padding-top: 45px;
}

.staff2 .oc-split .oc-split__left{
    padding-left: 14px;
    width: 244px;
}

.staff2 .oc-split .oc-split__left svg,
.staff3 .oc-split .oc-split__left svg{
    width: 100%;
    height: auto;
}

.staff2 .oc-split{
    grid-template-columns: 280px 1fr; /* 左固定 / 右残り */
    gap: 24px;
}

.staff2 .oc-sub--small{
    margin: 15px 0 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 175%; /* 31.5px */
    letter-spacing: 0.36px;
}

.staff3 .oc-split .oc-split__left{
    padding-left: 142px;
    width: 382px;
;
}


.staff3 .oc-split{
    grid-template-columns: 382px 1fr; /* 左固定 / 右残り */
    gap: 120px;
    margin-top: 75px
}

.staff3 .oc-legend{
    display: flex;
    flex-wrap: wrap;
    width: 476px;
    justify-content: space-between;
}

.staff3 .oc-legend .oc-legend__row{
    width: 210px;
}

.staff3 .oc-legend .oc-legend__row.w100{
    width: 100%;
}

.staff3 .oc-per{
    color: var(--text-gray_5, #282B33);
    font-family: Roboto;
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 50px */
}

.staff3 .oc-per__unit{
    color: var(--text-gray_5, #282B33);
    font-size: 50px;
    font-weight: 700;
    line-height: 100%; /* 50px */
}

.staff3 .oc-sub--small{
    font-size: 18px;
    font-weight: 500;
    line-height: 175%; /* 31.5px */
    letter-spacing: 0.36px;
}

.oc-card.oc-card--hmin{
    min-height: 344px;
}

.hmin1 .oc-big{
    padding-top: 16px;
    margin: 0px 0 60px;
}

.hmin2 .oc-big,
.hmin3 .oc-big{
    padding-top: 48px;
}

@media screen and (max-width: 1200px) {
    .oc-block {
        padding-left: 10px;
        padding-right: 10px;
    }
}
@media screen and (max-width: 1100px) {
    .staff2 .oc-split {
        margin-right: auto;
        margin-left: auto;
        width: 610px;
        margin: 0 auto;
        padding-left: 0;
    }

    .staff2 .oc-split .oc-split__left{
        padding-left: 0;
    }


    .oc-grid--staff > .oc-card--half-left,
    .oc-grid--staff > .oc-card--half-right{
        grid-column: 1 / -1;
    }
    .staff3 .oc-split .oc-split__left{
        padding-left: 0;
        width: 200px;
    }

    .staff3 .oc-split {
        grid-template-columns: 200px 1fr;
        gap: 60px;
        min-height: 380px;
        margin-top: 0;
    }
}


@media screen and (max-width: 900px) {
    .staff1 .oc-center{
        padding-top: 10px;
    }

    .staff1 .oc-big__unit{
        font-size: 60px;
        margin-right: 0px;
        margin-left: 0px;
        letter-spacing: 0;
    }

    .staff1 .oc-illust{
        margin: 24px auto 0;
        width: 153px;
    }

    .staff2 .oc-split{
        padding-top: 24px;
        width: 100%;
    }

    .staff2 .oc-split .oc-split__left{
        padding-left: 0px;
        width: 140px;
        margin: 0 auto;
    }

    .staff2 .oc-legend{
        width: 180px;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 24px auto 0;
        gap: 0px;
    }

    .staff2 .oc-split .oc-split__left svg,
    .staff3 .oc-split .oc-split__left svg{
        width: 100%;
        height: auto;
    }

    .staff2 .oc-split{
        display: block;
        padding-top: 10px;
    }

    .staff2 .oc-illust{
        margin-top: 0;
    }

    .staff2 .oc-sub--small{
        margin: 5px 0 0;
        font-size: 14px;
        text-align: center;
        padding-bottom: 20px;
    }

    .staff3 .oc-split .oc-split__left{
        padding-left: 0px;
        width: 140px;
        margin: 0 auto;
    }


    .staff3 .oc-split{
        display: block;
        margin-top: 30px;
    }
    .staff2 .oc-illust svg{
        width: 140px;
    }
    .staff3 .oc-legend{
        width: 100%;
        margin: 24px auto 0;
    }

    .staff3 .oc-legend .oc-legend__row{
        width: 48%;
    }

    .staff3 .oc-legend .oc-legend__row.w100{
        width: auto;
    }

    .oc-card.oc-card--full.staff3{
        height: auto;
    }

    .staff3 .oc-split{
        min-height: 190px;
    }

    .staff3 .oc-per{
        font-size: 28px;
    }

    .staff3 .oc-per__unit{
        font-size: 20px;
    }

    .staff3 .oc-sub--small{
        font-size: 14px;
        line-height: 150%; /* 31.5px */
        width: 220px;
        margin: 13px auto 0;
        padding-bottom: 20px;
    }

    .oc-card.oc-card--hmin{
        min-height: 180px;
    }

    .hmin1 .oc-big{
        padding-top: 0px;
        margin: 0px 0 15px;
    }

    .hmin1 .oc-note{
        padding-bottom: 10px;
    }

    .hmin2 .oc-big,
    .hmin3 .oc-big{
        padding-top: 15px;
    }
}

.oc-grid--work .oc-card__head{
    margin-bottom: 50px;
}

.oc-grid--work .oc-card.work03 .oc-card__head{
    margin-bottom: 17px;
}

.oc-grid--work .oc-card{
    min-height: 400px;
}

.oc-grid--work .oc-big__num{
    font-size: 80px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 80px */
}

.oc-grid--work .oc-big__unit{
    font-size: 28px;
    margin-left: 7px;
}

.oc-grid--work .work01 .oc-illust,
.oc-grid--work .work02 .oc-illust,
.oc-grid--work .work03 .oc-illust{
    margin-top: 15px;
}

.oc-grid--work .work03 .oc-note {
    margin-top: 15px;
}

.oc-grid--work .work04 .oc-card__head,
.oc-grid--work .work05 .oc-card__head,
.oc-grid--work .work06 .oc-card__head{
    margin-bottom: 45px;
}

.oc-grid--work .work05 .oc-illust{
    margin-top: 0px;
}

.oc-grid--work .work04 .oc-note {
    margin-top: 96px;
    padding-bottom: 10px;
}

.oc-grid--work .work05 .oc-sub--mid,
.oc-grid--work .work06 .oc-sub--mid{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 28px;
    font-weight: 700;
    line-height: 100%; /* 56px */
    letter-spacing: 0.56px;
    padding-bottom: 5px;
}

.oc-grid--work .work05 .oc-note {
    margin-top: 0px;
}

.oc-grid--work .work06 .oc-illust{
    margin-top: 25px;
}

.oc-grid--work .work06 .oc-note {
    margin-top: 8px;
    padding-bottom: 10px;
}

@media screen and (max-width: 900px) {
    .oc-grid--work .oc-card__head{
        margin-bottom: 50px;
    }

    .oc-grid--work .oc-card.work03 .oc-card__head{
        margin-bottom: 30px;
    }

    .oc-grid--work .oc-card{
        min-height: 344px;
    }

    .oc-grid--work .oc-card.work04{
        min-height: 270px;
    }

    .oc-grid--work .oc-big__num{
        font-size: 60px;
    }

    .oc-grid--work .oc-big__unit{
        font-size: 24px;
        margin-left: 7px;
    }

    .oc-grid--work .work01 .oc-illust,
    .oc-grid--work .work02 .oc-illust,
    .oc-grid--work .work03 .oc-illust{
        margin-top: 15px;
    }

    .oc-grid--work .work01 .oc-illust{
        width: 240px;
    }

    .oc-grid--work .work03 .oc-note {
        margin-top: 15px;
    }

    .oc-grid--work .work04 .oc-card__head,
    .oc-grid--work .work05 .oc-card__head,
    .oc-grid--work .work06 .oc-card__head{
        margin-bottom: 45px;
    }

    .oc-grid--work .work04 .oc-note {
        margin-top: 24px;
    }

    .oc-grid--work .work05 .oc-sub--mid,
    .oc-grid--work .work06 .oc-sub--mid{
        color: var(--primary-corporate_blue, #5666BE);
        font-size: 28px;
        font-weight: 700;
        line-height: 100%; /* 56px */
        letter-spacing: 0.56px;
        padding-bottom: 5px;
    }

    .oc-grid--work .work05 .oc-big,
    .oc-grid--work .work05 .oc-sub,
    .oc-grid--work .work06 .oc-big,
    .oc-grid--work .work06 .oc-sub{
        display: inline-block;
    }

    .oc-grid--work .work05 .oc-sub,
    .oc-grid--work .work06 .oc-sub{
        font-size: 20px;
    }

    .oc-grid--work .work05 .oc-illust{
        width: 100px;
        margin: 10px auto 0;
    }

    .oc-grid--work .work05 .oc-note {
        margin-top: 30px;
    }

    .oc-grid--work .work06 .oc-illust{
        margin: 30px auto 0;
        width: 161px;
    }

    .oc-grid--work .work06 .oc-note {
        margin-top: 27px;
    }
}


/* /staff end */
/*data------------------------------------------------------------*/

/* employee-benefits
------------------------------------------------------------*/


.oc-allowance__list{
    list-style: none;
    margin: 0;
    padding: 0;

}

.oc-allowance__list:last-child{
    margin-bottom: 0;
}

.oc-allowance__item{
    display: grid;
    grid-template-columns: 278px 1fr; /* 左ブロック固定・右残り */
    column-gap: 64px;
    padding: 32px 0;
    border-radius: 12px;
    background: #FFF;
    margin-bottom: 12px;
    padding: 40px 32px;
}

.oc-allowance__left{
    display: flex;
    align-items: center;
    gap: 24px;
    min-width: 0;
}

.oc-allowance__icon{
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    display: grid;
    place-items: center;
}

.oc-allowance__icon img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.oc-allowance__title{
    font-size: 20px;
    font-weight: 700;
    line-height: 150%; /* 30px */
    letter-spacing: 0.4px;
}

.oc-allowance__right{
    min-width: 0;
    display: flex;
    align-items: center;
}

.oc-allowance__text{
    color: var(--text-gray_5, #282B33);
    font-size: 16px;
    font-weight: 400;
    line-height: 175%; /* 28px */
    letter-spacing: 0.32px;
}

.oc-allowance__text--muted{
    color: #777;
    letter-spacing: 0.06em;
}

/* SP */
@media (max-width: 768px){
    .oc-allowance__item{
        grid-template-columns: 1fr;
        row-gap: 12px;
        padding: 24px 0;
    }

    .oc-allowance__left{
        gap: 18px;
    }

    .oc-allowance__title{
        white-space: normal;
    }

    .oc-allowance__right{
        align-items: flex-start;
    }
}

@media screen and (max-width: 768px) {


    .oc-allowance__list{
        list-style: none;
        margin: 0;
        padding: 0;

    }

    .oc-allowance__item{
        display: block;
        column-gap: 0;
        padding: 16px 20px;
        border-radius: 6px;
        margin-bottom: 8px;
    }

    .oc-allowance__left{
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
    }

    .oc-allowance__icon{
        width: 36px;
        height: 36px;
        flex: 0 0 36px;
    }

    .oc-allowance__title{
        font-size: 16px;
        line-height: 150%; /* 24px */
        letter-spacing: 0.32px;
    }

    .oc-allowance__right{
        min-width: 0;
        display: flex;
        align-items: center;
    }

    .oc-allowance__text{
        margin-top: 8px;
        font-size: 14px;
        font-weight: 400;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.28px;
    }

    .oc-allowance__text--muted{
        color: #777;
        letter-spacing: 0.06em;
    }
}

/*employee-benefits------------------------------------------------------------*/

/* JOB
------------------------------------------------------------*/

.anchor-nav{
    padding: 0 0 80px;
}

.anchor-nav__list{
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
    list-style:none;
    display:flex;
    gap: 0px;
}

.anchor-nav__item{
    position: relative;
}

.anchor-nav__trigger{
    appearance:none;
    background:none;
    border:0;
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 20px;
    font-weight: 700;
    line-height: 100%; /* 20px */
    letter-spacing: 0.8px;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:0px;
    width: auto;
    border-right: 1px solid var(--text-gray_50, #D4D4D4);
    padding-left: 28px;
    text-align: left;
    padding-right: 30px;
}

.anchor-nav__list .anchor-nav__item:nth-child(1) .anchor-nav__trigger{
    padding-left: 0px;
    padding-right: 0px;
    width: 148px;
}

.anchor-nav__list .anchor-nav__item:last-child .anchor-nav__trigger{
    border-right: none;
}

.anchor-nav__icon{
    padding-left: 24px;
    width: 37px;
}


/* hover open */
.anchor-nav__item:hover .anchor-nav__dropdown{
    opacity:1;
    visibility:visible;
    transform: translateY(0);
}

/* SP */
@media (max-width: 768px){
    .anchor-nav__list{
        gap:24px;
    }
}


.job-list{
    padding: 0px 0 120px;
}

.job-list__inner,
.job-system{
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}



/* layout */
.job-list__grid{
    display:grid;
    grid-template-columns: 250px 1fr;
    gap: 0px;
    margin-top: 0px;
    align-items: start;
}

.job-list__grid.mt{
    margin-top: 120px;
}

/* cards */
.job-cards{
    background:#fff;
    border-radius: 0;
    overflow: hidden;
}

.job-card{
    display:flex;
    justify-content: space-between;
    gap: 0px;
    padding: 35px 80px 35px 16px;
    text-decoration: none;
    color:#282B33;
    border-top: 1px solid #D4D4D4;
    transition: all 0.2s;
}


.job-card:hover{
    background: #EEF0F8;
}

.job-card__body{
    min-width: 0;
}

.job-card__title{
    margin: 0 0 20px;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 24px */
    letter-spacing: 0.96px;
}

.job-card__desc{
    margin: 0;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 28px */
    letter-spacing: 0.64px;
}

/* arrow circle */
.job-card__arrow{
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    align-self: center;
    position: relative;
    left: 20px;
}

.job-system .image{
    max-width: 1150px;
    margin: 65px auto 120px;
    text-align: center;
}

.jobs-flow{
    background: #F2F2F3;
    padding: 120px 0 120px;
}

.jobs-flow__inner{
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}

.jobs-flow .job-list__base{
    margin-bottom: 64px;
}

/* list */
.jobs-flow__list{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

/* card */
.jobs-flow__item{
    position: relative;
    background:#fff;
    border-radius: 12px;
    padding: 56px 24px 42px;
}

.jobs-flow__num{
    position:absolute;
    top:-28px;
    left:12px;
    width:56px;
    height:56px;
    border-radius: 50%;
    background:#5666BE;
    display:grid;
    place-items:center;

    color: #FFF;
    text-align: center;
    font-family: Roboto;
    font-size: 26px;
    font-weight: 500;
    line-height: 100%; /* 26px */
    letter-spacing: 0.52px;

}

.jobs-flow__itemTitle{
    color: var(--primary-corporate_blue, #5666BE);
    font-size: 18px;
    font-weight: 700;
    line-height: 100%; /* 18px */
    letter-spacing: 0.36px;
}

.jobs-flow__text{
    margin:15px 0 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 175%; /* 28px */
    letter-spacing: 0.32px;
}


/* カード間の白い接続線 */
.jobs-flow__item::after{
    content: "";
    position: absolute;
    top: 50%;
    right: -32px;          /* gap の半分くらい */
    width: 32px;           /* 次のカードまでの距離 */
    height: 2px;
    background: #fff;
    transform: translateY(-50%);
}

/* 最後のカードは線なし */
.jobs-flow__item:last-child::after{
    display: none;
}

.job-system__detail{
    display: none;
}

.job-card .job-card__arrow svg circle,
.job-card .job-card__arrow svg path,
.return-link svg circle,
.return-link svg path{
    transition: all 0.2s;
}

/* hover */
@media (hover:hover){


    .job-card:hover .job-card__arrow svg circle,
    .return-link:hover svg circle{
        fill: #5666BE;
        stroke: #5666BE;
    }

    .job-card:hover .job-card__arrow svg path,
    .return-link:hover svg path{
        stroke: #FFFFFF;
    }
}

/* responsive */
@media (max-width: 768px){


    .anchor-nav__list{
        max-width: 100%;
        padding: 0 20px;
        display:block;
    }


    .anchor-nav__trigger{
        font-size: 16px;
        letter-spacing: 0.64px;
        width: 100%;
        border-right: none;
        padding-left: 0px;
        padding-right: 0px;
        width: 126px;
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
    }

    .anchor-nav__list .anchor-nav__item:nth-child(1) .anchor-nav__trigger{
        padding-left: 0px;
        padding-right: 0px;
        width: 126px;

    }

    .anchor-nav__list .anchor-nav__item:last-child .anchor-nav__trigger{
        border-right: none;
        padding-left: 0px;
        padding-right: 0px;
        margin-bottom: 0;
    }

    .anchor-nav__icon{
        padding-left: 0px;
        width: 12px;
    }


    /* hover open */
    .anchor-nav__item:hover .anchor-nav__dropdown{
        opacity:1;
        visibility:visible;
        transform: translateY(0);
    }

    .job-list{
        padding: 0px 0 80px;
    }

    .job-list__inner,
    .job-system{
        max-width: 100%;
        padding: 0 20px;
    }

    /* layout */
    .job-list__grid{
        display:block;
    }

    .job-list__grid.mt{
        margin-top: 80px;
    }

    .job-card{
        display:flex;
        justify-content: space-between;
        gap: 0px;
        padding: 30px 0px 30px 16px;
    }

    .job-card__title{
        font-size: 18px;
        line-height: 140%; /* 18px */
        letter-spacing: 0.72px;
    }

    .job-card__desc{
        font-size: 14px;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.56px;
        padding-right: 20px;
    }

    /* arrow circle */
    .job-card__arrow{
        flex: 0 0 32px;
        width: 32px;
        height: 32px;
        left: 0px;
    }


    .job-system .image{
        margin: 45px 0 30px;
        text-align: center;
    }

    .job-system__detail{
        display: flex;
        justify-content: space-between;
        padding-bottom: 40px;
    }

    .job-system__detail .job-system__detail-l,
    .job-system__detail .job-system__detail-r{
        width: 45.37%;
    }

    .job-system__detail .job-system__detail-r{
        padding-top: 66px;
    }

    .job-system__detail h3{
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%; /* 24px */
        letter-spacing: 0.32px;
        border-bottom: 1px solid var(--primary-corporate_blue, #5666BE);
        padding-bottom: 2px;
        margin-bottom: 10px;
        color: #5666BE;
    }

    .job-system__detail p{
        color: var(--text-gray_25, #8E8E8E);
        font-size: 13px;
        font-weight: 400;
        line-height: 150%; /* 19.5px */
        letter-spacing: -0.39px;
        margin-bottom: 5px;
    }

    .job-system__detail ul{
        margin-bottom: 25px;
    }

    .job-system__detail ul li{
        font-size: 15px;
        font-weight: 500;
        line-height: 175%; /* 26.25px */
        letter-spacing: -0.45px;
        text-indent: -1em;
        padding-left: 1em;
    }

    .jobs-flow{
        padding: 80px 0 40px;
    }

    .jobs-flow__inner{
        max-width: 100%;
        padding: 0 20px;
    }

    .jobs-flow .job-list__base{
        margin-bottom: 64px;
    }

    /* list */
    .jobs-flow__list{
        display:block;
        gap: 0px;
    }

    /* card */
    .jobs-flow__item{
        border-radius: 12px;
        padding: 40px 24px 32px;
        margin-bottom: 40px;
    }

    .jobs-flow__num{
        top:-24px;
        width:48px;
        height:48px;
        font-size: 21px;
    }

    .jobs-flow__itemTitle{
        font-size: 16px;
    }

    .jobs-flow__text{
        margin:13px 0 0;
        font-size: 14px;
        font-weight: 400;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.28px;
    }


    /* カード間の白い接続線 */
    .jobs-flow__item::after{
        content: "";
        position: absolute;
        top: auto;
        right: auto;         /* gap の半分くらい */
        bottom: -40px;
        left: 38px;
        width: 4px;           /* 次のカードまでの距離 */
        height: 40px;
        background: #fff;
        transform: translateY(-50%);
    }

    /* 最後のカードは線なし */
    .jobs-flow__item:last-child::after{
        display: none;
    }
}





@media screen and (max-width: 768px) {
}

/*JOB------------------------------------------------------------*/


/* JOB DETAIL
------------------------------------------------------------*/
.jobs-detail__inner{
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 40px 120px;
}

/* head */
.jobs-detail__head{
    padding: 0px 0 56px;
}

.jobs-detail__jobTitle{
    margin: 0 0 30px;
    color: var(--primary-corporate_blue, #5666BE);
    font-family: "Noto Sans JP";
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 32px */
    letter-spacing: 1.28px;
}

.jobs-detail__lead{
    color: var(--text-gray_5, #282B33);
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.64px;
}

/* table */
.jobs-detail__table{
    border-top: 2px solid var(--text-gray_75, #F2F2F3);
}

.jobs-detail__row{
    display: grid;
    grid-template-columns: 200px 1fr;

}

.jobs-detail__th{
    background: #f5f5f6;
    padding: 40px;
    color: #5666BE;
    letter-spacing: 0.02em;
    font-size: 16px;
    font-weight: 500;
    line-height: 200%; /* 32px */
    letter-spacing: 1.28px;
    border-bottom: 2px solid var(--text-gray_75, #FFF);
}

.jobs-detail__td{
    padding: 40px;
    font-size: 16px;
    font-weight: 400;
    line-height: 200%; /* 32px */
    letter-spacing: 0.64px;
    border-bottom: 2px solid var(--text-gray_75, #F2F2F3);
}

.jobs-detail__row:last-child .jobs-detail__th,
.jobs-detail__row:last-child .jobs-detail__td{
    border-bottom: 2px solid var(--text-gray_75, #F2F2F3);
}



.jobs-detail__list{
    list-style: none;
    margin: 0 0 35px;
    padding: 0;
}

.jobs-detail__td .jobs-detail__block:last-child .jobs-detail__list{
    margin-bottom: 0;
}

.jobs-detail__list li{
    position: relative;
    padding-left: 18px;
}

.jobs-detail__list li + li{
    margin-top: 8px;
}

.jobs-detail__list li::before{
    content: "■";
    position: absolute;
    left: 0;
    top: 0;
    color: #111;
}

/* responsive */
@media (max-width: 768px){
    .jobs-detail__inner{
        padding: 0 16px 64px;
    }

    .jobs-detail__row{
        grid-template-columns: 1fr;
    }

    .jobs-detail__th{
        padding: 18px 16px;
    }

    .jobs-detail__td{
        padding: 18px 16px 24px;
    }
}

@media screen and (max-width: 768px) {
    .sub_kv.culture.jobs.detail{
        padding-bottom: 75px;
    }
    .jobs-detail__inner{
        max-width: 100%;
        margin: 0px auto 0;
        padding: 0 20px 80px;
    }

    /* head */
    .jobs-detail__head{
        padding: 0px 0 40px;
    }

    .jobs-detail__jobTitle{
        margin: 0 0 20px;
        font-size: 24px;
        letter-spacing: 0.48px;
    }

    .jobs-detail__lead{
        font-size: 14px;
        letter-spacing: 0.28px;
    }

    .jobs-detail__row{
        display: grid;
        grid-template-columns: 96px 1fr;

    }

    .jobs-detail__th{
        padding: 16px;
        letter-spacing: 0.02em;
        font-size: 14px;
        line-height: 150%; /* 21px */
        letter-spacing: 1.12px;
    }

    .jobs-detail__td{
        padding: 16px;
        font-size: 14px;
        line-height: 175%; /* 24.5px */
        letter-spacing: 0.56px;
    }

    .jobs-detail__row:last-child .jobs-detail__th,
    .jobs-detail__row:last-child .jobs-detail__td{
        border-bottom: 2px solid var(--text-gray_75, #F2F2F3);
    }



    .jobs-detail__list{
        list-style: none;
        margin: 0 0 30px;
        padding: 0;
    }

    .jobs-detail__td .jobs-detail__block:last-child .jobs-detail__list{
        margin-bottom: 0;
    }

    .jobs-detail__list li{
        position: relative;
        padding-left: 18px;
    }

    .jobs-detail__list li + li{
        margin-top: 8px;
    }

    .jobs-detail__list li::before{
        content: "■";
        position: absolute;
        left: 0;
        top: 0;
        color: #111;
    }
}

/*JOB DETAIL------------------------------------------------------------*/

/* MODAL
------------------------------------------------------------*/
/* =========================
   Movie Modal
========================= */
.movie-modal{
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
}

.movie-modal.is-active{
    display: block;
}

.movie-modal__bg{
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.6);
}

/* 動画のコンテナ：ここを中央配置にする */
.movie-modal__content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 65vw;
    max-width: 960px;
    aspect-ratio: 16 / 9; /* padding-topをやめて、これ一本にする！ */
    height: auto;
}

.movie-modal iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* iframeは、16:9になった親枠に100%でピッタリ合わせる */
}
/* ×ボタンが動画に被って消えた場合、位置を調整 */
.movie-modal__close {
    position: absolute;
    top: -40px; /* 動画の少し上に配置 */
    right: 0;
    color: #fff;
    font-size: 30px;
    background: none;
    border: none;
    cursor: pointer;
}

@media screen and (max-width: 768px) {
}

/*/MODAL------------------------------------------------------------*/

/* sub_kv__marquee
------------------------------------------------------------*/

@media screen and (max-width: 768px) {
    .movie-modal__content {
        width: 90vw;
    }
}

/*sub_kv__marquee------------------------------------------------------------*/

/* anc
------------------------------------------------------------*/
.anc{
    display: block;
    height: 1px;
    padding-top: 80px;
    margin-top: -80px;
}
@media screen and (max-width: 768px) {
    .anc{
        padding-top: 54px;
        margin-top: -54px;
    }
}

/*anc------------------------------------------------------------*/

/* loading
------------------------------------------------------------*/
.loading-container {

    /* コンテナ自身を全画面にして中央寄せ・背景色設定 */
    width: 100vw;
    height: 100vh;
    background-color: #EEF0F8;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999; /* サイト内の他の要素より一番手前に配置 */
    padding-bottom: 80px;
}

/* ---------------------------------------------------
   ここから下の .icons-row 以降のスタイルは前回と同じです
--------------------------------------------------- */
.icons-row {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 40px;
}

.icon-item svg {
    height: auto;
}

.item1 svg { width: 50px; }
.item2 svg { width: 55px; }
.item3 svg { width: 40px; }
.item4 svg { width: 60px; }
.item5 svg { width: 35px; }

.status-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    color: var(--line-color);
    font-weight: bold;
}

.label {
    color: var(--text-gray_5, #282B33);
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
}

.progress-track {
    width: 120px;
    height: 1px;
    background-color: #282B33;
    position: relative;
}

.progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #282B33;
    width: 0%;
    transition: width 0.1s ease-out;
}

.percentage {
    color: var(--text-gray_5, #282B33);
    font-family: Roboto;
    font-size: 22px;
    font-weight: 400;
    line-height: normal;
}
body.top{
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

/* 上に10px跳ねて戻るアニメーション */
@keyframes jumpUp {
    /* 全体の20%（1秒間）を使って跳ねて戻り、残りの時間は待機する */
    0%, 20%, 100% {
        transform: translateY(0);
    }
    10% {
        transform: translateY(-10px);
    }
}

/* アイコン共通のアニメーション設定（5秒かけて1ループ） */
.icon-item {
    animation: jumpUp 5s infinite ease-in-out;
}

/* 1秒おきに順番に動かすための遅延設定 */
.item1 { animation-delay: 0s; }
.item2 { animation-delay: 1s; }
.item3 { animation-delay: 2s; }
.item4 { animation-delay: 3s; }
.item5 { animation-delay: 4s; }

.oc-about.mg{
    margin: 120px auto;
}



@media screen and (max-width: 768px) {
    .oc-about.mg{
        margin: 80px auto;
    }



    .label {
        font-size: 15px;
    }

    .progress-track {
        width: 78px;
    }

    .percentage {
        font-size: 18px;
    }


    .status-row {
        gap: 12px;
    }

    .icons-row {
        gap: 13px;
        margin-bottom: 30px;
    }

    .item1 svg { width: 35px; }
    .item2 svg { width: 35px; }
    .item3 svg { width: 27px; }
    .item4 svg { width: 39px; }
    .item5 svg { width: 23px; }

    .loading-container {
        height: 100dvh;
    }
}

/*loading------------------------------------------------------------*/

/*top spスライダー------------------------------------------------------------*/
@media screen and (max-width: 768px) {

    /* SP用スライダーの親要素（はみ出しを隠す） */
    .top-photoFlow_sp {
        overflow: hidden;
        width: 100%;
        margin-top: 80px;
        margin-bottom: -80px;
    }

    /* 動くトラック部分 */
    .top-photoFlow__track_sp {
        display: flex;
        width: max-content; /* 中身の画像サイズに合わせて幅を広げる */

        /* ★ここでアニメーションのスピードを調整します（20s = 20秒で1周） */
        animation: photoFlow_marquee 25s linear infinite;

        /* GPUアクセラレーションでカクつき防止 */
        will-change: transform;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    /* 中身のセットも横並びにする */
    .top-photoFlow__track_sp .top-photoFlow__set {
        display: flex;
    }

    /* 無限スクロールのキーフレーム */
    @keyframes photoFlow_marquee {
        0% {
            transform: translate3d(0, 0, 0);
        }
        100% {
            /* 2セットあるうちの1セット分（半分の距離）を移動したらリセット */
            transform: translate3d(-50%, 0, 0);
        }
    }
    /*
  .pin-spacer{
    margin-top: 80px !important;
  }
   */
}
/*/top spスライダー------------------------------------------------------------*/

/*entry------------------------------------------------------------*/
.blc-entry-form .red {
    color: #AD1717;
}
.wrap-content{
    max-width: 1040px;
    width: 100%;
    margin: 0px auto 150px;
    padding: 0 10px 0;
    box-sizing: border-box;
}

.blc-entry-form .headline-mid {
    margin: 4rem 0 2rem;
    padding-left: 0;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: .06rem
}

.blc-entry-form .headline-mid small {
    font-size: 13px;
}

.blc-entry-form .form-txt {
    margin-bottom: 2rem;
    font-size: 16px;
    line-height: 1.5
}

.blc-entry-form .required {
    font-weight: 600;
    color: #AD1717;
    display: inline-block;
    padding-left: .4rem
}

.blc-entry-form .blc-url input + input {
    margin-top: 1rem
}

.blc-entry-form .btn-add-ipt {
    display: inline-block;
    margin-top: 1.8rem;
    padding: 1rem 2rem;
    border-radius: .5rem;
    background: #5666BE;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .1rem;
    line-height: 1;
    color: #fff;
    border: none;

    cursor: pointer;
}

.blc-entry-form .btn-add-ipt:before {
    content: url('../../2025/img/contact/icon-plus.svg');
    filter: brightness(0) invert(1);
    display: inline-block;
    width: 12px;
    height: 12px;
    fill: #fff;
    vertical-align: middle;
    margin: 0 .5rem .2rem 0
}

.label-type {
    display: inline-block;
    width: 100%;
    margin-bottom: 1.5rem
}

.label-type input {
    display: none
}

.label-type input:checked + label {
    font-weight: 600;
    color: #5666BE
}

.label-type input:checked + label::after {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: #5666BE;
    top: .8rem;
    left: .5rem
}

.label-type label {
    display: inline-block;
    padding: .4rem 2.8rem;
    letter-spacing: .06rem;
    position: relative
}

.label-type label::before, .label-type label::after {
    display: block;
    content: '';
    position: absolute
}

.label-type label::before {
    width: 1.6rem;
    height: 1.6rem;
    border: solid .2rem #bbb;
    border-radius: 50%;
    top: .3rem;
    left: 0
}

.label-type:last-child {
    margin-bottom: 0
}

.table-form {
    width: 100%;
    margin-bottom: 6rem
}

.table-form th, .table-form td {
    padding: 18px;
    border: solid .1rem #ccc;
    font-size: 16px;
    line-height: 1.5;
    vertical-align: middle;
    box-sizing: border-box;
}

.table-form th {
    width: 12rem;
    background: #F4F4F4;
    text-align: left;
    font-weight: 600;
    letter-spacing: .06rem;
    white-space: nowrap
}

.table-form th small {
    display: inline-block;
    margin-top: -.5rem;
    font-weight: 400;
    white-space: normal
}

.table-form td .txt {
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: .08rem
}

.table-form td .txt span:not(.required) {
    display: inline-block;
    font-weight: 600
}

.table-form td .txt span:not(.required)::after {
    content: '：';
    display: inline-block;
    padding: 0 1rem 0 .5rem
}

.table-form td p {
    line-height: 1.5
}

.table-form small {
    display: inline-block;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: .04rem;
    vertical-align: middle
}

.table-form .heading, .table-form .heading-min {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2
}

.table-form .td-cols {
    display: grid;
    grid-gap: 2rem 2rem;
    grid-template-columns:50% 50%;
    grid-template-rows:1fr
}

.table-form .td-cols input, .table-form .td-cols select {
    display: inline-block;
    width: calc(100% - 12.5rem)
}

.table-form .td-cols .postal {
    grid-column: 1 / 2;
    grid-row: 1 / 2
}

.table-form .td-cols .prefectures {
    grid-column: 2 / 3;
    grid-row: 1 / 2
}

.table-form .td-cols .address-1 {
    grid-column: 1 / 2;
    grid-row: 2 / 3
}

.table-form .td-cols .address-2 {
    grid-column: 2 / 3;
    grid-row: 2 / 3
}

.table-form .td-cols .building {
    grid-column: 1 / 3;
    grid-row: 3 / 4
}

.table-form .td-cols .heading {
    width: 10rem
}

.table-form .td-cols .heading-min {
    width: 4rem
}

.table-form .td-cols .phone {
    grid-column: 1 / 3;
    grid-row: 1 / 2
}

.table-form .td-cols .extension {
    grid-column: 1 / 2;
    grid-row: 2 / 3
}

.table-form .td-cols .fax {
    grid-column: 2 / 3;
    grid-row: 2 / 3
}

.table-form .td-cols .fax input {
    width: calc(100% - 6rem)
}

.table-form .td-cols .fax + .mail {
    grid-column: 1 / 3;
    grid-row: 3 / 4
}

.table-form .td-cols p[class^="txt-error"] {
    padding-left: 10.4rem
}

.inner-textarea .count {
    margin: -2rem 0 1rem;
    text-align: right;
    font-family: futura-pt, Futura PT, sans-serif
}

.inner-textarea textarea {
    font-size: 16px;
    line-height: 1.8
}

.inner-textarea .confirm {
    padding: 2.5rem;
    border: solid .1rem #ccc;
    border-radius: .4rem
}

.inner-textarea .confirm p {
    line-height: 1.8
}

.blc-policy {
    text-align: center
}

.blc-policy > div {
    margin-bottom: 4rem;
    padding: 1rem 2rem;
    background: #F4F4F4;
    text-align: left
}

.blc-policy > div p {
    font-size: 13px;
}

.blc-policy > div a {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: .2rem;
    padding: 0 .4rem;
    color: #5666BE
}

.blc-policy > div svg {
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    margin: 0 0 .2rem .4rem;
    fill: #5666BE;
    vertical-align: middle
}

.blc-policy p {
    line-height: 1.6;
    letter-spacing: .1rem
}

.blc-policy > p {
    margin-bottom: 2.6rem;
    font-size: 16px;
}

.check-agree {
    display: none
}

.check-agree + label {
    display: inline-block;
    padding: 1rem 1rem 1rem 3rem;
    font-size: 16px;
    letter-spacing: .1rem;
    position: relative;
    cursor: pointer;
}


.check-agree + label::before, .check-agree + label::after {
    content: '';
    display: inline-block;
    position: absolute
}

.check-agree + label::before {
    width: 1.5rem;
    height: 1.5rem;
    border: solid 0.1rem #bbb;
    border-radius: 0.3rem;
    top: 1rem;
    left: .5rem;
}

.check-agree + label::after {
    width: 0.6rem;
    height: 0.3rem;
    border-left: solid 0.2rem #fff;
    border-bottom: solid 0.2rem #fff;
    transform: rotate(-45deg);
    top: 1.5rem;
    left: 0.9rem;
}

.check-agree:checked + label {
    font-weight: 600
}

.check-agree:checked + label::before {
    background: #5666BE;
    border-color: #5666BE
}

.blc-btn-center {
    margin-top: 6rem;
    text-align: center;
}

.complete-title {
    margin-bottom: 4rem;
    font-size: 30px;
    letter-spacing: .1rem;
    text-align: center;
}

.blc-entry-completed {
    padding: 4rem 18rem 4rem 18rem;
    background: #F4F4F4;
    border-radius: .5rem;
}

.blc-entry-completed p {
    line-height: 1.8;
    margin-bottom: 0.1rem;
}

.blc-entry-completed a {
    margin-top: 3rem;
    display: flex;
    font-size: 16px;
    font-weight: 600;
    color: #5666BE;
    justify-content: center;
}


textarea {
    min-height: 4rem;
    line-height: 1.4;
    resize: vertical
}

select,input[type='text'],input[type='file'], input[type='date'], input[type='password'], input[type='number'], input[type='email'], input[type='password'], input[type='tel'], textarea {
    background-color: #fff;
    border: solid .1rem #ccc;
    border-radius: .4rem;
    padding: .8rem 1rem;
    box-sizing: border-box;
    max-width: 100%;
}

input[type='text']:focus, input[type='date']:focus, input[type='password']:focus, input[type='number']:focus, input[type='email']:focus, input[type='password']:focus, input[type='tel']:focus, textarea:focus {
    border-color: #5666BE
}

input[type='file'], input[type='checkbox'], input[type='radio'], select {
    cursor: pointer
}


.ipt-error {
    border-color: #c81b1b !important;
    background-color: #fdefef !important
}

.txt-error-req, .txt-error-kana, .txt-error-slt, .txt-error-mail, .txt-error-num, .txt-error-phone, .txt-error-etc, .txt-error-copies, .txt-error-textarea, .txt-error-file, .txt-error-update, .txt-error-update-ipt {
    font-size: 13px;
    font-weight: 600;
    color: #c81b1b;
    line-height: 1.5
}

input[class^='ipt-'] {
    font-size: 16px;
}

.ipt-ss {
    width: 8rem
}

.ipt-s {
    width: 30%
}

.ipt-m {
    width: 60%
}

.ipt-l {
    width: 80%
}

.ipt-max {
    width: 100%
}

input:disabled, textarea:disabled, button:disabled, select:disabled {
    cursor: not-allowed;
    background-color: #ccc !important;
    color: rgba(255, 255, 255, 0.9);
}

.recruit-submit-btn {
    background-color: #5C6DB3;
    color: #FFFFFF;
    margin: 0 2rem;
    font-weight: 700;
    padding: 22px 60px 22px ;
    border-radius: 999px;
    border: 2px solid #5C6DB3;
    font-size: 17px;
    letter-spacing: .02rem;
    display: inline-block;
    outline: none;
    line-height: 1;
    position: relative;
    cursor: pointer;
    transition: all .3s;
}

.recruit-submit-btn:disabled {
    border: none;
    background-color: #5C6DB3;
    color: #FFFFFF !important;
}

.recruit-back-btn {
    background-color: #FFFFFF;
    color: black;
    border: 2px solid black;
    margin: 0 2rem;
    font-weight: 700;
    padding: 22px 92px 22px 92px;
    border-radius: 0.7rem;
    font-size: 17px;
    letter-spacing: .02rem;
    display: inline-block;
    outline: none;
    line-height: 1;
    cursor: pointer;
    transition: all .3s;
}

.sec-title {
    margin-bottom: 4rem
}

.sec-title .header-title {
    font-size: 22px;
    letter-spacing: .1rem
}

.ipt-filetype {
    width: 100%;
}
@media screen and (max-width: 768px) {
    /*応募フォームここから*/
    .sec-entry .wrap-content {
        width: 100%;
        padding-top: 0vw;
    }

    .blc-entry-form > p {
        margin-bottom: 6.4vw;
        font-size: 12px;
    }

    .sec-entry .wrap-content {
        margin-bottom: 38.4vw;
        padding: 0vw 0 0;
    }

    .table-form th {
        padding: 1.92vw 3.84vw;
        border-top: none;
        border-bottom: none;
    }

    .table-form th, .table-form td {
        display: block;
        width: 100%;
        font-size: 14px;
    }

    .blc-entry-form .headline-mid {
        margin: 40px 0 10px;
        font-size: 20px;
        line-height: 1.4;
    }

    .table-form {
        border-top: solid 0.32vw #ccc;
        margin-bottom: 3rem;
    }

    .table-form input + small {
        margin-top: 1.6vw;
    }

    .top-our-business-slide {
        width: 100%;
        height: unset;
        overflow: visible;
    }

    .recruit-back-btn, .recruit-submit-btn {
        margin-bottom: 2.67vw;
        padding: 20px 40px;
        width: 100%;
        margin-left: unset;
    }

    .blc-btn-center {
        width: 90%;
        margin: 0 auto;
    }

    select{
        width: 100%;
        padding: 5px 12px;
        height: 52px;
        color: #1D1C1A;
        font-size: 16px;
        box-sizing: border-box;;
    }

    .sec-entry .wrap-content {
        margin: 0vw auto 26.6vw;
        padding: 0 5.3vw 0;
        box-sizing: border-box;
    }
    select,input[type='text'],input[type='file'], input[type='date'], input[type='password'], input[type='number'], input[type='email'], input[type='password'], input[type='tel'], textarea {
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }

    .blc-entry-completed {
        padding: 20px;
    }
}

/*/entry------------------------------------------------------------*/


/*error------------------------------------------------------------*/
/*エラーページここから*/
.sec-404 .wrap-content {
    padding-top: 150px;
    margin-bottom: 50px;
}

.error-title {
    margin-bottom: 5rem;
    font-size: 42px;
    font-weight: 700;
    letter-spacing: .3rem;
    text-align: center;
}
.error-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: #5666BE;
    margin: 2rem auto 0;
}

.sec-404 p {
    text-align: center;
    margin-bottom: 3rem;
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: .04rem;
    color: #909597;
}

.move-top-button {
    transition: all 0.3s ease;
    display: flex;
    width: 310px;
    margin: 136px auto 120px;
    padding: 22px 40px;
    justify-content: center;
    align-items: center;
    gap: 8px;

    color: #FFF;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: 0.02125rem;
    border: 2px solid #5C6DB3;

    border-radius: 8px;
    background: var(--CC-Main, #5C6DB3);
    box-shadow: 0px 8px 40px 0px rgba(0, 0, 0, 0.20);
    position: relative;
    text-decoration: none;
}

.move-top-button svg {
    position: absolute;
    right: 30px;
    width: 20px;

    transition: right 0.3s ease;
}
.move-top-button svg path {
    fill: white;
    transition: fill 0.3s ease;
}

/*hover対応 */
/*------------------------------------------------------------*/
/* PCの場合 */
@media (hover: hover) {


    .move-top-button:hover{
        background-color: #FFFFFF;
        color: #2D3F8A;
    }

    .move-top-button:hover svg path {
        fill: #2D3F8A;
    }

    .move-top-button:hover svg {
        right: 24px;
    }

}


@media screen and (max-width: 768px) {
    .move-top-button {
        width: 69.3%
    }
}
@media screen and (max-width: 768px) {

}
/*/top spスライダー------------------------------------------------------------*/

/*タブ追従------------------------------------------------------------*/
.culture_tub {
    position: sticky;
    /* ヘッダーの高さに合わせてtopの数値を調整してください */
    top: 80px; /* 例: PCのヘッダーが80pxの場合 */
    z-index: 49; /* コンテンツの下に潜り込まないようにするため */
    background-color: #fff; /* 背景が透けないように白を指定（デザインに合わせて変更してください） */
}

/* スマホ閲覧時などでヘッダーの高さが変わる場合は、メディアクエリでtopを調整します */
@media screen and (max-width: 768px) {
    .culture_tub {
        top: 54px; /* 例: スマホのヘッダーが60pxの場合 */
    }
}

/* 初期状態で非表示にするための設定 */
.oc-tabarea {
    display: none;
}
/* activeがついているものだけ表示 */
.oc-tabarea.is-active {
    display: block;
}
/*/タブ追従------------------------------------------------------------*/

/*------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    html.top,
    html.top body{
        overflow: visible ;
    }

    .top-member{
        width: 100%;
        overflow-x: hidden;
    }

    .android_area{
        overflow: visible;
    }

    .android_area .android_content.top{
        width: 100%;
        height: 100vh;
        background: #5666BE;
        position: sticky;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        top: 0;
        z-index: 1;
        margin-top: 160px;
    }

    .android_area .android_content.top svg{
        max-width: 100%;
        height: auto;
    }

    .android_area .android_content.btm{
        width: 100%;
        height: 100vh;
        background: url(../images/culture/bg.png) repeat;
        background-size: 25px 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        align-content: center;
        position: relative;
        z-index: 2;
    }

    .android_area .android_content.btm .culture-hero__title{
        opacity: 1;
        position: relative;
        top: auto;
    }

    .android_area .android_content.btm .image{
        width: 100%;
        padding: 0px 10px 30px;
    }

    .android_area .android_content.btm .image img{
        max-width: 100%;
        height: auto;
    }

    .android_area .android_content.btm .culture-hero__btn{
        opacity: 1;
        position: relative;
        left: auto;
        transform: none;
        bottom: auto;
    }
}
/*/------------------------------------------------------------*/

.top-member-card__image img{
    display: block;
}
.top-member-card__image {
    overflow: hidden;
    position: relative;
    z-index: 1;
    background-color: #eee; /* 読み込み前のチラつき防止 */
}

.top-member-card__image img {
    /* 初期状態は透明・等倍 */
    opacity: 0;
    transform: scale(1.0);

    /* フェードと拡大を同時に、少し長めの時間を設定 */
    transition: opacity 0.2s ease-out, transform .4s ease-out;

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

/* JavaScriptで付与される active クラス */
.top-member-card__image img.active {
    opacity: 1;
    z-index: 2; /* 前面に持ってくる */
}

/* 1枚目の画像は、枠の高さを維持するために position: relative にするが、
   重なりを制御するために z-index はJSと連動させる */
.top-member-card__image img:first-child {
    position: relative;
}

/* ホバー時：すべての img に対して transform をかける */
@media (hover: hover) {
    .top-member-card:hover .top-member-card__image img {
        transform: scale(1.05);
    }
}

/* 既存の @keyframes と .kv__stack のアニメーション指定を削除/修正 */
.kv__stack {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 400%; を削除。flexで縦に並べる */
    display: flex;
    flex-direction: column;
    will-change: transform;
}

.kv__stack .kv__img {
    width: 100%;
    height: auto; /* 高さは画像そのものに任せる */
    flex-shrink: 0;
    position: relative !important;
}

/* アニメーションの定義 */
@keyframes kv-slide-up {
    0%   { transform: translate3d(0, 0, 0); }
    25%  { transform: translate3d(0, calc(-100% / 4), 0); } /* 1枚目へ */
    30%  { transform: translate3d(0, calc(-100% / 4), 0); } /* 待機 */
    50%  { transform: translate3d(0, calc(-200% / 4), 0); } /* 2枚目へ */
    55%  { transform: translate3d(0, calc(-200% / 4), 0); } /* 待機 */
    75%  { transform: translate3d(0, calc(-300% / 4), 0); } /* 3枚目へ（クローン） */
    100% { transform: translate3d(0, calc(-300% / 4), 0); } /* 終了（ここでループ） */
}

/* 下向き（逆回転） */
@keyframes kv-slide-down {
    0%   { transform: translate3d(0, calc(-300% / 4), 0); }
    25%  { transform: translate3d(0, calc(-200% / 4), 0); }
    30%  { transform: translate3d(0, calc(-200% / 4), 0); }
    50%  { transform: translate3d(0, calc(-100% / 4), 0); }
    55%  { transform: translate3d(0, calc(-100% / 4), 0); }
    75%  { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

.kv__stack {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 400%; /* クローン含めて4枚分 */
    display: flex;
    flex-direction: column;
    will-change: transform;
    /* アニメーション開始までは停止 */
    animation-play-state: paused;
}

.kv__stack .kv__img {
    height: 25%; /* 1枚あたり1/4 */
    position: relative !important; /* absoluteを上書き */
}

.sub_kv__marquee.member.member01 svg path,
.sub_kv__marquee.member.member04 svg path{
    fill: #194989;
}
.sub_kv__marquee.member.member02 svg path,
.sub_kv__marquee.member.member05 svg path{
    fill: #788C9E;
}
.sub_kv__marquee.member.member03 svg path{
    fill: #00A4C7;
}
.sub_kv__marquee.member.member06 svg path{
    fill: #81B04D;
}




