/* === 折り畳みメニュー完全修正 CSS === */

/* 折り畳みセクション画像の見切れ問題を修正 */
.section-content {
    overflow: hidden !important;
    max-height: 0 !important;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 0 !important;
}

.section-content.active {
    max-height: 2000px !important;
    overflow: visible !important;
    transition: max-height 0.8s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 32px !important;
}

/* 画像コンテナの適切な制約 */
.service-icon,
.ai-icon,
.company-image,
.recruitment-icon {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.service-icon img,
.ai-icon img,
.company-image img,
.recruitment-icon img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* AI技術セクションの並列画像の修正 */
.ai-icon {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 32px !important;
    margin: 40px auto 32px auto !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

.ai-icon img {
    width: 45% !important;
    max-width: 45% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* サービス画像の制約強化 */
.service-icon img {
    width: 120px !important;
    max-width: 90vw !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    border: 1px solid #DFD7C0 !important;
    background: #F3F1E9 !important;
}

/* 採用情報アイコンの制約 */
.recruitment-icon {
    width: 120px !important;
    max-width: 90vw !important;
    height: auto !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.recruitment-icon img {
    width: 100% !important;
    height: auto !important;
    max-width: 120px !important;
    display: block !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}

/* 会社画像の制約強化 */
.company-image {
    width: 100% !important;
    max-width: 350px !important;
    height: auto !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    border-radius: 8px !important;
}

.company-image img {
    width: 100% !important;
    height: auto !important;
    max-width: 350px !important;
    display: block !important;
    margin: 0 auto !important;
    border-radius: 8px !important;
    object-fit: contain !important;
}

/* 完全な折り畳み動作の確保 */
.collapsible-header {
    cursor: pointer !important;
    user-select: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.collapse-icon {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.collapsible-header.active .collapse-icon {
    transform: translateY(-50%) rotate(180deg) !important;
}

/* セクション全体の境界制御 */
.section-wrapper {
    overflow: hidden !important;
    border-radius: 20px !important;
}

/* モバイルデザインでの画像制約追加 */
@media (max-width: 768px) {
    .service-icon img {
        max-width: 85vw !important;
        width: auto !important;
    }
    
    .ai-icon {
        flex-direction: column !important;
        gap: 20px !important;
    }
    
    .ai-icon img {
        width: 80% !important;
        max-width: 80% !important;
    }
    
    .company-image {
        max-width: 85vw !important;
    }
    
    .company-image img {
        max-width: 85vw !important;
    }
    
    .recruitment-icon {
        max-width: 85vw !important;
    }
    
    .recruitment-icon img {
        max-width: 85vw !important;
    }
}

/* 追加の安全策：すべての画像要素 */
.section-content img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* flex要素の溢れ防止 */
.section-content .ai-icon,
.section-content .recruitment-content,
.section-content .company-content {
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}