/* =========================
   メインビジュアル（初期状態）
========================= */

.top-mv-section {
    position: relative;
    height: 90vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    background-color: #fff;
}

.top-mv-image-area{
    width:82% !important;
    left:auto !important;
    right:0 !important;
}

.top-mv-fixed{
    background-position:30% center !important;
}

.top-mv-text-area {
    position: relative;
    z-index: 10;
    width: 100%;
    padding-left: 20%;
    box-sizing: border-box;
}

.top-mv-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 7rem;
    font-weight: 300;
    letter-spacing: 0.05em;
    margin: 0 0 100px;
    line-height: 1.2;
}

.top-mv-title-ja {
    font-family: 'Noto Serif JP', serif;
    font-size: 3rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    display: block;
    margin: 15px 0 0;
}

.top-mv-subtitle {
    font-size: 1.8rem;
    letter-spacing: 0.15em;
    margin: 0 0 80px;
    line-height: 2;
    color: #fff;
}

    /* =========================
       ここからSP
    ========================= */
@media (max-width: 768px){

    /* =========================
       MV全体の高さ
    ========================= */
    .top-mv-section{
        height:550px !important;
        position:relative;
        overflow:hidden;
    }

    /* =========================
       SP画像
    ========================= */
    .top-mv-image-area{
        width:100% !important;
        height:70svh !important;
        object-fit:cover;
        display:block;

        content:url("https://test.tkenzai.co.jp/wp-content/uploads/2026/07/mv_sp02.jpg");
    }

    /* =========================
       SP メインビジュアル テキストエリア
    ========================= */
.top-mv-text-area{
    position:absolute;
    top:42%;
    left:0;
    width:100%;
    z-index:20;

    padding:30px 20px 20px;

    display:flex;
    flex-direction:column;
    align-items:flex-end;

    text-align:right;

    background:rgba(0,0,0,0.35);
}

    /* =========================
       SPテキスト
    ========================= */
    .top-mv-title{
        font-size:3.5rem;
        font-weight:700;
        line-height:1.1;
        margin-bottom:4px !important;
    }

    .top-mv-title-ja{
        font-size:2rem;
        font-weight:700;
        margin-top:4px !important;
        margin-bottom:0 !important;
    }

    .top-mv-subtitle{
        font-size:1.3rem !important;
        line-height:1.4;
        margin:0 !important;
    }

}
    /* =========================
       個別の背景は全部消す
    ========================= */
    .top-mv-title,
    .top-mv-title-ja,
    .top-mv-subtitle{
        background:none !important;
        padding:0 !important;
        border-radius:0 !important;

        color:#fff !important;
        text-shadow:0 2px 12px rgba(0,0,0,0.20);
    }



/* =========================
   ABOUT US
========================= */

.top-about-section{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:80px;
    width:100%;
    padding:0 8% 140px;
    background:#fff;
    margin-top:-120px;
    position:relative;
    overflow:hidden;
    box-sizing:border-box;
}

.top-about-left{
    flex:0 0 40%;
    background:rgba(243,246,249,.75);
    backdrop-filter:blur(14px);
    padding:60px;
    box-sizing:border-box;
    box-shadow:0 30px 80px rgba(11,11,51,.20);
    position:relative;
    z-index:10;
    transform:none;
}

.top-about-right{
    flex:1;
    margin-top:100px;
}

.top-about-right img{
    width:100%;
    display:block;
}

.about-en{
    font-size:6rem !important;
}

/* =========================
   ABOUT US ボタン
========================= */
.about-btn{
    display:table !important;

    margin-top:10px;
    margin-left:auto !important;
    margin-right:0 !important;

    padding:16px 32px;

    border:1px solid #0b0b33;
    background:#fff;

    color:#0b0b33 !important;
    text-decoration:none;
    letter-spacing:.15em;
    font-size:1.3rem;

    transition:.3s;
}

.about-btn:hover{
    background:#0b0b33;
    color:#fff !important;
}

