/* 공통 ================================================================================== */
.ginfo_top .flexbox {
    position: relative;
    display: flex;
}
.ginfo_top .flexbox figure.img01,
.ginfo_top .flexbox figure.img02 {
    margin-top: 10px;
    padding: 10px 10px 0 0;
    border-top: 1px solid rgb(75, 123, 236, 0.5);
}
.ginfo_top .flexbox figure.img01 {
    width: 95px;
}
.ginfo_top .flexbox figure.img01 img {
    max-width: 85px;
    min-height: 95px;
}
.ginfo_top .flexbox figure.img02 {
    width: 310px;
}
.ginfo_top .flexbox figure.img02 img {
    width: 300px;
    min-height: 95px;
    height: 150px;
}
.ginfo_top .wrap {
    width: 100%;
}
.ginfo_top .wrap2 dl {
    width: 100%;
}

#guava_win_wrap .txtbox {
    padding: 15px 20px;
    letter-spacing: -1px;
    background: rgb(225, 225, 225, 0.5);
    border-radius: 5px;
    transition: all 0.3s ease;
    margin-bottom: 20px;
}
#guava_win_wrap .txtbox .tit {
    position: relative;
    letter-spacing: -1px;
    padding: 0 0 15px 0;
    margin: 0 0 15px 0;
    color: #444;
    font-weight: 700;
    font-size: 1.1em;
    border-bottom: 1px dashed #ddd;
}
#guava_win_wrap .txtbox .tit span {
    position: relative;
    display: inline-block;
    color: #427ee2;
    font-size: 0.9em;
    margin-left: 5px;
}

#guava_win_wrap .txtbox ul {
    position: relative;
    display: grid;
    grid-template-columns: repeat(attr(data-col, 4), 1fr);
    gap: 10px 15px;
}
#guava_win_wrap .txtbox ul.col5 {
    grid-template-columns: repeat(attr(data-col, 5), 1fr);
}
#guava_win_wrap .txtbox ul li a {
    position: relative;
    text-align: left;
    font-weight: 700;
    color: #333;
    font-size: 0.95em;
}
#guava_win_wrap .txtbox ul li a span {
    position: relative;
    display: inline-block;
    padding: 0 0 0 10px;
    color: #ff6600;
    font-size: 1.3em;
    font-family: "S-CoreDream-8Heavy";
}

.gtable tbody tr td i {
    color: #427ee2;
}

