@charset "UTF-8";
/* CSS Document */

.art-linea{	
position: relative;	
width: calc(100% - 40px);
height: auto;	
overflow-x: auto;	
margin: 50px 0px 0px 0px;
}

.art-linea > .elem:first-of-type{	
position: absolute;
top: 50%;
left: 0%;
-moz-transform: translateX(0%) translateY(-50%);
-webkit-transform: translateX(0%) translateY(-50%);
transform: translateX(0%) translateY(-50%);
width: 20px;
height: calc(100% - 70px);
border-left: 0.5px solid var(--base-a-3-100);	
opacity: 0.5;	
}
.art-linea > .elem:last-of-type{	
position: absolute;
top: 50%;
right: 0%;
-moz-transform: translateX(0%) translateY(-50%);
-webkit-transform: translateX(0%) translateY(-50%);
transform: translateX(0%) translateY(-50%);
width: 20px;
height: calc(100% - 70px);
border-right: 0.5px solid var(--base-a-3-100);
opacity: 0.5;	
}

/*3.5.1--línea de tiempo custom*/
.grp-hitos{
width: auto;	
height: calc(100% - 5px);
overflow: auto;	
scroll-behavior: smooth;	
padding: 70px 0px 70px 0px;	
}
.grp-hitos::-webkit-scrollbar {
width: 10px;
height: 10px;	
background-color: var(--trans);
cursor: pointer !important;
}
.grp-hitos::-webkit-scrollbar-thumb {
background-color: var(--base-a-5-100);
border: 0.5px solid var(--base-a-2-100);
border-radius: var(--border-r-sm);	
cursor: pointer !important;
}
.grp-hitos::-webkit-scrollbar-track {
background-color: var(--trans);
cursor: pointer !important;
}
.grp-hitos > div:first-of-type{
flex: 0 0 50px;	
width: 50px;	
height: 100%;
margin: 0px;	
}
.grp-hitos > div:last-of-type{	
flex: 0 0 50px;	
width: 50px;	
height: 100%;
margin: 0px;		
}
.grp-hitos .hito{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: flex-start;
-ms-flex-align: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
justify-content: flex-start;	
flex: 1;
flex-direction: column;	
max-width: 33%;
min-width: 400px;		
height: 100%;
margin: 0px 10px 0px 10px;	
padding: 10px;	
}
.grp-hitos .hito .num{	
border-radius: var(--border-r-sm);
margin-bottom: 4px;		
padding: 9px 10px 2px 10px;	
}
.grp-hitos .hito .subtit{
border-radius: var(--border-r-sm);
margin-bottom: 4px;		
padding: 14px 17px 9px 17px;	
}
.grp-hitos .hito .img{	
width: 100%;
flex: 0 0 35%;
border-radius: var(--border-r-base);	
overflow: hidden;	
margin-bottom: 4px;	
}
.grp-hitos .hito .img img{	
object-fit: cover;
}
.grp-hitos .hito .txt{
overflow: auto;	
border-radius: var(--border-r-sm);	
padding: 15px 17px 15px 17px;	
}

/*3.5.2--línea de tiempo swiper*/
.art-linea--swiper-container > .frm{
position: absolute;
top: 0px;	
width: 120px;
height: 100%;
z-index: 2;
background-repeat: no-repeat;
background-size: cover;	
}
.art-linea--swiper-container > .frm:nth-last-of-type(2){
left: 0px;
background-image: url("../../../imagenes/globales-oafcds-v5/fondos/base/forma-sombra-left-base-6.png");
background-position: right center;	
}
.art-linea--swiper-container > .frm:nth-last-of-type(1){
right: 0px;
background-image: url("../../../imagenes/globales-oafcds-v5/fondos/base/forma-sombra-right-base-6.png");
background-position: left center;
}
.art-linea--swiper-container > .elem:first-of-type{
position: absolute;
left: 0px;
top: 55px;
width: 100%;
height: 1px;	
}
.art-linea--swiper-container .swiper-wrapper{
padding-bottom: 50px;	
}

.art-linea--swiper-container .swiper-slide{
position: relative;
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: stretch;
flex-direction: column;
height: 70vh;	
max-height: 700px;
padding: 0px 0px 0px 0px;	
}

