/* mobile_calculator.css */

/* 모바일 환경에서 스타일 적용 */
@media screen and (max-width: 1000px) {
    .container {
        flex-direction: column; /* display:flex 유지 + 방향 변경 */
        align-items: center;
        padding: 0 20px;
        gap: 30px;
    }    

    /* 타이틀 보이도록 추가 스타일 */
    .right-top-container-title {
        display: block !important; /* 확실히 보이도록 설정 */
        font-size: 14px; /* 모바일에서 가독성 향상 */
        padding: 8px 0;
    }

    .left-container {
        width: 100%;
        height: 300px !important;
    }

    .right-container {
        width: 100%;
        max-width: 340px; /* 모바일에서 적절한 너비 유지 */
    }
}

/* 모바일 환경에서 스타일 적용 */
@media screen and (max-width: 991px) {
    .gif-width {
        max-width: 140px;
    }
    .gif-title-font {
        font-size: 14px;
    }
    .gif-content-font {
        font-size: 14px;
    }
    .responsive-font {
        font-size: 13px;
    }
}

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

    .calculator-height {
        height: auto !important;
    }    

    .inno-title {
        margin-bottom: 60px;
    }

    .cal-right-bottom-text {
        margin-top: 60px;        
    }
    .responsive-font {
        font-size: 16px;
    }   
}

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

    .gif-title-font {
        font-size: 14px;
    }
    .gif-content-font {
        font-size: 14px;
    }
   
}

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

    .gif-title-font {
        font-size: 12px;
    }
    .gif-content-font {
        font-size: 12px;
    }
    .responsive-font {
        font-size: 13px;
    }
   
}