.title-text-button {
    display: block;
    position: relative;
    margin: 0.3rem 0;
}
    
.title-text-button .flex-container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        gap: 0.15rem;
    }
    
.title-text-button .left-shape {
        background-color: var(--color-3);
        width: 2.1rem;
        border-radius: 0.2rem;
        overflow: hidden;
    }
    
.title-text-button .right-shape {
        background-color: var(--color-3);
        overflow: hidden;
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 11.61rem;
        min-height: 6.5rem;
        border-radius: 0.2rem;
        color: var(--color-black);
        padding: 0.92rem 0 1.06rem 0;
        mask-image: url("../../assets/right-shape.svg");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-size: cover;
	}
    
:is(.title-text-button .right-shape) .content-wrap {
			max-width: 6.6rem;
			margin-left: 3.81rem;
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			align-items: flex-start;
			gap: 0.2rem;
		}
    
:is(:is(.title-text-button .right-shape) .content-wrap) .text {
				max-width: 5.41rem;
			}
    
:is(:is(.title-text-button .right-shape) .content-wrap) .main-button {
				margin-top: 0.1rem;
                min-width: 2.7rem;
			}
    
@media screen and (max-width: 768px) {
    
        .title-text-button .flex-container {
            flex-direction: column;
        }
    
        .title-text-button .left-shape {
            width: 100%;
            height: 1.2rem;
            border-radius: 0.1rem;
        }
    
        .title-text-button .right-shape {
            width: 100%;
            min-height: unset;
            border-radius: 0.1rem;
            padding: 1.33rem 0.15rem 0.15rem 0.15rem;
            mask-image: url("../../assets/shape-up.svg");
        }
    
            :is(.title-text-button .right-shape) .content-wrap {
                max-width: 100%;
                margin-left: unset;
            }
    
                :is(:is(.title-text-button .right-shape) .content-wrap) .text {
                    max-width: 100%;
                }

                :is(:is(.title-text-button .right-shape) .content-wrap) .button-wrap {
                    width: 100%;
                }
        
                    :is(:is(:is(.title-text-button .right-shape) .content-wrap) .button-wrap) .main-button {
                        width: 100%;
                    }
    }