@charset "utf-8";

.basic-post-list .post-list { list-style:none; display: flex; justify-content: space-between; padding:0px; margin: 0;}
.basic-post-list .post-list li {  margin:0px; width: 32%; border: 1px solid #e1e1e1; }
.basic-post-list .post-list li a { display: block; position: relative; padding:6.277%; color: inherit; background: #fff;}
.basic-post-list .post-list li a p {margin: 0;  font-weight: 300;  }
.basic-post-list .post-list li a p.kind {  color: #333;}
.basic-post-list .post-list li a p.subject { padding: 20px 0 30px; font-size: 24px; font-weight: 500; color: #333; }
.basic-post-list .post-list li a p.post-text {color: #999; line-height: 1.6;}
.basic-post-list .post-list li a p.date { padding: 40px 0 0; }
.basic-post-list .post-list li a:before,
.basic-post-list .post-list li a:after { position: absolute; opacity: 0; transition: 0.1s; }
.basic-post-list .post-list li a:before { content:'';  left: 0; top: 0; width: 100%; height: 100%; border:3px solid  #062d53; }
.basic-post-list .post-list li a:after { content:'+'; display: flex; justify-content: center; align-items: center; bottom: 0; right: 0; width: 50px; height: 50px; background: #062d53; color: #fff; transition-delay: .1s;}
.basic-post-list .post-list li a:hover:before,
.basic-post-list .post-list li a:hover:after { opacity:1; }


@media (max-width:991px){
    .basic-post-list .post-list li a p.subject { padding: 15px 0 25px; font-size: 20px; }
    .basic-post-list .post-list li a p.date { padding: 30px 0 0; }
}

@media (max-width:768px){
    .basic-post-list .post-list { flex-direction: column; }
    .basic-post-list .post-list li { margin: 0 0 20px; width: 100%; }
    .basic-post-list .post-list li:last-of-type { margin: 0;  }
    .basic-post-list .post-list li a { padding: 20px 15px;}
}
@media (max-width:576px){
    .basic-post-list .post-list li a p.subject { padding: 10px 0 20px; }
    .basic-post-list .post-list li a p.date { padding: 20px 0 0;}
}
@media (max-width:480px){
    .basic-post-list .post-list li a { padding: 20px 10px;}
    .basic-post-list .post-list li a p.kind { font-size: 14px;}
    .basic-post-list .post-list li a p.subject { padding: 10px 0 15px; }
    .basic-post-list .post-list li a p.date { padding: 15px 0 0; font-size: 14px;}
}

.basic-post-list .post-list li b { letter-spacing:-1px; padding-right:1px; }
.basic-post-list .post-list li .name { letter-spacing:-1px; color:#888; padding-left:4px; padding-right:1px;}
.basic-post-list .post-list .txt-normal { letter-spacing:0; }
.basic-post-list .post-none { padding:50px 10px; text-align:center; color:#888; }
.basic-post-list .wr-text { font-family:dotum; font-size:11px; letter-spacing:-1px; line-height:11px; font-weight:normal; }
.basic-post-list .wr-icon { display:inline-block; padding:0px; margin:0px; line-height:12px; vertical-align:middle; background-repeat: no-repeat; background-position: 0px 0px; }
.basic-post-list .wr-new { width:12px; height:12px; background-image: url('./img/icon_new.gif'); }
.basic-post-list .wr-secret { width:12px; height:12px; background-image: url('./img/icon_secret.gif'); }
.basic-post-list .wr-video { width:12px; height:12px; background-image: url('./img/icon_video.gif'); }
.basic-post-list .wr-image { width:12px; height:12px; background-image: url('./img/icon_image.gif'); }
.basic-post-list .wr-file { width:12px; height:12px; background-image: url('./img/icon_file.gif'); }