@charset "utf-8";

html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, 
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
		vertical-align: baseline;
		font-family: inherit;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		outline: 0;
		padding: 0;
		margin: 0;
		border: 0;
}


:focus {
		outline: 0;
}



::-moz-selection{background:#666;color:#fff;text-shadow:none;}
::selection{background:#666;color:#fff;text-shadow:none;}



html, body {
    margin: 0;
    height: 100%;
}

/* 스크롤 스타일 변경 */

/*
::-webkit-scrollbar {
	width: 5px; 
	height: 5px;
}

::-webkit-scrollbar-track {
	background-color: lightblue;
}

::-webkit-scrollbar-track-piece {
	background-color: #eee;
}

::-webkit-scrollbar-thumb {
	border-radius: 8px;
	background-color: #ccc;
}

::-webkit-scrollbar-button {
	background-color: #eee;
	width: 5px;
	height: 5px;
}

::-webkit-scrollbar-button:start {
	background-color: #eee; 
	border-radius: 5px 5px 0 0;
}

::-webkit-scrollbar-button:end {
	background-color: #eee; 
	border-radius: 0 0 5px 5px;
}
*/


body {
	background-color: #333;
	color: #aaa;
	-webkit-text-size-adjust: none;	
    position: relative;
    width: inherit;
    height: inherit;
    font-family: "freight-big-pro", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: .3px;

}

section.grid {
    opacity: 1;
    -webkit-transition: all .5s ease-in;
    transition: all .5s ease-in;
}
.grid {
    display: table;
    width: 75%;
    height: inherit;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
	display: block;
	box-sizing: inherit;
	transition: 0.3s;
}

.grid .sections {
    padding-right: 25%;
	transition: 0.3s;
}
.sections {
    display: table;
    width: 100%;
    height: inherit;
    margin-bottom: 70px;

}
.grid .sections .one {
    width: 25%;
	transition: 0.3s;
}
.grid .sections .two {
    width: 25%;
	transition: 0.3s;
}
.grid .sections .three {
    width: 25%;
	transition: 0.3s;
}
.grid .sections .one {
    display: table-cell;
    border-right: 1px solid #444;
	height: 100%;
}
.grid .sections .two {
    display: table-cell;
    border-right: 1px solid #444;
	height: 100%;
}
.grid .sections .three {
    display: table-cell;
    border-right: 1px solid #444;
	height: 100%;
}

.inner-wrapper {
	width: 50%;
    margin: 0 auto;
    padding: 70px 0px;
	transition: 0.3s;
}

.text1	{transition: 0.3s;
	font-size:112px;
	line-height: 80px;
	font-variant-numeric: lining-nums;
	margin: 0 0 20px;
	font-family: "freight-big-pro", sans-serif;
	font-weight: 700;
	color: #fff;
	letter-spacing: -.015em;
	transition: 0.3s;
}






.text2	{
	font-size:95px;
	line-height: 75px;
	font-variant-numeric: lining-nums;
	margin: 0 0 40px;
	font-family: "freight-big-pro", sans-serif;
	font-weight: 400;
	color: #dedede;
	letter-spacing: -.015em;

}
.text3	{
	font-size:50px;
	line-height: 50px;
	font-variant-numeric: lining-nums;
	margin: 0 0 40px;
	font-family: "freight-big-pro", sans-serif;
	font-weight: 400;
	color: #aaa;
	letter-spacing: -.015em;

}
.text4	{
	font-size:20px;
	line-height: 30px;
	font-variant-numeric: lining-nums;
	margin: 0 0 90px;
	font-family: "freight-big-pro", sans-serif;
	font-weight: 400;
	color: #aaa;
	letter-spacing: -.015em;

}
.text5	{
	font-size:12px;
	line-height: 16px;
	font-variant-numeric: lining-nums;
	margin: 0 0 0px;
	font-family: "freight-big-pro", sans-serif;
	font-weight: 400;
	color: #666;
	letter-spacing: .05em;

}

.latest .sthumb01		{width:100%;min-height:200px;margin:30px auto;}

.latest .sthumb01	ul 						{list-style:none;margin:0px 0 30px -1px;padding:0px;display: table;}
.latest .sthumb01	ul 						{*zoom:1;} /* IE5.5~7 브라우저 대응 Hack */
.latest .sthumb01	ul:after				{content: ".";display: block;height: 0;clear: both;visibility: hidden;}	
.latest .sthumb01	ul li					{float:left;padding:0px;margin:0 0px 20px 0;width:33.333%;min-height:300px;position:relative;overflow:hidden;}
.latest .sthumb01 > ul li:nth-child(2n+1)		{margin:0 0px 20px 0;clear:right;}
.latest .sthumb01 > ul li:nth-child(3n+1)		{margin:0 0px 20px 0;clear:both;}
.latest .sthumb01	ul li	img				{width:100%;height:auto;transition: 0.3s;border-top:1px solid #666;}
/*.latest .sthumb01	ul li:hover	img			{opacity:0.8;border-top:1px solid #666;}*/

.latest .sthumb01	ul li	span			{display:block;height:46px;padding:0 0 10px 0;font-size:12px;font-weight: 400;color: #aaa;letter-spacing: -.0325em;line-height: 14px;}
.latest .sthumb01	ul li	span em			{display:block;font-size:16px;font-weight: 400;color: #dedede;letter-spacing: -.015em;line-height: 20px;}




/* Mobile Device */
/*@media screen and (max-width : 768px) {*/
@media all and (max-width: 768px) {
	.text1	{
		font-size:70px;
		line-height: 50px;
		font-variant-numeric: lining-nums;
		margin: 0 0 20px;
		font-family: "freight-big-pro", sans-serif;
		font-weight: 700;
		letter-spacing: -.015em;

	}
	.inner-wrapper {
		width: 80%;
		margin: 0 auto;
		padding: 70px 0px;
	}

	.grid {
		display: table;
		width: 90%;
		height: inherit;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		display: block;
		box-sizing: inherit;
	}

	.grid .sections {
		padding-right: 10%;
	}

	.grid .sections .one {
		width: 10%;
	}
	.grid .sections .two {
		width: 40%;
	}
	.grid .sections .three {
		width: 40%;
	}

	.latest .sthumb01		{width:100%;min-height:200px;margin:30px auto;}

	.latest .sthumb01	ul 						{list-style:none;margin:0px 0 30px -1px;padding:0px;display: table;}
	.latest .sthumb01	ul 						{*zoom:1;} /* IE5.5~7 브라우저 대응 Hack */
	.latest .sthumb01	ul:after				{content: ".";display: block;height: 0;clear: both;visibility: hidden;}	
	.latest .sthumb01	ul li					{float:left;padding:0px;margin:0 0px 20px 0;width:50%;min-height:300px;position:relative;overflow:hidden;}
	.latest .sthumb01 > ul li:nth-child(2n+1)		{margin:0 0px 20px 0;clear:both;}
	.latest .sthumb01 > ul li:nth-child(3n+1)		{margin:0 0px 20px 0;clear:right;}
	.latest .sthumb01	ul li	img				{width:100%;height:auto;transition: 0.3s;border-top:1px solid #eee;}
	/*.latest .sthumb01	ul li:hover	img			{opacity:0.8;border-top:1px solid #666;}*/

	.latest .sthumb01	ul li	span			{display:block;padding:0 0 10px 0;font-size:12px;font-weight: 400;letter-spacing: -.0325em;line-height: 14px;}
	.latest .sthumb01	ul li	span em			{display:block;font-size:13px;font-weight: 400;letter-spacing: -.015em;line-height: 20px;}
}
/*https://northstreetcreative.com/notes/full-screen-website-zoom-using-css-transform-and-jquery/*/