/* ============================================================
   responsive.css
   フェードインアニメーション + レスポンシブメディアクエリ (タブレット/スマホ)
   2026-05-21 リファクタで style.css から分離
   ============================================================ */

/* ========================================
   フェードインアニメーション
   ======================================== */
.rc-fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.rc-fade-in.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.rc-slide-right {
    opacity: 0;
    transform: translateX(60px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.rc-slide-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* ========================================
   レスポンシブ（タブレット）
   ======================================== */
@media (max-width: 1024px) {
    

    .rc-nav-open .rc-header-nav {
        display: flex;
    }

    

    .rc-header-nav-link {
        flex-direction: row;
        gap: 12px;
        padding: 14px 0;
        border-bottom: 1px solid var(--rc-border);
        color: var(--rc-text);
    }

    

    

    .rc-header-nav-link::after {
        display: none;
    }

    .rc-header-dropdown {
        width: 100%;
    }

    .rc-nav-open .rc-header-hamburger span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    .rc-nav-open .rc-header-hamburger span:nth-child(2) {
        opacity: 0;
    }
    .rc-nav-open .rc-header-hamburger span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }

    .rc-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* === タブレット以下（1024px）共通: スマホUIに統一 === */

    /* スマホ用ヘッダーバッジ表示（出稼ぎ・地元） */
    
    
    

    /* 右側ボタン群（出稼ぎ・地元・応募する）非表示 → ハンバーガー内に統合 */
    

    /* ドロップダウン（お店を知る）をタップで開閉できるアコーディオンに */
    
    .rc-header-dropdown.is-open .rc-dropdown-menu {
        max-height: 400px;
    }
    .rc-dropdown-item {
        padding: 12px 20px 12px 32px;
        border-bottom: 1px solid var(--rc-border);
        font-size: 13px;
    }

    /* ハンバーガー内の「応募する」リンクを目立たせる（深紅背景） */
    
    

    /* 下部固定バー（電話・LINE・フォーム・ブログ）を表示 */
    
    .rc-footer {
        padding-bottom: 70px;  /* 固定バー分の余白 */
    }
}

/* ========================================
   PC のみ「応募する」ハンバーガー項目を非表示（PCは右側ボタンに「応募する」あり） */

/* ========================================
   レスポンシブ（スマホ）
   ======================================== */
@media (max-width: 768px) {
    /* スマホ用ヘッダーバッジ */
    

    

    

    /* ナビ */
    

    .rc-nav-open .rc-header-nav {
        display: flex;
    }

    .rc-header-nav-link {
        flex-direction: row;
        gap: 12px;
        padding: 14px 0;
        border-bottom: 1px solid var(--rc-border);
        color: var(--rc-text);
    }

    

    

    .rc-header-nav-link::after {
        display: none;
    }

    /* スマホ用ドロップダウン */
    .rc-header-dropdown {
        width: 100%;
    }

    

    .rc-header-dropdown.is-open .rc-dropdown-menu {
        max-height: 400px;
    }

    .rc-dropdown-item {
        padding: 12px 20px 12px 32px;
        border-bottom: 1px solid var(--rc-border);
        font-size: 13px;
    }

    

    .rc-nav-open .rc-header-hamburger span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    .rc-nav-open .rc-header-hamburger span:nth-child(2) {
        opacity: 0;
    }
    .rc-nav-open .rc-header-hamburger span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }

    /* ヒーロー */
    

    

    

    

    .rc-hero-btns .rc-btn {
        text-align: center;
    }

    

    /* セクション */
    .rc-section {
        padding: 60px 0;
    }

    .rc-section-label {
        font-size: 32px;
    }

    .rc-section-title {
        font-size: 13px;
    }

    /* ブロックセクション */
    

    

    .rc-block-text {
        max-width: 100%;
    }

    

    

    

    /* お給料 */
    
    

    .rc-simulator {
        padding: 24px 20px;
    }

    /* 待遇 */
    .rc-benefits-grid {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    

    /* 出稼ぎ・地元 */
    

    .rc-target-card {
        min-height: 400px;
    }

    /* 1日の流れ */
    

    

    

    

    /* 先輩の声 */
    

    .rc-voices-nav-prev,
    .rc-voices-nav-next {
        display: none;
    }

    /* 応募 */
    .rc-entry-grid {
        grid-template-columns: 1fr;
    }

    .rc-entry-form-wrap {
        padding: 24px 20px;
    }

    /* フッター */
    

    

    

    

    .rc-footer-sp {
        display: block;
        padding: 0 0 16px;
    }

    .rc-footer-dark {
        padding: 0;
    }

    .rc-footer {
        padding-bottom: 70px;
    }

    /* 固定バー表示 */
    
}