Ho elaborato questo, l'ho provato e funziona bene, ovvio che poi con le larghezze devi giocare un po'. Dalla tua spiegazione non ho capito come volevi posizionare i quattro div, io li ho messi 2 sopra (quelli fissi) affiancati e 2 sotto (quelli ad altezza mobile) sempre affiancati. Prova e fammi sapere.

codice:
        #fisso1, #fisso2, #mobile1, #mobile2
        {
            position : absolute;
        }
    
        #fisso1, #fisso2
        {
            height : 15em;
            top : 0;
        }
    
        #fisso1
        {
            left : 0;
            width : 31em;
            border : 1px solid red;
        }
        
        #fisso2
        {
            right : 0;
            left : 31.5em;
            border : 1px solid black;
        }
        
        #mobile1, #mobile2
        {
            top : 15.5em;
            bottom : 0;
        }
        
        #mobile1
        {
            left : 0;
            width : 31em;
            border : 1px dotted red;
        }
        
        #mobile2
        {
            right : 0;
            left : 31.5em;
            border : 1px dotted black;
        }
e l'HTML semplicissimo

codice:
        <div id="fisso1"></div>
        <div id="fisso2"></div>
        <div id="mobile1"></div>
        <div id="mobile2"></div>
Come puoi notare, il contenitore non c'è in quanto non serve.

Ciao