/* =========================
   ABOUT US SP
========================= */
@media (max-width:768px){

    .top-about-section{
        display:block;
        padding:30px 20px 80px;
        margin-top:-170px;
        position:relative;
        z-index:30;
    }

    .top-about-left,
    .top-about-right{
        width:100%;
        margin:0;
        transform:none;
        backdrop-filter:none;
    }

    /* テキストエリア */
    .top-about-left{
        padding:0 0 20px;
        background:none !important;
        box-shadow:none !important;
    }

    /* 画像エリア */
    .top-about-right{
        margin-top:0;
        padding:0;
    }

    /* SP専用画像 */
    .top-about-right img{
        content:url("https://test.tkenzai.co.jp/wp-content/uploads/2026/06/top_about.png");
        width:100%;
        height:auto;
        display:block;
    }

    /* タイトル */
    .about-en{
        font-family:"Cormorant Garamond", serif;
        font-size:6rem !important;
        font-weight:500;
        line-height:0.9;
        letter-spacing:0.03em;
        color:#0b0b33;
        margin-bottom:15px;
    }

    /* サブコピー */
    .about-copy{
        font-size:18px !important;
        line-height:1.8;
        font-weight:600;
        color:#0b0b33;
        margin-bottom:20px;

        -webkit-text-size-adjust:100%;
        text-size-adjust:100%;
    }

    /* 本文 */
    .about-text{
        font-size:13px !important;
        line-height:2;
        color:#666;

        -webkit-text-size-adjust:100%;
        text-size-adjust:100%;
    }

}

/* =========================
   SCROLL
========================= */

.top-mv-scroll{
    position:absolute;
    left:90px;
    bottom:120px;
    z-index:999;
}

.top-mv-scroll span{
    writing-mode:vertical-rl;
    font-size:20px;
    letter-spacing:.15em;
    color:#0b0b33;
}

.top-mv-scroll-line{
    width:1px;
    height:100px;
    background:rgba(11,11,51,.2);
    overflow:hidden;
    margin-top:12px;
}

.top-mv-scroll-line div{
    width:100%;
    height:40px;
    background:#0b0b33;

    animation:topMvScrollDown 1.8s ease-in-out infinite !important;
}

@keyframes topMvScrollFloat{
    0%{ transform:translateY(0); }
    50%{ transform:translateY(8px); }
    100%{ transform:translateY(0); }
}

@keyframes topMvScrollDown{
    0%{ transform:translateY(-120%); }
    100%{ transform:translateY(260%); }
}

@media (max-width:767px){
    .top-mv-scroll{
        display:none !important;
    }
}

/* =========================
   SP HEADER
========================= */
@media (max-width:768px){

    /* ヘッダー高さ */
    #header{
        height:60px !important;
    }

    .h-inner{
        height:60px !important;
        min-height:60px !important;

        display:flex;
        align-items:center;
        justify-content:space-between;
    }

    /* ハンバーガーボタン */
    #btn-hamburger{
        display:flex !important;
        flex-direction:column;
        justify-content:center !important;
        align-items:center !important;

        width:56px !important;
        height:56px !important;

        padding:0 !important;
        margin:0 !important;
    }

    /* 3本線 */
    #btn-hamburger .border{
        width:30px !important;
        height:2px !important;

        margin:4px 0 !important;
}

}


/* =========================
   ABOUTUS BUTTONがMVに出るのを消す
========================= */
.top-mv-btn,
.top-mv-btn-box,
.top-mv-btn svg{
    display:none !important;
}

/* =========================
   LINKS CARD HOVER
========================= */

#top-links-list{
    background-color:#f5f5f5;
}

.top-links-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:60px;
}

/* カード */
.top-link-item{
    display:block;
    background:#fff;
    overflow:hidden;

    box-shadow:0 6px 24px rgba(0,0,0,0.05);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.top-link-item:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 40px rgba(11,11,51,0.16);
}

/* 画像 */
.top-link-img-box{
    position:relative;
    padding-top:90%;
    overflow:hidden;
}

.top-link-img-box img{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;

    transition:transform .45s ease;
}

.top-link-item:hover .top-link-img-box img{
    transform:scale(1.06);
}

/* テキスト */
.top-link-info{
    padding:24px;

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

    background:#fff;

    transition:background .35s ease;
}

/* =========================
   LINKS TITLE HOVER
========================= */

/* カード背景変更 */
.top-link-item:hover .top-link-info{
    background:#0b0b33;
}

/* タイトル */
.top-link-name{
    font-size:2rem;
    color:#0b0b33;
    position:relative;

    transition:
        color .35s ease,
        transform .35s ease;
}

/* 矢印（右側） */
.top-link-name::after{
    content:" →";
    opacity:0;

    transition:
        opacity .35s ease;
}

/* ホバー */
.top-link-item:hover .top-link-name{
    color:#fff;
    transform:translateX(15px);
}

.top-link-item:hover .top-link-name::after{
    opacity:1;
}

/* SP */
@media (max-width:768px){

    .top-links-grid{
        grid-template-columns:1fr !important;
        gap:20px !important;
    }

    .top-link-name::after{
        display:none;
    }

    .top-link-item:hover .top-link-name{
        transform:none;
    }

    .top-link-item:hover{
        transform:none;
    }

}