/* 연구자 리스트 ================================================================================== */
.researcher_list_wrap                            { position:relative; display: grid; grid-template-columns: repeat(4, 1fr);gap:1.5em 1.2em ;} 
.researcher_list_wrap li                         { position: relative; border: 1px solid #cfcfcf; border-radius:0.7em;  overflow:hidden;  transition:var(--transition1); } 
.researcher_list_wrap li figure                {   aspect-ratio:3/3;   overflow:hidden;   margin:1em;border-radius:0.4em;  overflow:hidden;  }
.researcher_list_wrap li figure img         { width: 100%; height: 100%; object-fit: cover; } 
.researcher_list_wrap li .cont                 { position: relative;    padding:0 25px 25px 25px  ;   } 
.researcher_list_wrap li .tit                       {   font-size:1.25em;font-weight:700;color:#000; padding-bottom:25px; line-height:1.2;    }
.researcher_list_wrap li .tit span           { color:#888; font-size:0.8em; font-weight: 600;   }  
.researcher_list_wrap li .txt                 { position: relative;  display: flex; flex-direction: column;gap:7px; }  
.researcher_list_wrap li dl                      { display: grid; grid-template-columns:25px auto;  font-size: 0.9em; line-height:1.2;   }
.researcher_list_wrap li dl dt                 {position: relative;  font-weight: 600; font-size:1.05em; color:#777;  }
/* .researcher_list_wrap li dl dt::before    {position:absolute; content:'';   left:0; top:6px; width:3px; height:3px; background:#555; border-radius:50%;}
.researcher_list_wrap li dl dt::after			{position:relative; content:':';  right:0; top:-1px; margin-left:5px; } */
.researcher_list_wrap li dl dd               { }
 
 
.researcher_list_wrap li:focus,
.researcher_list_wrap li:hover				{ border:1px solid var(--color1); box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);} 

   
@media screen and (max-width:1300px) {
    .researcher_list_wrap                            {   grid-template-columns: repeat(3, 1fr); } 
    .researcher_list_wrap li figure                {  margin:0.8em;  }
    .researcher_list_wrap li .cont                 {  padding:0 20px 20px 20px  ;   } 
} 
@media screen and (max-width:768px) {
    .researcher_list_wrap                            {   grid-template-columns: repeat(2, 1fr); gap:1.2em 1em;  } 
    .researcher_list_wrap li .tit                       {  font-size:1.2em;padding-bottom:15px;   }
}
@media screen and (max-width:480px) {    
    .researcher_list_wrap							    { grid-template-columns:1fr;  } 
}




/* 연구자 뷰 ================================================================================== */
.researcher_view_wrap									{  position: relative;  }    
.researcher_view_wrap .info_top					    {position:relative;padding:1.7em ; margin-bottom:40px;  border-radius:1em; display: flex; flex-flow:wrap;  flex-direction: row-reverse;  justify-content: space-between;  gap:4%; } 
.researcher_view_wrap .info_top::before           {position:absolute;content:''; top:0; left:0; width:100%; height:100%; background:var(--color1); opacity:0.05;border-radius:1em;z-index:-1; }
.researcher_view_wrap .info_top::after              {position:absolute;content:''; top:0; left:0; width:100%; height:100%; border:1px solid var(--color1); opacity:0.27;border-radius:1em;z-index:-1;} 
.researcher_view_wrap .info_top .img			    {position:relative; width:250px; transition:var(--transition1);}  
.researcher_view_wrap .info_top .img figure   { display: flex;  border:1px solid #ddd;  }
.researcher_view_wrap .info_top .img img		{width:100%; }
  
.researcher_view_wrap .info_top .inner			    { position:relative;  flex:2; padding:10px; }
.researcher_view_wrap .info_top .tit		                {position:relative; font-size:1.7em; line-height:1.4; font-weight:700; color:#000;  margin-bottom:25px; } 
.researcher_view_wrap .info_top .tit span             {font-size:0.7em; color:#888;   }
.researcher_view_wrap .info_top .cate					{position:relative; top:-2px;display:inline-block;font-size:0.7em;line-height:1.2;  padding:5px 10px 6px 10px; color:#fff; background:var(--color2); margin-right:10px;  border-radius:5px; }
.researcher_view_wrap .info_top .cont                { display: flex; flex-direction: column; gap:10px; }
.researcher_view_wrap .info_top .cont dl            {position:relative; display: grid; grid-template-columns:100px auto; gap:12px; font-size:0.95em; line-height:1.3;  }
.researcher_view_wrap .info_top .cont dl dt        { position:relative;  padding-left:12px; color:#111; }
.researcher_view_wrap .info_top .cont dl dt::before	 {position:absolute; content:'';   left:2px; top:6px; width:3px; height:3px; background:var(--color1);  border-radius:50%;}
.researcher_view_wrap .info_top .cont dl dt::after	 {position:absolute; content:'';   right:0; top:1px; width:1px; height:1em; background:rgb(0,0,0,0.1);   }
.researcher_view_wrap .info_top .cont dl dd       {position:relative; }
.researcher_view_wrap .info_top .cont dl .site     {padding-right:35px; }

 
@media screen and (max-width:1024px) {   
    .researcher_view_wrap .info_top						 {padding:1.4em;  gap:1.5em;  } 
    .researcher_view_wrap .info_top .img			    { width:200px; }  
    .researcher_view_wrap .info_top .inner			    { padding:5px; }
    .researcher_view_wrap .info_top .tit		             {font-size:1.6em;   }
}
@media screen and (max-width:768px) {    
    .researcher_view_wrap .info_top .img			    { width:140px; }  
    .researcher_view_wrap .info_top .img figure   { aspect-ratio:1/1; border-radius:50%; overflow:hidden;}
    .researcher_view_wrap .info_top .img img		{object-fit:cover; }
}
@media screen and (max-width:580px) {    
    .researcher_view_wrap .info_top						 {padding:1.2em;gap:1em; margin-bottom:30px; } 
    .researcher_view_wrap .info_top .img               {  width:120px; }     
    .researcher_view_wrap .info_top .tit		                {margin-bottom:20px;   }
    .researcher_view_wrap .info_top .cont                {   gap:6px; }
    .researcher_view_wrap .info_top .cont dl            { grid-template-columns:85px auto;  gap:10px; font-size:0.9em;}
}
 @media screen and (max-width:480px) {    
    .researcher_view_wrap .info_top						 {  flex-direction: column;} 
    .researcher_view_wrap .info_top .img               {   width:120px; margin:auto;}   
    .researcher_view_wrap .info_top .inner			    { width:100%; padding:0; }
    .researcher_view_wrap .info_top .tit		             {font-size:1.5em;   }
    
 
}


/* 연구소 리스트 ================================================================================== */
.institute_ul                            { position: relative; display: grid; grid-template-columns: repeat(1, 1fr); gap:2em; } 
.institute_ul li                         { position: relative; border: 1px solid #e0e0e0; padding:1em;  border-radius:0.7em; transition:all 0.3s ease;}
.institute_ul li .inner              {position: relative;  display: grid; grid-template-columns:300px auto;  gap:2em; }
.institute_ul li figure             {  width: 100%; overflow:hidden; aspect-ratio:3/2;  }
.institute_ul li figure img    { width: 100%; height: 100%;  object-fit: cover; } 
.institute_ul li .cont               { position: relative;  } 
.institute_ul li .tit                       {  font-size: 1.3em;  font-weight: 700;  margin:10px 0 20px 0 ;  color: var(--color1);   }  
   
.institute_ul li .info                 { position: relative;  } 
.institute_ul li dl                      { display: grid; grid-template-columns:95px auto;   }
.institute_ul li dl + dl                {padding-top:5px; }
.institute_ul li dl dt                 {position: relative;  font-weight: 600; color:var(--color1);font-size: 0.95em; padding-left:10px;  }
.institute_ul li dl dt::before    {position:absolute; content:''; display:block; left:0; top:10px; width:3px; height:3px; background:var(--color1); border-radius:50%;}
 
.institute_ul li .home                { position: absolute; top:15px; right:15px; border-radius: 20px; color: #fff; width:32px; height:32px;   line-height:32px; border-radius:50%; background:var(--color1);  font-size: 0.9em; text-align:center;z-index:1; }

.institute_ul li:hover                  { border-color:var(--color1); box-shadow: 3px 3px 15px 0 rgba(0,0,0,0.1); }

  

@media screen and (max-width:1024px) {
    .institute_ul                      {   gap:1.6em; } 
    .institute_ul li .inner          {  grid-template-columns:220px auto;  gap:1.4em; }
    .institute_ul li .tit                       {     margin:10px 0 15px 0 ; }
    .institute_ul li .home                {  width:30px; height:30px;   line-height:30px;   }
}
@media screen and (max-width:768px) {
    .institute_ul li                         {  padding:0.7em; } 
    .institute_ul li .inner                {  grid-template-columns: repeat(1, 1fr);  gap:0; }
    .institute_ul li .cont               { padding:10px;} 
    .institute_ul li dl + dl                {padding-top:3px; }
    .institute_ul li dl                      {  grid-template-columns:80px auto;   }
    .institute_ul li .home                {  top:initial;   bottom:13px;  right: 12px;    }
}
@media screen and (max-width:580px) {
    .institute_ul li .tit                       {  font-size: 1.2em; }
    .institute_ul li .cont               { padding:5px;} 
    .institute_ul li dl                      { grid-template-columns: repeat(1, 1fr);  }
    .institute_ul li dl dd                 { padding-left:10px;  } 
    .institute_ul li dl + dl                {padding-top:5px; } 
    .institute_ul li .home                {  width:28px; height:28px;   line-height:28px;   }
}








/* 연구소 뷰 ================================================================================== */
.instituteview                             { margin-bottom:40px; display: flex; gap:40px;  background:#f5f5f5; padding:2.5em; border-radius:1.5em 0;}
.instituteview figure                    {  width:400px; aspect-ratio:3/2; border: 1px solid #ddd; overflow: hidden;  border-radius:0.5em;  }
.instituteview figure img            { width: 100%; height: 100%; object-fit: cover; }
.instituteview .cont                    { flex:2; padding-top:10px; }
.instituteview .cont .tit                {   padding-bottom:25px;  color: var(--color1);   font-size: 1.5em; font-weight: 700;}

.instituteview .info dl                { display: grid; grid-template-columns: 130px auto; line-height:1.3; }
.instituteview .info dl + dl        {padding-top:10px;  }
.instituteview .info dl dt            { position: relative;  font-weight: 700; color:var(--color1);font-size: 0.95em; padding-left:14px;  }
.instituteview .info dl dt::before    {position:absolute; content:''; display:block; left:2px; top:8px; width:3px; height:3px; background:var(--color1); border-radius:50%;}
.instituteview .info dl dd            {  color: #333;   }

.instituteview .home                    { position: absolute; top:20px; right:20px; border-radius: 20px; color: #fff; width:34px; height:34px;   line-height:32px; border-radius:50%; background:var(--color1);  font-size: 0.9em; text-align:center; }
 

@media screen and (max-width:1024px) { 
    .instituteview                             { flex-direction: column; gap:20px; justify-content:center; align-items:center; padding:2em  ;}
    .instituteview figure                    {  width:100%; max-width:400px; }
    .instituteview .cont .tit                { text-align:center;  }
    .instituteview .cont                    {  padding-top:0; } 
    .instituteview .info dl                { grid-template-columns: 100px auto; }
}
@media screen and (max-width:580px) { 
    .instituteview                             { padding:20px  ;}
.instituteview .cont .tit                {   padding-bottom:20px;   font-size: 1.35em;  }
    .instituteview .info dl                { grid-template-columns: 90px auto; }
}












/* 연구소 지도 ================================================================================== */
.institute_mapbox {
    position: relative;
    border: 1px solid #dfdfdf;
}
.institute_mapbox #center_map,
.institute_mapbox #institute_map {
    position: relative;
    width: 100%;
    height: 560px;
}
.institute_mapbox p {
    position: absolute;
    bottom: 0;
    width: 100%;
    font-weight: 500;
    padding: 20px 10px;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}
.institute_mapbox i {
    margin-right: 10px;
}

@media screen and (max-width: 1024px) {
    .institute_mapbox #center_map,
    .institute_mapbox #institute_map {
        height: 420px;
    }
}

@media screen and (max-width: 768px) {
    .institute_mapbox #center_map,
    .institute_mapbox #institute_map {
        height: 300px;
    }
    .institute_mapbox p {
        padding: 10px;
    }
}