Why flex columns have not the same height in Safari, but Chome is well?

Question

I have 2 cols inside the flex wrapper. This cols have display:flex also. Inside column the div with minh100vh and h100%. When I test this code in Chrome, Firefox and even IE, I see the columns with the same height and inner div streched for all column's height. But when I open Safari in Mac or Ipad, this structure breaks down, because my columns have only min height 100vh.

link:example link

img:

    body {
       height: 100%;
       ...
    }    
    .container {
        display: flex;
        min-height: 100vh;
        height: 100%;
        ...
    }
    .col {
        display: flex;
        min-height: 100vh;
        ...
    }

    div {
        min-height: 100vh;
        height: 100%;
        ...
    }