.art-linea--hito{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: stretch;
flex-direction: column;
width: 100%;
height: 100%;
}
.art-linea--hito-fecha{
position: relative;
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: column;
flex: none;
border-radius: var(--border-r-sm);
margin-bottom: 4px;
padding: 8px 10px 2px 10px;	
}
.art-linea--hito-fecha h5{
font-family: var(--fuente-principal);
text-rendering: optimizeLegibility;
font-size: var(--font-size-xl);
line-height: var(--line-height-xl);
font-weight: 50;
font-variation-settings: "wght" 250;
}
.art-linea--hito-fecha > .elem{
position: absolute;	
top: 50px;
left: 50%;
-moz-transform: translateX(-50%) translateY(0%);
-webkit-transform: translateX(-50%) translateY(0%);
transform: translateX(-50%) translateY(0%);		
width: 10px;
height: 10px;
border-radius: var(--border-r-100p);
}
.art-linea--hito-descrip{	
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;	
flex-direction: column;
position: relative;	
height: 50%;
width: 100%;
flex: 1;
padding: 20px 0px 0px 0px;
}

.art-linea--hito-descrip > div:not(.img){
max-width: 700px;
}
.art-linea--hito-descrip .img{
flex: 0 0 90%;	
position: relative;
width: 100%;	
border-radius: var(--border-r-base);	
border: 0.5px solid var(--base-a-3-100);	
overflow: hidden;
}
.art-linea--hito-descrip .img img{
border-radius: var(--border-r-base);	
object-fit: cover;
}
.art-linea--hito-descrip-grp{
position: absolute;
bottom: 0%;
left: 50%;
-moz-transform: translateX(-50%) translateY(0%);
-webkit-transform: translateX(-50%) translateY(0%);
transform: translateX(-50%) translateY(0%);
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: flex-start;
-ms-flex-align: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
justify-content: center;	
flex-direction: column;	
width: calc(100% - 30px);	
overflow: auto;
border-radius: var(--border-r-base);
z-index: 2;	
margin: -60px 0px 0px 0px;
padding: 4px;	
}
.art-linea--hito-descrip-grp .subtit{
flex: 0;
background-color: var(--bn-100);
border-radius: var(--border-r-sm);
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);	
margin-bottom: 2px;
padding: 2px;	
}
.art-linea--hito-descrip-grp .subtit > *{
border-radius: var(--border-r-sm);	
padding: 6px 13px 5px 13px;	
}
.art-linea--hito-descrip-grp .subtit h6{
font-family: var(--fuente-subtit);
text-rendering: optimizeLegibility;
font-size: var(--font-size-md);
line-height: var(--line-height-md);
font-weight: 500;
font-variation-settings: "wght" 700;
margin-bottom: 0px;
}
.art-linea--hito-descrip-grp .txt{
flex: 1;
background-color: var(--bn-100);
border-radius: var(--border-r-base);
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
margin-bottom: 4px;
padding: 2px;	
}
.art-linea--hito-descrip-grp .txt > *{
border-radius: var(--border-r-sm);	
padding: 10px 17px 10px 17px;	
}
.art-linea--hito-descrip-grp .txt p{
font-family: var(--fuente-parrafo);
text-rendering: optimizeLegibility;
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
font-weight: 400;
font-variation-settings: "wght" 700;
color: var(--base-a-1-100);
margin-bottom: 0px;
}
.art-linea--hito-descrip .subtit{
margin-bottom: 10px;		
}
.art-linea--hito-descrip .subtit h6{
font-family: var(--fuente-subtit);
text-rendering: optimizeLegibility;
font-size: var(--font-size-md);
line-height: var(--line-height-md);
font-weight: 500;
font-variation-settings: "wght" 700;
}
.art-linea--hito-descrip .txt p{
font-family: var(--fuente-parrafo);
text-rendering: optimizeLegibility;
font-size: var(--font-size-sm);
line-height: var(--line-height-xs);
font-weight: 400;
font-variation-settings: "wght" 700;
color: var(--base-a-1-100);
margin-bottom: 0px;
}


/*hito column*/
.art-linea--hito-descrip-col{	
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;	
flex-direction: row;
}
.art-linea--hito-descrip-col .img {
flex: none;
width: auto;	
height: 100%;
}
.art-linea--hito-descrip-col .img img{	
object-fit: contain;
}
.art-linea--hito-descrip-col .art-linea--hito-descrip-grp {	
position: relative;
bottom: auto;
left: auto;
-moz-transform: none;
-webkit-transform: none;
transform: none;	
width: 50%;		
margin: 0px 0px 0px -30px;	
}



