@charset "utf-8";

.lt-idea-inner .grid { margin: 0 auto; width: 100%; }
.lt-idea-inner .grid-item { width: 23.7%; margin-bottom: 20px; float: left; }
.lt-idea-inner .grid-sizer { width: 23.7%; }

.lt-idea-inner .grid-item .empty_li{ width: 100%; font-size: 15px; color: #aaa; margin: 0; display: flex; justify-content: center; align-items: center; min-height: 300px; background-color: #f8f8f8; }
.lt-idea-inner .grid-item .gall_chk{ position: absolute; left: 10px; top: 10px; z-index: 20; }
.lt-idea-inner .grid-item > a{ display: block; }
.lt-idea-inner .grid-item .li_empty { width: 100%; padding: 100px 0 ; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; font-size: 16px; text-align: center; margin-right: 0; }
.lt-idea-inner .grid-item .imgBox{ position: relative; width: 100%; height: auto; border-radius: 10px; overflow: hidden; }
.lt-idea-inner .grid-item .imgBox img{ width: 100% !important; height: auto; transition: all 0.5s ease-out; }
.lt-idea-inner .grid-item .imgBox .img-shade { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 0; background-color: rgba(0, 0, 0, .6); transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .btn-more { position: absolute; display: inline-block; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 14px; line-height: 28px; margin: 0 auto; padding: 0 20px; border-radius: 0; border: 1px solid #fff; opacity: 0; transition: all .3s ease-out; }


/** hover box */
.lt-idea-inner .grid-item .imgBox .hovBox{ position: absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: rgba(0, 0, 0, .6); overflow: hidden; z-index: 10; opacity: 0; transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .hovBox > span{ display: inline-flex; justify-content: space-between; align-items: center; width: 130px; height: 40px; border-radius: 0; background-color: #FFC917; padding: 12px; opacity: 0; transform: translateY(20px); transition: all .3s ease-out .2s; }
.lt-idea-inner .grid-item .imgBox .hovBox > span > p{ font-size: 12px; font-weight: 500; color: #181818; }

/*? hover */
.lt-idea-inner .grid-item > a:hover{ border-color: rgba(256, 256, 256, .1); }
.lt-idea-inner .grid-item > a:hover .hovBox{ opacity: 1; }
.lt-idea-inner .grid-item > a:hover .hovBox > span{ opacity: 1; transform: translateY(0); }









/*! TABLET  */
@media screen and (max-width: 1279px){ 





.lt-idea-inner .grid { margin: 0 auto; width: 100%; }
.lt-idea-inner .grid-item { width: 31.3%; margin-bottom: 20px; float: left; }
.lt-idea-inner .grid-sizer { width: 31.3%; }


.lt-idea-inner .grid-item .empty_li{ width: 100%; font-size: 15px; color: #aaa; margin: 0; display: flex; justify-content: center; align-items: center; min-height: 300px; background-color: #f8f8f8; }
.lt-idea-inner .grid-item .gall_chk{ position: absolute; left: 10px; top: 10px; z-index: 20; }
.lt-idea-inner .grid-item > a{ display: block; }
.lt-idea-inner .grid-item .li_empty { width: 100%; padding: 100px 0 ; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; font-size: 16px; text-align: center; margin-right: 0; }
.lt-idea-inner .grid-item .imgBox{ position: relative; width: 100%; height: auto; border-radius: 10px; overflow: hidden; }
.lt-idea-inner .grid-item .imgBox img{ width: 100% !important; height: auto; transition: all 0.5s ease-out; }
.lt-idea-inner .grid-item .imgBox .img-shade { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 0; background-color: rgba(0, 0, 0, .6); transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .btn-more { position: absolute; display: inline-block; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 14px; line-height: 28px; margin: 0 auto; padding: 0 20px; border-radius: 0; border: 1px solid #fff; opacity: 0; transition: all .3s ease-out; }


/** hover box */
.lt-idea-inner .grid-item .imgBox .hovBox{ position: absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: rgba(0, 0, 0, .6); overflow: hidden; z-index: 10; opacity: 0; transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .hovBox > span{ display: inline-flex; justify-content: space-between; align-items: center; width: 130px; height: 40px; border-radius: 0; background-color: #FFC917; padding: 12px; opacity: 0; transform: translateY(20px); transition: all .3s ease-out .2s; }
.lt-idea-inner .grid-item .imgBox .hovBox > span > p{ font-size: 12px; font-weight: 500; color: #181818; }

/*? hover */
.lt-idea-inner .grid-item > a:hover{ border-color: none; }
.lt-idea-inner .grid-item > a:hover .hovBox{ opacity: 0; }
.lt-idea-inner .grid-item > a:hover .hovBox > span{ opacity: 0; }




}


/*! MOBILE  */
@media screen and (max-width: 767px){ 

.lt-idea-inner { max-width: 100%; box-sizing: border-box; }
.lt-idea-inner .grid { margin: 0 auto; width: 100%; overflow: hidden; box-sizing: border-box; }
.lt-idea-inner .grid-item { width: calc(50% - 10px); margin-bottom: 10px; float: left; box-sizing: border-box; }
.lt-idea-inner .grid-sizer { width: calc(50% - 10px); margin-bottom: 10px; float: left; box-sizing: border-box; }


.lt-idea-inner .grid-item .empty_li{ width: 100%; font-size: 15px; color: #aaa; margin: 0; display: flex; justify-content: center; align-items: center; min-height: 300px; background-color: #f8f8f8; }
.lt-idea-inner .grid-item .gall_chk{ position: absolute; left: 10px; top: 10px; z-index: 20; }
.lt-idea-inner .grid-item > a{ display: block; }
.lt-idea-inner .grid-item .li_empty { width: 100%; padding: 100px 0 ; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; font-size: 16px; text-align: center; margin-right: 0; }
.lt-idea-inner .grid-item .imgBox{ position: relative; width: 100%; height: auto; border-radius: 10px; overflow: hidden; }
.lt-idea-inner .grid-item .imgBox img{ width: 100% !important; height: auto; transition: all 0.5s ease-out; }
.lt-idea-inner .grid-item .imgBox .img-shade { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 0; background-color: rgba(0, 0, 0, .6); transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .btn-more { position: absolute; display: inline-block; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 14px; line-height: 28px; margin: 0 auto; padding: 0 20px; border-radius: 0; border: 1px solid #fff; opacity: 0; transition: all .3s ease-out; }


/** hover box */
.lt-idea-inner .grid-item .imgBox .hovBox{ position: absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: rgba(0, 0, 0, .6); overflow: hidden; z-index: 10; opacity: 0; transition: all .3s ease-out; }
.lt-idea-inner .grid-item .imgBox .hovBox > span{ display: inline-flex; justify-content: space-between; align-items: center; width: 130px; height: 40px; border-radius: 0; background-color: #FFC917; padding: 12px; opacity: 0; transform: translateY(20px); transition: all .3s ease-out .2s; }
.lt-idea-inner .grid-item .imgBox .hovBox > span > p{ font-size: 12px; font-weight: 500; color: #181818; }

/*? hover */
.lt-idea-inner .grid-item > a:hover{ border-color: none; }
.lt-idea-inner .grid-item > a:hover .hovBox{ opacity: 0; }
.lt-idea-inner .grid-item > a:hover .hovBox > span{ opacity: 0; }



}


/*! MOBILE  */
@media screen and (max-width: 480px){ 


.lt-idea-inner { max-width: 100%; box-sizing: border-box; }
.lt-idea-inner .grid { margin: 0 auto; width: 100%; overflow: hidden; box-sizing: border-box; }
.lt-idea-inner .grid-item { width: calc(50% - 10px); margin-bottom: 10px; float: left; box-sizing: border-box; }
.lt-idea-inner .grid-sizer { width: calc(50% - 10px); margin-bottom: 10px; float: left; box-sizing: border-box; }

}