.container {width:100%; height:auto; margin:0 auto; padding:0 24px;}

main {
    width:100%; 
    height:calc(80vh - 150px); 
    /* position:relative; */
}

.my p {font-family: serif; font-weight:200; font-size:15px;}

.my p:nth-child(2) {margin-bottom:200px;}

.my span {font-size:14px; display:block; width:60%; margin:0 auto;}

.my {text-align:center; position:absolute; top:40%; bottom:50%; left:50%; transform:translate(-50%, 50%);}


.search {display:none;}

@media all and (max-width:1223px) {
    .my {width:100%;}

    .my span {width:90%;}

    .my p:nth-child(2) {margin-bottom:110px;}
}

@media all and (max-width:939px) {
    /* .hide ul {margin-top:0;} */
    .hide ul {margin-top:12px;}

    /* main {position:static;} */

    footer span {display:none;}

    main {
        width:100%; 
        height:calc(90vh - 150px); 
        /* position:relative; */
    }

    .my p:nth-child(2) {margin-bottom:110px;}
}

@media all and (max-width:640px) {
    .my {bottom:0; top:55%; transform:translate(-50%, -15%);}
}

@media all and (max-width:589px) {
    .container {padding:0 12px;}
}