@charset "utf-8";

/* sub01_02 비전 */
.s0102 .vision-wrap {padding: 50px 0; overflow: hidden;}
.s0102 .vision-wrap .vision-banner {position: relative; max-width: 950px; margin: 0 auto 25px; padding: 45px 30px; border-radius: 0 30px 0 30px; background-color: #016b3b;}
.s0102 .vision-wrap .vision-banner:before, .s0102 .vision-wrap .vision-banner:after {content: ""; display: block; position: absolute;}
/* .s0102 .vision-wrap .vision-banner:before {top: 0; left: 0; width: 234px; height: 88px; background: url(/images/biobank/sub01/sub0102_bg01.png) no-repeat;} */
/* .s0102 .vision-wrap .vision-banner:after {bottom: 0; right: 0; width: 233px; height: 162px; background: url(/images/biobank/sub01/sub0102_bg02.png) no-repeat; } */

.s0102 .vision-wrap .vision-banner .banner-title {position: relative; font-family: 'gmarket'; z-index: 1; color: #fff; text-align: center;}
.s0102 .vision-wrap .vision-banner .banner-title em {display: block; padding-bottom: 8px; font-weight: bold; font-size: 16px;}
.s0102 .vision-wrap .vision-banner .banner-title strong {display: block; font-weight: normal; font-size: 27px;}

.s0102 .vision-wrap .vision-list {position: relative; display: flex; max-width: 1218px; margin: 0 auto; padding-top: 147px;}
.s0102 .vision-wrap .vision-list:before {content: ""; display: block; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 357px; height: 181px; background: url(/images/biobank/sub01/sub0102_arrow.png) no-repeat;}
.s0102 .vision-wrap .vision-list .vision {position: relative; flex-basis: 33.3333%; max-width: 33.3333%; padding: 0 14px;}
.s0102 .vision-wrap .vision-list .vision:before {content: ""; display: block; position: absolute; top: -45px; left: 50%; transform: translateX(-50%); width: 110px; height: 110px; border-radius: 100%;}
.s0102 .vision-wrap .vision-list .vision.vision01:before {background: #008574 url(/images/biobank/sub01/sub0102_icon01.png) no-repeat;}
.s0102 .vision-wrap .vision-list .vision.vision02:before {background: #65c420 url(/images/biobank/sub01/sub0102_icon02.png) no-repeat;}
.s0102 .vision-wrap .vision-list .vision.vision03:before {background: #095b74 url(/images/biobank/sub01/sub0102_icon03.png) no-repeat;}
.s0102 .vision-wrap .vision-list .vision p {display: flex; width: 100%; height: 100%; padding: 75px 25px 30px; margin: 0; border: 10px solid #f7f7f7; justify-content: center; font-size: 18px; text-align: center; color: #444;}

@media (max-width:991px) {
  .s0102 .vision-wrap .vision-list {flex-wrap: wrap;}
  .s0102 .vision-wrap .vision-list .vision {flex-basis: 100%; max-width: 100%; padding: 0;}
  .s0102 .vision-wrap .vision-list .vision:not(:first-child) {margin-top: 65px;}
}
@media (max-width:767px) {
  .s0102 .vision-wrap .vision-banner:before {width: 140px; height: 53px; background-size: 100%;}
  .s0102 .vision-wrap .vision-banner:after {width: 150px; height: 104px; background-size: 100%;}
}
/* sub01_02 비전 End */

/* sub0504 관련사이트 */
.related_list{margin-left:-25px;}
.related_list::after{content: "";display: block;clear:both;visibility: visible;}
.related_list .item{position: relative;float:left;width:calc(25% - 25px);margin-left:25px;margin-bottom:15px;background: #006940;height:80px;}
.related_list .item a{position: absolute;left:0;top:0;width:100%;height:100%;display: table;table-layout: fixed;background: #fff;transition: 0.5s;border:1px solid #ddd;text-align: center;padding:0 8px;}
.related_list .item a:hover,
.related_list .item a:focus{left:-10px;top:-10px;border-color:#006940;border-radius: 10px;}
.related_list .item a span{display:table-cell;vertical-align: middle;font-weight:bold;}

@media(max-width:999px){
    .related_list .item{width:calc(33.33% - 25px);}
}
@media(max-width:650px){
    .related_list .item{width:calc(50% - 25px);}
}
@media(max-width:430px){
    .related_list{margin-left:0;}
    .related_list .item{float:none;width:100%;margin-left:0;}
}
/* sub0504 관련사이트 End */