.cont-mail{
    background: #fff;
    display: flex;
    padding: 3.2rem 0;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.mail{
    display: flex;
    gap: 5rem;
}
.mail-detail{
    margin-top: -4rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 35%;
}

.list-info{
    margin-left: 1rem;
}
.form{
    width: 65%;
}
.form form{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1rem;
}

.form .fr-1{ grid-column: 1 / 3; grid-row: 1;}
.form .fr-2{ grid-column: 3 / 5; grid-row: 1;}
.form .fr-4{ grid-column: 1 / 3; grid-row: 2;}
.form .fr-3{ grid-column: 3 / 5; grid-row: 2;}
.form .fr-5{ grid-column: 1 / 5; grid-row: 3;}
.form .fr-6{ grid-column: 4 / 5; grid-row: 4;}

.form input, .form textarea, .form button{
    width: 100%;
    margin: 0;
    padding: 0;
}
.form label{
    color: #827D7D;
    font-weight: bolder;
    font-size: .8rem;
}
.form input, .form textarea{
    padding: 0 1rem;
    margin-top: .5rem;
    background: #F3F4F8;
    border: none;
    height: 3rem;
}
.form textarea{
    padding: 1rem;
    height: 10rem;
    resize: vertical;
}
.form input:focus, .form textarea:focus{
    border-radius: .2rem;
    outline: 1px solid var(--btn-on);
}

.form button{
    cursor: pointer;
    background: var(--btn-on);
    color: #fff;
    height: 2.5rem;
    font-weight: bolder;
    border: none;
}

.form button:hover{
    background: #F39100;
}
.mail-detail h2{
    margin-bottom: 1rem;
    font-size: 2.5rem;
    color: var(--principal-title);
    line-height: 2.4rem;
    font-weight: 900;
}
.cont-ico{
    width: 16px;
    height: 16px;
}
.mail-detail p{
    text-align: justify;
    font-size: .9rem;
    color: var(--sentence);
}
.mail-detail ul img{
    width: 100%;
    object-fit: contain;
}
.maps {
    position: relative;
    height: 32rem;
}
.shadow{
    width: 100%;
    z-index: 1;
    position: absolute;
    border:1px solid #fff;
    box-shadow: 0px 2px 2px #b0aeae;
}
iframe{
    width: 100%!important;
    height: 32rem!important;
    position: absolute;
    z-index: 0;
}

.message{
    z-index: 99;
    top: 90px;
    right: 1rem;
    position: fixed;
    align-items: center;
    font-size: .8rem;
    font-weight: 700;
    padding: .5rem 1.4rem;
    border-radius: .4rem;
    color: #fff;
    display: none;
}
.message .prf{
    text-align: justify;
}

.warning{
    display: flex;
    color: #d29f0a;
    border: 1px solid #ffecb5;
    background: #fff3cd;
}
.send{
    display: flex;
    color: #71b66c;
    border: 1px solid #7fbb7a;
    background: #e1f8de;
}

.btn{
    cursor: pointer;
    right: 0;
    padding-left: 1rem;
    font-size: 1.3rem;
}