.page-article {
  width:100%;
  padding:60px 0 0;
}
.post-list-content { padding:0; }
.page-marker {
  display:block;
  width:100%;
  height:0;
  clear:both;
}
.page-marker {
  display:block;
  width:100%;
  height:0;
  clear:both;
}
.articles {
  margin:0 -20px;
  position:relative;
  padding:1px 0 0;
  display:flex;
  flex-wrap:wrap;
}
.articles:before {
  content:'';
  display:block;
  position:absolute;
  top:0;
  left:20px;
  right:20px;
  height:1px;
  background:rgba(29,184,202,0.5);
}
.articles:after {
  content:'';
  display:block;
  height:0;
  width:100%;
  clear:both;
}
.post-item {
  display:block;
  width:33.3333%;
  padding:29px 20px 30px;
  min-height:539px;
  position:relative;
}
.post-item .line {
  position:absolute;
  top:0;
  left:20px;
  right:20px;
  height:1px;
  background:rgba(29,184,202,0.5);
}
.post-item:nth-child(4) .line, .post-item:nth-child(3) .line, .post-item:nth-child(2) .line { display:none; }
.post-image-link {
  display:block;
  position:relative;
  overflow:hidden;
}
.post-image-link:before {
  content:'';
  display:block;
  width:460px;
  height:460px;
  border-radius:50%;
  position:absolute;
  top:50%;
  left:50%;
  margin-top:-230px;
  margin-left:-230px;
  background:rgba(29,184,202,0.8);
  z-index:1;
  opacity:0;
  -webkit-transform:scale(0);
  transform:scale(0);
  -webkit-transition:opacity 0.5s ease-out, -webkit-transform 0.5s ease-out;
  transition:opacity 0.5s ease-out, transform 0.5s ease-out;
}
.post-image-link .text {
  display:inline-block;
  position:absolute;
  top:50%;
  margin-top:-15px;
  left:0;
  height:30px;
  width:100%;
  line-height:30px;
  text-align:center;
  color:#ffffff;
  font-size:18px;
  font-weight:600;
  z-index:1;
  opacity:0;
  -webkit-transform:translate(0,10px);
  transform:translate(0,10px);
  -webkit-transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition:opacity 0.3s ease-out, transform 0.3s ease-out;
}
.post-image-link img {
  -webkit-transform:scale(1);
  transform:scale(1);
  -webkit-transition:-webkit-transform 0.5s ease-out;
  transition:transform 0.5s ease-out;
}
.post-image-link:hover:before {
  opacity:1;
  -webkit-transform:scale(1);
  transform:scale(1);
}
.post-image-link:hover .text {
  opacity:1;
  -webkit-transform:translate(0,0);
  transform:translate(0,0);
  -webkit-transition:opacity 0.3s ease-out 0.1s, -webkit-transform 0.3s ease-out 0.1s;
  transition:opacity 0.3s ease-out 0.1s, transform 0.3s ease-out 0.1s;
}
.post-image-link:hover img {
  -webkit-transform:scale(1.1);
  transform:scale(1.1);
  -webkit-transition:-webkit-transform 5s ease-out 0.5s;
  transition:transform 5s ease-out 0.5s;
}
.post-image {
  display:block;
  width:100%;
  background-color:#f5f5f5;
}
.post-title .post-link { color:#0e233b; }
.post-title .post-link:hover { color:#1db8ca; }
.post-title h2 {
  font-size:24px;
  font-weight:600;
  line-height:30px;
  margin:17px 0 3px;
}
.post-description a { color:#0e233b; }
.post-description a:hover { color:#1db8ca; }
.more-article-wrapper {
  margin-left:0;
  padding:0;
}
@media only screen and (max-width: 1200px) {
  .page-article {
    max-width:100%;
    padding:60px 20px 0;
  }
}
@media only screen and (max-width: 960px) {
  .page-article {
    max-width:810px;
    padding:60px 20px 0;
  }
  .post-item { width:50%; }
  .post-item:nth-child(4) .line { display:block; }
}
@media only screen and (max-width: 690px) {
  .post-item {
    width:100%;
    padding:29px 0 30px;
  }
  .articles {
    max-width:365px;
    margin:0 auto;
  }
  .post-item { min-height:0; }
  .articles:before, .post-item .line {
    left:0;
    right:0;
  }
  .post-item:nth-child(3) .line { display:block; }
}
