@charset "utf-8";
/**************************************************

	SUPERBOARD :: BOARD SKIN :: gallery

**************************************************/
#sb-gallery{width:100%; border-top:1px solid #ddd;}
#sb-gallery > li{position: relative;display:block; border-bottom:1px solid #ddd; padding:60px 0; }
#sb-gallery > li .link{position: absolute;top: 0;left: 0;width: 100%;height: 100%;border: 1px solid rgba(0,0,0,0);box-sizing: border-box; z-index:2;}
#sb-gallery > li:after {display:block; content:''; clear:both;}
#sb-gallery > li .left {width:42%;  }
#sb-gallery > li .left .tmb{ width:100%; height:0; position:relative;  padding-bottom:62%;}
#sb-gallery > li .left .tmb .img {position:absolute; top:0; left:0; width:100%; height:100%; background-position: center center;background-size: cover;}
#sb-gallery > li .infobox{position:absolute; top:0; left:42%; width:58%; height:100%;}
#sb-gallery > li .infobox .txt {position:absolute; width:100%; box-sizing:border-box; padding-left:60px; top:50%; left:0; transform:translateY(-50%);}
#sb-gallery > li .infobox .txt span {display:block; font-size:18px; line-height:30px; color:#0082cf; }
#sb-gallery > li .infobox .txt h5 {display: block; font-size: 34px;line-height: 44px;color: #333333; font-weight:600; margin:5px 0 20px;}
#sb-gallery > li .infobox .txt p {font-size:18px; line-height:30px; color:#666; font-weight:300; height:60px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  word-wrap: break-word;}
#sb-gallery > li .infobox .txt em {display:block; margin-top:50px; font-size:18px; color:#999; font-weight:300; line-height:30px; font-style:normal;}


#sb-search fieldset {width:520px;}
#sb-search .where {width:200px; border:0; border-top:1px solid #bababa; padding-top:10px;}
#sb-search .inp {width:300px; border:0; border-top:1px solid #bababa; padding-top:10px; margin-left:15px;}
#sb-search .total strong {color:#0082cf;}


@media screen and (max-width: 1400px) {
	#sb-search fieldset {width:100%;}
	#sb-search .where {width:150px; margin:0 !important;}
	#sb-search .inp {width:calc(100% - 160px); margin:0 0 0 10px !important;}

	#sb-gallery > li .infobox .txt span {font-size:13px;}
	#sb-gallery > li .infobox .txt h5 {font-size:17px;}
	#sb-gallery > li .infobox .txt p {font-size:13px; line-height:24px; height:48px;}
	#sb-gallery > li .infobox .txt em {margin-top:20px; font-size:13px;}
}

@media screen and (max-width: 750px) {

	#sb-gallery > li .left {width:100%;}
	#sb-gallery > li .infobox {position:relative; top:auto; left:auto; width:100%; height:auto; margin-top:20px;}
	#sb-gallery > li .infobox .txt {padding-left:0; position:relative; top:auto; left:auto; transform:translate(0);}
}