.art-linea--swiper-container-grp-pag-buttons{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: row;  
position: relative;
width: calc(100% - 80px);
margin: 0 auto;  
}
.art-linea--swiper-container-grp-pag-buttons .elem{
position: absolute;
top: 50%;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
width: 100%;
height: 1px;
background-color: var(--base-a-3-100);	
}
.art-linea--swiper-container .swiper-pagination {
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap; 
flex: 1;  
position: relative;		
height: auto;
bottom: auto !important;  
overflow: auto;		
}
.art-linea--swiper-container .swiper-pagination-bullet{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: row;	
position: relative;	
flex: none;
opacity: 1.0;	
margin: 0px 4px 0px 4px !important;  
}
.art-linea--swiper-container .swiper-pagination-bullet-active {
opacity: 1.0;
background-color: var(--base-a-2-100);
pointer-events: none;  
}
.art-linea--swiper-container .swiper-button-next,
.art-linea--swiper-container .swiper-button-prev
{	
z-index: 11;
color: var(--trans);	
}
.art-linea--swiper-container-grp-pag-swiper-button{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: row;
position: relative;
}

.art-linea--swiper-container .swiper-button-next,
.art-linea--swiper-container .swiper-button-prev{
position: relative;
left: auto !important;	
bottom: auto !important;
margin: 0px 2px 0px 2px !important;
}


/*3.4.6--botones línea tiempo*/
.art-linea > .grp{
position: absolute;
bottom: -15px;
left: 50%;
-moz-transform: translateX(-50%) translateY(0%);
-webkit-transform: translateX(-50%) translateY(0%);
transform: translateX(-50%) translateY(0%);	
z-index: 2;  
}
.art-linea > .grp .btn{	
margin: 0px 10px 0px 10px;	
}
.art-linea > .grp .btn{	
flex: 0 0 30px;	
width: 30px;
height: 30px;
background-color: var(--base-a-1-100);	
}


/*swiper con botón navigation con texto en lugar de bullet*/ 
.art-swiper-nav-btn-txt{
position: relative;
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: stretch;
-ms-flex-align: stretch;
-webkit-align-items: stretch;
align-items: stretch;
justify-content: center;
flex-direction: row;
width: 100%; 
height: auto;
overflow-x: auto;   
margin: 0px;  
}
.art-swiper-nav-btn-txt .swiper-container{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: stretch;
-ms-flex-align: stretch;
-webkit-align-items: stretch;
align-items: stretch;
justify-content: center;
flex-direction: column; 
}
.art-swiper-nav-btn-txt .swiper-wrapper{
padding: 10px 0px 10px 0px;  
}
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-slide{
height: auto;
opacity: 0 !important;  
}
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-slide.swiper-slide-prev,
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-slide.swiper-slide-next{
opacity: 0 !important;  
}
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-slide.swiper-slide-active{
opacity: 1 !important;  
}


.art-swiper-nav-btn-txt .art-linea--hito-descrip {
padding: 0px 40px 0px 40px;  
}
.art-swiper-nav-btn-txt .art-linea--hito-descrip ul{
list-style-type: none; 
}
.art-swiper-nav-btn-txt .art-linea--hito-descrip ul li{
margin-bottom: 7px;  
}
.art-swiper-nav-btn-txt .art-linea--hito-descrip ul li p{
text-align: center;
padding: 0px 0px 0px 10px;  
}
.art-swiper-nav-btn-txt .art-linea--hito-descrip ul li p::before {
content: '';
position: absolute;  
width: 8px;
height: 8px;
background-image: url("../../../imagenes/globales-oafcds-v5/iconos/nav/base/b/2/sprite-nav-base-b-2-bold-v3.png");
background-repeat: no-repeat;
background-size: auto 300%;
background-position: 40% 100%;
opacity: 0.6;  
margin: 5px 0px 0px -12px;
}


