@charset "utf-8";



/********************
// tablet 분기점
********************/
@media only screen and (max-width: 1200px) {
   
    .inner{width:calc(100% - 120px); margin:0 auto;}


    .stepBox {        grid-template-columns: repeat(6, 1fr);    }
    .stepBox > div {        grid-column: span 2;     }
    .stepBox > div:nth-child(4) {        grid-column-start: 2;         grid-column-end: span 2;    }
    
    .chat_bubble::after {    content: '';    position: absolute;    left: -8px;      top: 10px;  }
    .chat_bubbleR::before{    content: '';    position: absolute;    right: -8px;      top: 10px;   }
    .portalLifeLeft{border-radius: 12px 0 0 12px; }
    .inputBox{ padding: 20px;}

}      




/********************
// 모바일 분기점
********************/
@media only screen and (max-width: 768px) {     
    .inner{width:calc(100% - 40px); margin:0 auto;}  
    .portalLifeLeft{border-radius: 8px 0 0 8px; }
    .stepPoint {    left: 50%;     top: -25px; animation: bounce 2s infinite ease-in-out;}
    @keyframes bounce {
        0% {
            transform: translate(-50%, 0);
        }
        50% {
            transform: translate(-50%, -5px);
        }
        100% {
            transform: translate(-50%, 0);
        }
    }
    .inputBox{ padding: 16px;}
   
}