@charset "utf-8";

/* ----- 구분 ----- */
#bo_gall { border:none !important; }
ul.scrap_gall { width: 96%; margin-left: 2%; margin-right: 2%; }

.scrap_gall li { padding: 10px; display: inline-block; border:0.5px solid rgba( 255, 255, 255, 0 ); border-radius: 5px; }
.scrap_gall li:after { width: 100%; content: ""; display: block; }

/* ----- 링크 ----- */
.scrap_gall li .gall_link:hover { text-decoration:underline; color:#000; }

/* ----- 체크박스 ----- */
.td_chk { top: 12px; z-index: 3; }

/* ----- 섬네일 이미지 ----- */
.scrap_gall li .img_box {
    position: relative; display: block;
    left: 0; top: 0; text-align: center;
	margin: 0; padding: 0; overflow: hidden;
}
.scrap_gall li .img_box .img-thumb {
    width: 100%; height: 100%;
	min-width: 120px; min-height: 120px;
	border-radius: 5px 5px 0px 0px;
	border:1px solid #9b9b9b;
}

/* ----- 오버효과 ----- */

	/* 기본 효과 */
	.scrap_gall li .no_img:before {
		background-color: #fff; width: 100px; height: 100px; border-radius:100%;
		top: 0; right: 0; bottom: 0; left: 0; display: inline-block; position: absolute; opacity:0; content:"\f002"; 
		font-family: "FontAwesome"; font-weight: 700; font-size:5em; color:#333; z-index: 99; margin :auto;
	}
	.scrap_gall li .no_img:after {
		border-radius: 5px 5px 0px 0px; top: 0; left: 0; display: block; position: absolute;
		opacity: 0; content: ""; width: 100%; height: 100%; background: rgba(53, 53, 53, 0.85);
	}
	/* 네이버 블로그 */
	.scrap_gall li .naver_blog:before {
		top: 75%; right: 0; bottom: 0; left: 0; display: inline-block; position: absolute; opacity:0; content:"\f002  Blog"; width: 100%; height: 100%;
		font-family: "FontAwesome"; font-weight: 700; font-size:2.5em; color:#fff; z-index: 99; margin :auto;
	}
	.scrap_gall li .naver_blog:after {
		border-radius: 5px 5px 0px 0px; top: 0; left: 0; display: block; position: absolute;
		opacity: 0; content: ""; width: 100%; height: 100%; background: rgba(25, 205, 97, 0.85);
	}
	/* 인스타그램 피드 */
	.scrap_gall li .instagram_feed:before {
		top: 75%; right: 0; bottom: 0; left: 0; display: inline-block; position: absolute; opacity:0; content:"\f002  Instagram"; width: 100%; height: 100%;
		font-family: "FontAwesome"; font-weight: 700; font-size:2.5em; color:#fff; z-index: 99; margin :auto;
	}
	.scrap_gall li .instagram_feed:after {
		border-radius: 5px 5px 0px 0px; top: 0; left: 0; display: block; position: absolute; opacity: 0; content: ""; width: 100%; height: 110%;
		background: rgb(253,244,151); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdf497', endColorstr='#285aeb',GradientType=1 );
		background: -moz-linear-gradient(-45deg, rgb(253,244,151) 0%, rgb(253,244,151) 5%, rgb(253,89,73) 45%, rgb(214,36,159) 60%, rgb(40,90,235) 90%);
		background: -webkit-linear-gradient(-45deg, rgb(253,244,151) 0%,rgb(253,244,151) 5%,rgb(253,89,73) 45%,rgb(214,36,159) 60%,rgb(40,90,235) 90%);
		background: linear-gradient(135deg, rgb(253,244,151) 0%,rgb(253,244,151) 5%,rgb(253,89,73) 45%,rgb(214,36,159) 60%,rgb(40,90,235) 90%);
	}

.scrap_gall li .img_box:hover:after, .scrap_gall li .img_box:hover:before { opacity: 1; }	
.scrap_gall li .img_box:after, .scrap_gall li .img_box:before {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* ----- 제목 ----- */
.scrap_gall .info_title {
    text-align: left; height: 1.5em;
    font-weight: 700; font-size:16px;
    overflow: hidden; white-space: pre-wrap;
    word-break: break-all; text-overflow: ellipsis;
}
/* ----- 작성자 ----- */
.scrap_gall .info_writer {
    text-align: left; overflow:hidden;
	font-size:13px; margin:5px 0; height: 25px;
}
/* ----- 작성자 프로필사진 ----- */
.scrap_gall .info_writer .img-profile {
    width: 25px; height: 25px;
    border-radius: 50% 50%;
}

/* ----- Line-Clamp ----- */
.line-clamp {
	white-space: pre-wrap;
	word-break: break-all;
	text-overflow: ellipsis;
	display: block; display: -webkit-box;
	overflow: hidden; line-height: 1.5;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-box-orient: vertical;
	-o-box-orient: vertical;
	box-orient: vertical;
	position: relative;
	overflow: hidden;
}
.line-clamp:after {
    width: 25%;
	content: '...';
	display: block;
    text-align : right;
    position: absolute;
    height: calc(1em * 1.5);
	bottom: 0; right: 0;
}
@supports (-webkit-line-clamp: 1) {
	.line-clamp:after { display : none !important; }
}
.line-clamp-1 {
  height: calc(1em * 1.5 * 1);
  -webkit-line-clamp: 1;
  -moz-line-clamp: 1;
  -ms-line-clamp: 1;
  -o-line-clamp: 1;
  line-clamp: 1;
}
.line-clamp-2 {
  height: calc(1em * 1.5 * 2);
  -webkit-line-clamp: 2;
  -moz-line-clamp: 2;
  -ms-line-clamp: 2;
  -o-line-clamp: 2;
  line-clamp: 2;
}
.line-clamp-3 {
  height: calc(1em * 1.5 * 3);
  -webkit-line-clamp: 3;
  -moz-line-clamp: 3;
  -ms-line-clamp: 3;
  -o-line-clamp: 3;
  line-clamp: 3;
}
.line-clamp-4 {
  height: calc(1em * 1.5 * 4);
  -webkit-line-clamp: 4;
  -moz-line-clamp: 4;
  -ms-line-clamp: 4;
  -o-line-clamp: 4;
  line-clamp: 4;
}
.line-clamp-5 {
  height: calc(1em * 1.5 * 5);
  -webkit-line-clamp: 5;
  -moz-line-clamp: 5;
  -ms-line-clamp: 5;
  -o-line-clamp: 5;
  line-clamp: 5;
}
.line-clamp-6 {
  height: calc(1em * 1.5 * 6);
  -webkit-line-clamp: 6;
  -moz-line-clamp: 6;
  -ms-line-clamp: 6;
  -o-line-clamp: 6;
  line-clamp: 6;
}

/* ----- 하단 인포메이션 박스 & 내용박스 ----- */
.scrap_gall li .info_box {
	margin: 0; height: 100%;
    overflow: hidden; padding: 20px 20px;
	border: 0.5px solid #bebebe;
	border-radius: 0px 0px 5px 5px;
	border-top: none;
	font-size: 14px;
}
.scrap_gall .info_contents {
    width: 100%; font-size:14px;
	margin-top:5px; overflow: hidden;
	height: calc(1em * 1.5 * 4);
	-webkit-line-clamp: 4;
	-moz-line-clamp: 4;
	-ms-line-clamp: 4;
	-o-line-clamp: 4;
	line-clamp: 4;
}

/* ----- 미디어 쿼리 ----- */
@media (min-width: 768px) {
	.scrap_gall li .info_box { padding: 17px 17px; }
	.scrap_gall .info_contents {
		height: calc(1em * 1.5 * 3);
		-webkit-line-clamp: 3;
		-moz-line-clamp: 3;
		-ms-line-clamp: 3;
		-o-line-clamp: 3;
		line-clamp: 3;
	}
}
@media (min-width: 992px) {
    .scrap_gall li .info_box { padding: 17px 17px; }
	.scrap_gall .info_contents {
		height: calc(1em * 1.5 * 2);
		-webkit-line-clamp: 2;
		-moz-line-clamp: 2;
		-ms-line-clamp: 2;
		-o-line-clamp: 2;
		line-clamp: 2;
	}
}
@media (min-width: 1200px) {
	.scrap_gall li .info_box { padding: 20px 20px; }
	.scrap_gall .info_contents {
		height: calc(1em * 1.5 * 3);
		-webkit-line-clamp: 3;
		-moz-line-clamp: 3;
		-ms-line-clamp: 3;
		-o-line-clamp: 3;
		line-clamp: 3;
	}
}