.art-swiper-nav-btn-txt .art-linea--swiper-container-grp-pag-buttons {
width: 100%; 
}
.art-linea--swiper-container-grp-pag-buttons .swiper-pagination{
gap: 4px 4px; 
}
.art-swiper-nav-btn-txt .swiper-pagination-bullet{
width: auto;
height: auto;
border-radius: var(--border-r-sm);
background-color: var(--base-a-5-100);
  
font-family: var(--fuente-secundaria);
text-rendering: optimizeLegibility;
font-size: var(--font-size-xs);
line-height: calc(var(--line-height-xs) - 4px);
font-weight: 500;
font-variation-settings: "wght" 600;
color: var(--base-a-1-100);

margin: 0px !important; 
padding: 5px;  
}
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-pagination-bullet {
background-color: var(--base-a-5-100);
}
.art-swiper-nav-btn-txt .art-linea--swiper-container .swiper-pagination-bullet:hover {	
background-color: var(--base-a-4-100);
}

.art-swiper-nav-btn-txt .swiper-button-prev,
.art-swiper-nav-btn-txt .swiper-button-next{
position: absolute;
top: 50%;
-moz-transform: translateX(0%) translateY(-50%);
-webkit-transform: translateX(0%) translateY(-50%);
transform: translateX(0%) translateY(-50%); 
}
.art-swiper-nav-btn-txt .swiper-button-prev{
left: 0%; 
}
.art-swiper-nav-btn-txt .swiper-button-next{
right: 0%;   
}

/*----TRANSICIONES*/
.art-linea--swiper-container .swiper-pagination-bullet {	
background-color: var(--base-a-3-100);	
}
.art-linea--swiper-container .swiper-pagination-bullet:hover {	
background-color: var(--base-a-1-100);
}

.art-linea--swiper-container .swiper-button-next, 
.art-linea--swiper-container .swiper-button-prev 
{	
background-color: var(--base-a-2-100);
}
.art-linea--swiper-container .swiper-button-next:hover, 
.art-linea--swiper-container .swiper-button-prev:hover 
{	
background-color: var(--base-a-0-100);
}

.art-swiper-nav-btn-txt .swiper-button-prev,
.art-swiper-nav-btn-txt .swiper-button-next{
background-color: var(--trans);  
}
.art-swiper-nav-btn-txt .swiper-button-prev:hover,
.art-swiper-nav-btn-txt .swiper-button-next:hover{
background-color: var(--base-a-0-10); 
}


/*5.----MEDIA QUERIES*/
@media screen and (max-width:1280px){	
.art-linea--swiper-container .swiper-pagination-bullet {	
background-color: var(--base-a-3-100);	
}
.art-linea--swiper-container .swiper-pagination-bullet:hover {	
background-color: var(--base-a-3-100);
}	
.art-linea--swiper-container .swiper-button-next, 
.art-linea--swiper-container .swiper-button-prev 
{	
background-color: var(--base-a-2-100);
}
.art-linea--swiper-container .swiper-button-next:hover, 
.art-linea--swiper-container .swiper-button-prev:hover {	
background-color: var(--base-a-2-100);
}	
  
.art-swiper-nav-btn-txt .swiper-button-prev,
.art-swiper-nav-btn-txt .swiper-button-next{
background-color: var(--trans) !important;  
}  
.art-swiper-nav-btn-txt .swiper-button-prev:hover,
.art-swiper-nav-btn-txt .swiper-button-next:hover{
background-color: var(--trans) !important;  
}   
}

/*@media screen and (orientation:portrait){*/
@media screen and (max-width:851px){	
/*línea de tiempo*/
.art-linea {
width: calc(100% - 40px);
}	
.art-linea--swiper-container { 
width: calc(100% - 0px);  
}	
.art-linea--swiper-container .swiper-wrapper {
padding-bottom: 10px;  
}	
.art-linea--swiper-container .swiper-slide {
padding: 0px 40px 0px 40px;
}  
.art-linea--swiper-container-grp-pag-buttons {
width: calc(100% - 0px);
}	
.art-linea--swiper-container .swiper-pagination-bullet{	
margin: 0px 3px 0px 3px !important;			
}  
  
/*swiper dentro de art-grid-blq--tabla*/ 
/*.art-grid-blq--tabla-cajas .art-linea{
width: 100%;
}*/  
}	

@media screen and (max-width:677px){
.art-linea--swiper-container > .frm {
display: none;
}
.art-linea--swiper-container .swiper-slide {
padding: 0px 10px 0px 10px;
}	
.art-linea--swiper-container-grp-pag-buttons .elem{
display: none;	
}  
}
