#portfolio .nav-tabs {
	display: table;
	margin: 0 auto 80px;
	border-bottom: 0;
	border-radius: 0;
}
#portfolio .nav-tabs>li>a {
	display: inline-block;
	padding: 0;
	margin: 0 20px;
	border: 0;
	border-bottom: 1px solid transparent;
}

#portfolio .nav-tabs>li.active >a {
	border-bottom: 1px solid;
}

#portfolio .tab-content>.tab-pane ul::after {
	content: "";
	display: block;
	clear: both;
}
#portfolio .grid-item {opacity: 1; overflow: hidden; float: left; padding: 5px 5px;}
#portfolio .grid-item figure {margin: 0; position: relative; overflow: hidden}
#portfolio .grid-item figure img {display: block; width: 100%; cursor: pointer; }
#portfolio .grid-item figure img {cursor: pointer; display: block; opacity: 1; width: 100%; transition: all 0.3s ease 0s;}
#portfolio .grid-item figcaption {bottom:0; left:0; opacity: 0; position: absolute; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; width: 100%; height: 100%; padding:45px; z-index: 1; text-align: center}
#portfolio .grid-item figure:hover .portfolio-img {transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s;}
#portfolio .grid-item figure .portfolio-img { transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s;}
#portfolio .grid-item figure:hover img { opacity: 0.15; transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s;}
#portfolio .grid-item figure:hover figcaption {opacity: 1; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s;}



/* portfolio 5 column */
#portfolio .work-5col li, .blog-grid.blog-5col li {width: 20%} 
#portfolio .work-5col li.grid-item-double, .blog-grid.blog-5col li.grid-item-double {width: 40%;}

/* portfolio 4 column */
#portfolio .work-4col li, .blog-grid.blog-4col li {width: 25%} 
#portfolio .work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double {width: 50%;}

/* portfolio 3 column */
#portfolio .work-3col li, .blog-grid.blog-3col li {width: 33.33%; float: left}
#portfolio .work-3col li.grid-item-double, .blog-grid.blog-3col li.grid-item-double {width: 66.67%;}

/* portfolio 2 column */
#portfolio .work-2col li, .blog-grid.blog-2col li {width: 50%}
#portfolio .work-2col li.grid-item-double, .blog-grid.blog-2col li.grid-item-double {width: 100%}

/* portfolio 1 column */
#portfolio .work-1col li {width: 100%}


/* hover option 5 */
#portfolio .hover-option5 .grid-item figcaption {height: 100%; padding: 20px}
#portfolio .hover-option5 .grid-item .portfolio-hover-main {transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; display: table; height: 100%; top: 0; width: 100%;}
#portfolio .hover-option5 .grid-item .portfolio-hover-box {padding: 20px;}
#portfolio .hover-option5 .grid-item:hover .portfolio-hover-box {background: rgba(0,0,0,.8)}
#portfolio .hover-option5 .grid-item .separator-line-horrizontal-medium-light2 {-webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; top:5px; width:100px}
#portfolio .hover-option5 .grid-item:hover .separator-line-horrizontal-medium-light2 {transform: translateY(-30px); -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px);}
#portfolio .hover-option5 .grid-item figure:hover img {opacity: .8}
#portfolio .hover-option5 .grid-item .portfolio-hover-box {padding: 10px;}


@media (min-width:992px) {
  /* 회사소개 */
  #about .about-transform {
    transform: translateY(20px);
  }
}

@media (max-width: 991px) {
  .html-video {
    height: 100%;
  }

	#portfolio .nav-tabs {
		margin-bottom: 60px;
	}
	#portfolio .nav-tabs>li>a {
		margin: 0 10px;
	}
}

@media (max-width: 767px) {
	
  #portfolio .nav-tabs {
		display: block;
		margin-bottom: 30px;
	}
	#portfolio .nav-tabs>li {
		width: 33.3%;
	}

	#portfolio .nav-tabs>li:not(:nth-child(-n + 3)) {
		margin-top: 8px;
	}

	#portfolio .work-4col li, .blog-grid.blog-4col li {width: 50%} 
	#portfolio .work-4col li.grid-item-double, .blog-grid.blog-4col li.grid-item-double {width: 50%;}


}