@charset "utf-8";


.hover-a-more .a:hover .more { display: block; }

/********************************************************
	■ 타일 스타일 공용
********************************************************/
.tiles { visibility: hidden; }

.tiles.loaded { visibility: visible; }

.tiles::before, .tiles::after { content: ""; clear: both; display: block; }

.tiles .tile { float: left; margin-bottom: 10px; text-align: center; visibility: visible; }
1
.tiles .tile > .a { position: relative; display: block; width: 100%; height: 100%; padding: 0; }

.tiles .tile > .a::before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; transition: all .3s ease; }

.tiles .tile > .a::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; transition: all .3s ease; }

.tiles .tile > .a > .a2, .tiles .tile > .a > .a3 { position: absolute; left: 0; right: 0; top: 0; bottom: 0; }

.tiles .tile > .a .a2::before, .tiles .tile > .a .a2::after, .tiles .tile > .a .a3::before, .tiles .tile > .a .a3::after { content: ""; position: absolute; transition-timing-function: linear; z-index: 3; }

.tiles .image { position: relative; overflow: hidden; border:1px solid #ddd; margin:5px;}

.tiles .image::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; transition: all .3s ease; }

.tiles .more { display: none; position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); z-index: 2; }

.tiles .image .img { background-repeat: no-repeat; background-size: cover; background-position: center; transition: all .3s ease; }

.tiles .image.no-image .img { background-image: url(img/no-img.jpg) !important; }

.tiles .image .chk { position: absolute; left: 10px; top: 10px; z-index: 3; }

.tiles .content { height: 100%; text-align: left; }

.tiles .data { display: none; }


.ts-squareimg-top-1 .tile { margin-bottom: 50px; }

.ts-squareimg-top-1 .image .img { position: relative; padding-bottom: 100%; }

/* 이미지 직사각 비율로 표현하려면 padding-bottom(%)을 재정의한다. */
.ts-squareimg-top-1 .content { margin-top: 20px; height: 100%; margin-bottom: 30px;}

.ts-squareimg-top-1 .content .desc { margin-top: 10px;   font-weight: 300; }

@media (max-width: 767px) { .ts-squareimg-top-1 { margin: 0 -5px; }
  .ts-squareimg-top-1 .tile { padding: 0 5px; } }

.hover-img-alpha70left .a .image::after  {
  right: 100%;
}

.hover-img-alpha70left .a:hover .image::after  {
  background-color: rgba(0, 0, 0, 0.6) !important;
  right: 0;
}

.la_gall .tiles .tile > .a  {
  cursor: pointer;
}

.la_gall .tiles .tile .content  {
}

.la_gall .tiles .tile .content .cg  {
  font-size: 14px;
}

.la_gall .tiles .tile .content .head  {
  margin-top: 10px;
}

.la_gall .tiles .tile .content .date  {
  margin-top: 20px;
}

.la_gall .tiles .tile .content .date i  {
  margin-right: 7px;
}

.la_gall .tiles .tile .more .btn-view  {
  display: inline-block;
  padding: 0 25px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #ddd;
  border-radius: 20px;
  color: white;
}

@media (max-width: 767px) {
}