.div-index { width: 100%; aspect-ratio: 16/6.3; background-image: url(../resource/index_background.jpg); background-size: cover; min-height: 600px; }
.div-main-text { width: 98%; margin: auto; max-width: 700px; position: relative; top:50%; transform: translateY(-50%); font-size: 2rem !important; color: #ffffff;font-weight: bold; }


.div-sectcion { width: 98%; margin: auto; max-width: 1380px; margin-top: 60px;margin-bottom: 60px;}
.more-link { width: 120px; background-color: #ED6C00; color: #ffffff; font-weight: bold; cursor: pointer;}
.more-link:hover{ background-color: #c86a19;}
.more-link2 { width: 120px; background-color: #ED6C00; color: #ffffff; font-weight: bold; cursor: pointer; margin: auto;}
.more-link2:hover{ background-color: #c86a19;}
.more-link3 { width: 120px; background-color: transparent; color: #ffffff; font-weight: bold; cursor: pointer; border:1px solid #ffffff}
.more-link3:hover{ background-color: #ffffff;color: #ED6C00;}

.index_icon { width: 50%; max-width: 80px;}
.index-icon-text { font-weight: bold; font-size: 1.3rem;}
.index-icon-caption { font-weight: bold; font-size: 1.3rem;}
.index-contact { background-image: url(../resource/contac_background3.jpg); background-size: cover; width: 100%; max-width: 1380px; margin: auto; background-position: top;}



@media screen and (max-width: 880px) {
    .index-icon-text { font-size: 0.98rem;}
    .div-index { width: 100%; aspect-ratio:1/1; background-image: url(../resource/index_background.jpg); background-size: cover; background-position: right; min-height: auto; }
    .div-main-text { width: 90%; margin: auto; position: relative; top:50%; transform: translateY(-50%); font-size: 2rem !important; color: #ffffff;font-weight: bold; }
}