

/* ---------------------------------------------------------------------- */
/*	Reset
/* ---------------------------------------------------------------------- */
	



a {
    margin: 0;
    padding: 0;
    font-size: 100%;
	outline: none;
	text-decoration: none;
    background: transparent;
	vertical-align: baseline;
}

a, a > * {
	text-decoration: none;
	color: #aaa;
}

a:hover {
	color: #FFCC00;
}

.not-ie a {
	-webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
			transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}

img {
    border: 0;
	height: auto;
	max-width: 100%;
	-ms-interpolation-mode: bicubic;
}

/* ---------------------------------------------------------------------- */
/*	Basic Elements
/* ---------------------------------------------------------------------- */

body {

	line-height: 1.87em;
}


	/* -------------------------------------------------- */
	/*	Clearfix
	/* -------------------------------------------------- */

	.clear {   
		clear: both;
		display: block;
		height: 0;
		overflow: hidden;
		visibility: hidden;
		width: 0;
	}
	
	.clearfix:after {
		clear: both;
		display: block;
		visibility: hidden;
		height: 0;
		content: ".";
	}
	
	/* -------------------------------------------------- */
	/*	General Classes
	/* -------------------------------------------------- */
	
	.align-center { text-align: center; }
	.align-left	  { text-align: left; }
	.align-right  { text-align: right; }
	
	.alignleft  { float: left; }
	.alignright { float: right; }

	img.alignleft  { margin-right: 20px; }
	img.alignright { margin-left: 20px; }

	.hide		{ display: none;  }
	.show		{ display: block; }
	.invisible  { visibility: hidden; }
	.affix		{ position: fixed; }

	/* -------------------------------------------------- */
	/*	Typography
	/* -------------------------------------------------- */
	
	p {
		margin: 0 0 1.5em;
		padding: 0;
		line-height: 1.87em;
	}

	.lead {
		margin-bottom: 5px;
		font-size: 20px;
	}

	h1, h2, h3, h4, h5, h6 {
		margin-bottom: 15px;
		color: #262626;
		line-height: 1.35em;
		font-weight: normal;
	}
	

	::-moz-selection {
		background-color: #f8b637;
		color: #fff;
	}

	::selection {
		background-color: #f8b637;
		color: #fff;
	}
	
	.highlight {
		padding: 0 3px;
		background-color: #FFCC00;
		color: #fff !important;
	}

	blockquote {
		font-size: 18px;
		font-style: italic;
	}
	
	blockquote.quote-text { 
		position: relative;
		padding-left: 80px; 
	}
	
	.parallax blockquote { color: #fff; }
		
	blockquote.quote-text:before {
		position: absolute;
		left: 10px;
		top: 0;
		color: #acacac;
		font-size: 100px;
		content: "“";
		line-height: 1em;
		font-style: normal;
		
		-webkit-transition: color .25s ease;
				transition: color .25s ease;
	}
	
	.parallax blockquote:before { color: #fff; }
	
		blockquote p { 
			margin-bottom: .7em;
			line-height: 2em;
		}	
		
	blockquote.type-1,
	blockquote.type-2 {
		margin-bottom: 20px;
		padding: 25px 20px 20px 80px;
	}
		
	blockquote.type-1:before,
	blockquote.type-2:before {
		left: 10px;
		top: 30px;
	}
		
	blockquote.type-1 { background-color: #ededed; }
		
	blockquote.type-2 {
		background-color: #FFCC00;
		color: #fff;
	}
	
	blockquote.type-2:before {
		color: #fff;
		color: rgba(255,255,255,.7);
	}
	
	/* -------------------------------------------------- */
	/*	Dropcap
	/* -------------------------------------------------- */	

	.dropcap::first-letter {
		display: block;
		float: left;
		margin: 10px 15px 0 0;
		color: #262626;
		font-weight: 700;
		font-size: 48px;
	}

	/* -------------------------------------------------- */
	/*	Images
	/* -------------------------------------------------- */
	
	.slide-image {
		position: relative;
		display: block;
		overflow: hidden;
		
		-webkit-backface-visibility: hidden;
	}
	
		.slide-image img {
			display: block;
			-webkit-transition: -webkit-transform .7s ease;
					transition: transform .7s ease;
		}

		.slide-image:hover img {
			-webkit-transform: scale(1.2);
					transform: scale(1.2);
		}
		
		.slide-image .curtain {
			position: absolute;
			top: -1%;
			left: -1%;
			visibility: hidden;
			width: 102%;
			height: 102%;
			background-color: #fff;
			background-color: rgba(255,255,255, .8);
			opacity: 0;  
			filter: alpha(opacity = 0);
			
			-webkit-transition: all 0.7s ease;
					transition: all 0.7s ease;
			-webkit-perspective: 400px;
					perspective: 400px;	
		}
	
		.slide-image:hover .curtain {
			visibility: visible;
			opacity: 1;
			filter: alpha(opacity = 80);
		}
		
			.ch-curtain {
				position: absolute;
				top: 50%;
				left: 50%;
				z-index: 5;
				margin: -20px 0 0 -20px;
				width: 40px;
				height: 40px;
				
				-webkit-backface-visibility: hidden;
						backface-visibility: hidden;
				-webkit-transition: all .7s ease;
						transition: all .7s ease;
				-webkit-transform-style: preserve-3d;
						transform-style: preserve-3d;
			}

			.slide-image:hover .ch-curtain {
				-webkit-transform: rotate3d(0,1,0,-180deg);
						transform: rotate3d(0,1,0,-180deg);
			}			

				.ch-curtain > div {
					display: block;
					position: absolute;
					width: 100%;
					height: 100%;
					background-color: #FFCC00;
					color: #fff;
					text-align: center;

					-webkit-transition: all .5s ease;  
							transition: all .5s ease;  
					-webkit-backface-visibility: hidden;
							backface-visibility: hidden;
				}

				.ch-curtain > div:after {
					line-height: 40px;
				}
				
				.slide-image.link-icon .ch-curtain > div:after {
					content: '\e9ad';
					font-size: 20px;
				}

				.slide-image.plus-icon .ch-curtain > div:after {
					content: '\ec72';
					font-size: 21px;
				}

				.ch-curtain .ch-back {
					-webkit-transform: rotate3d(0,1,0,180deg);
							transform: rotate3d(0,1,0,180deg);
				}

	.single-image {
		display: block;
		-webkit-backface-visibility: hidden;
	}
	
		.item-overlay .single-image {
			position: absolute;
			z-index: 5;
			bottom: 30px;
			display: block;
			width: 40px;
			height: 40px;
			border: 1px solid #fff;
			text-align: center;
			background-color: transparent;

			-webkit-transition: all .3s ease;
					  transition: all .3s ease;  
		}
		
		.single-image.plus-icon { right: 75px; }
		.single-image.link-icon { right: 30px; }
		
		.item-overlay .single-image:hover { background-color: #fff; }
		
		.item-overlay .single-image:after {
			position: absolute;
			top: 0;
			left: 0;
			display: block;
			width: 100%;
			height: 100%;
			color: #fff;
			text-align: center;
			font-size: 21px;
			line-height: 40px;
			
			-webkit-border-radius: 50%;
					border-radius: 50%;
			-webkit-transition: all .3s ease;
					transition: all .3s ease;  					
		}
		
		.single-image.plus-icon:after  { content: '\ec72'; }
		.single-image.link-icon:after  { content: '\e9ad'; font-size: 20px; }
		
		.item-overlay .single-image:hover:after { color: #f5633f; }
		
	/* -------------------------------------------------- */
	/*	Dividers
	/* -------------------------------------------------- */
	
	.divider {
		margin: 40px auto;
		width: 22%;
		height: 1px;
		text-align: center;
		background-color: #e8e8e8;
	}
	
	.dark-footer .divider { background-color: #3a3a3a; }
	
	.separator {
		margin: 65px auto;
		width: 100%;
		height: 1px;
		background-color: #e8e8e8;	
	}	
	

	


/* ---------------------------------------------------------------------- */
/*	Portfolio
/* ---------------------------------------------------------------------- */

	/* -------------------------------------------------- */
	/*	Portfolio Filter
	/* -------------------------------------------------- */
	
	.filter-container { text-align: center; }

		.portfolio-filter {
			display: inline-block;
			margin-bottom: 45px;
			font-size: 0;
		}

			.portfolio-filter li {
				display: inline-block;
				vertical-align: top;
			}

				.portfolio-filter li a {
					display: block;
					margin: 1px;
					padding: 3px 10px;
					text-transform: uppercase;
					font-weight: 400;
					font-size: 15px;
					cursor: pointer;
					-webkit-transition: background-color .35s ease;
							transition: background-color .35s ease;
				}

				.portfolio-filter li:hover a,
				.portfolio-filter .active {
					background-color: #FFCC00;
					text-decoration:none;
					color: #fff;
				}
		
	/* -------------------------------------------------- */
	/*	Portfolio Items
	/* -------------------------------------------------- */
	
	.portfolio-items { 
		width: 100%;
		font-size: 0; 
	}
	
		.portfolio-items article {
			position: relative;
			display: inline-block;
			padding: 0px;

			width: 25%;
			vertical-align: top;
		}
		
		.portfolio-items.col-3 article { width: 33.33333333333333%; }
		.portfolio-items.col-4 article { width: 25%; }
		.portfolio-items.col-5 article { width: 20%; }
		.portfolio-items.col-6 article { width: 16.666666666666664%; }
		
		.portfolio-items.list article { width: 100%; }
		
		.portfolio-items .mix { display: none; }
		
				.portfolio-items img { display: block; }

			.portfolio-paging {
				position: relative;
				width: 100%;
				line-height: 60px;
				text-align: center;
				background-color: #efefef;;
				
				-webkit-transition: background-color .25s ease;
						transition: background-color .25s ease;
			}	
			
			.portfolio-paging:hover { background-color: #FFCC00; }

				.portfolio-paging .load-more {
					display: block;
					color: #262626;
					text-transform: uppercase;
					font-weight: 500;
					font-size: 13px;
					
					-webkit-transition: color .25s ease;
							transition: color .25s ease;
				}
				
				.portfolio-paging:hover .load-more { color: #fff; }
				
		.work-item {
			position: relative;
			overflow: hidden;
			z-index: 5;
			
			-webkit-backface-visibility: hidden;
			   -moz-backface-visibility: hidden;
					backface-visibility: hidden;
		}

			.item-overlay {
				position: absolute;
				display: none;
				width: 100%;
				height: 100%;
				background-color: #FFCC00;
				background-color: rgba(255,204,0, .95);
			}
			
				.item-overlay .extra-content {
					position: relative;
					overflow: hidden;
					display: table;
					padding: 30px;
					width: 100%;
					height: 100%;
				}

					.extra-title  {
						margin-bottom: 0;
						color: #fff;
						font-weight: 500;
						font-size: 17px;
						text-transform: uppercase;
						word-spacing: 1px;
					}
					
					.container .portfolio-items.col-4 .extra-title { font-size: 15px; }

					.extra-category {
						font-family: 'Noto Sans KR', sans-serif !important;
						letter-spacing:-1px !important;
						margin-bottom: 0;
						color: #FCEFB0;
						font-size: 12px;
						font-weight: 200;
					}

	/* -------------------------------------------------- */
	/*	Portfolio Single
	/* -------------------------------------------------- */
	
	.project-single-entry  { margin-bottom: 40px; }
	
		.project-single-entry + .tabs-holder { margin-bottom: 60px; }
	
		.project-page-header {
			position: relative;
			margin-bottom: 55px;
		}

			.project-page-header .project-title {
				padding-right: 115px;
				color: #5b5e60;
				font-weight: 100;
				font-size: 60px;
				text-transform: uppercase;
			}


.portstyle001 {font-family: 'Noto Sans KR', sans-serif !important; color:#FEFAE6 !important; font-size:23px !important; font-weight:400 !important; letter-spacing:-1px !important; line-height:30px !important; }
