@CHARSET "UTF-8";

body.is-open{position: fixed; top: 0; left:0; width:100%; overflow: hidden;}
.hidden{position: absolute; left: -10000px;	top: auto; width: 0; height: 0; overflow: hidden;}
.hide_txt{text-indent: -9999px; font-size: 0;}
.clearfix:after{display:block; clear:both; content:'';}
.m_block, .mt_block, .ms_block{display:block;}	
.ms_none{display: none;}
.txt_center{text-align:center;}
.txt_left{text-align:left;}
.txt_right{text-align:right;}
.rel{position:relative;}
.ib{display:inline-block;}
.db{display: block;}
.tc{display:table-cell; vertical-align:middle;}
.mt_f_left{float:left;}
.f_left{float:left;}
.f_right{float:right;}
.wbka{word-break:keep-all;}

.white{color:#fff;}
.gray{color: #666;}
.gray2{color: #4d4d4f;}
.gray3{color: #6d6e71;}

.black{color: #000;}
.black2{color: #010101;}
.orange{color: #ed963a;}
.pink{color: #f65e7c;}
.red{color:#ce0310;}
.lightgreen{color: #9ec387;}
.bg_gray{background: #e5e5e5;}
.bg_white{background: #fff;}

.fw100{font-weight:100;}
.fw200{font-weight:200;}
.fw300{font-weight:300;}
.fw400{font-weight:400;}
.fw500{font-weight:500;}
.fw600{font-weight:600;}
.fw700{font-weight:700;}

.lh13{line-height: 1.538em;} /* 13px 20px */
.lh17{line-height:2.118em !important;}/* 17px 36px */
.lh17_ver2{line-height: 1.588em;} /* 17px 27px */
.lh17_ver3{line-height: 1.765em;} /* 17px 30px */
.lh30{line-height:1.2em !important;}/* 30px 36px */

/* font-size */
.header .fs20,.sitemap .fs20{font-size: 3.75vw;} /* 24px */
.header .fs22,.sitemap .fs22{font-size: 4.0625vw;} /* 26px */
.main .fs68{font-size: 6.25vw;} /* 40px */
.fs12{font-size: 3.125vw;} /*20px*/
.fs12_76{font-size: 3.125vw;} /*20px*/
.fs13{font-size: 3.125vw;} /*20px*/
.fs14{font-size: 3.28125vw;} /*21px*/
.fs15{font-size: 2.96875vw;} /* 19px */
.fs15_ceo{font-size:2.96875vw;}
.fs16{font-size: 3.125vw;} /* 20px */
.fs17{font-size: 3.28125vw;} /* 21px */
.fs18{font-size: 3.4375vw;} /* 22px */
.fs18_43{font-size: 3.59375vw;} /* 23px */
.fs20{font-size: 3.75vw;} /* 24px */
.fs22{font-size: 4.0625vw;} /* 26px */
.fs26{font-size: 4.6875vw;} /* 30px */
.fs28{font-size: 5vw;} /* 32px */
.fs25{font-size:3.90625vw;}/* 25px */
.fs30{font-size: 5.3125vw;} /* 34px */
.fs35{font-size: 5.46875vw;}
.fs40{font-size: 6.875vw;} /* 44px */
.fs50{font-size: 8.4375vw;} /* 54px */
.fs70{font-size: 11.5625vw;} /* 74px */

/* 간격 */
.m_pt100{padding-top:15.625vw;}
.sub_cont.mt120{margin-top: 18.75vw;}	
.ideas .pb90{padding-bottom: 14.0625vw;}
.pt13{padding-top: 2.03125vw;}
.pt60{padding-top: 9.375vw;}
.pt65{padding-top: 10.15625vw !important;}
.pt100{padding-top: 15.625vw;}
.pb18{padding-bottom: 2.8125vw;}
.pb40{padding-bottom: 6.25vw;}
.pb53{padding-bottom: 8.28125vw;}
.pb60{padding-bottom: 9.375vw;}
.pb66{padding-bottom: 10.3125vw;}
.pl20{padding-left: 3.125vw;}
.mt5{margin-top: 0.78125vw;}
.mt13{margin-top: 2.03125vw;}
.mt15{margin-top: 2.34375vw;}
.mt20{margin-top: 3.125vw;}
.mt24{margin-top: 3.75vw;}
.mt30{margin-top: 4.6875vw;}
.mt45{margin-top: 7.03125vw;}
.mt57{margin-top: 8.90625vw;}
.mt80{margin-top: 12.5vw;}

.inner{
	margin-left:3.90625vw;
	margin-right:3.90625vw;
}

/* header */
.header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:18.75vw;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	z-index:100;
	background-image: linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
}
.header .inner {
	margin-left: 4.6875vw;
    margin-right: 4.6875vw;
}
.header.active{background-color:#fff;}
.header .logo{
	position:absolute;
	top:6.40625vw;
	left:0;
	width:39.0625vw ;/* 250px */
}
.header .logo a{
	display:block;
	width:100%;
	height:100%;
}
.header .logo a img{width:100%;}
.header .bg {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.7;
    z-index: 9998;
}
.header .bg.on{display: block;}
#siteMapOp{ 
	position:absolute;
	top:6.875vw;
	right:0;
}
#siteMapOp span{
	display:block;
	position:relative;
    width:5.78125vw;
    height:0.625vw;
    margin-bottom:1.25vw;
    background-color:#000;
}
#siteMapOp span.mb0{margin-bottom:0;}
#sitemap{
    position:fixed;
    top:0;
	right:-100%;
	width:55%;
	height:100%;
	background-color: #fff;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
    -webkit-transform: translate(100%, 0);
    -moz-transform: translate(100%, 0);
    transform: translate(100%, 0);
    -webkit-transition: all 0.4s cubic-bezier(0.5, 0, 0, 1);
	-o-transition: all 0.4s cubic-bezier(0.5, 0, 0, 1);
	-moz-transition: all 0.4s cubic-bezier(0.5, 0, 0, 1);
	transition: all 0.4s cubic-bezier(0.5, 0, 0, 1);
	z-index: 500;
}
#sitemap.on{
	right:0;
	-webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    transform: translate(0,0);
	-webkit-transition: 0.4s ease;
	-o-transition: 0.4s ease;
    -moz-transition: 0.4s ease;
    transition: 0.4s ease;
	z-index: 2000;
}
#sitemap .sitemap_wrap{
    height:100%;
/*    overflow-y: scroll;*/
	-webkit-overflow-scrolling:touch;
}
#sitemapHead{
	position:relative;
	height:18.75vw;
}
#sitemapHead .sitemap_cls{
	position:absolute;
    top:6.5625vw;
    right:0.46875vw;
    width:5vw;
    height:5vw;
}
#sitemapHead .sitemap_cls:before,
#sitemapHead .sitemap_cls:after{
	display:block;
	position:absolute;
	top:2.34375vw;
	left:-0.78125vw;
	width:6.5625vw;
	height:0.625vw;
	background:#434343;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	content:'';
}
#sitemapHead .sitemap_cls:after{
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
}
#sitemapBody{
	height:calc(100% - 18.75vw);
}
#sitemapBody .gnb .tit{
	display:block;
	position:relative;
	padding:4.0625vw 4.6875vw;
	color:#222;
}
#sitemapBody .gnb .tit.on{color: #e9254c;}
#sitemapBody .gnb .tit:before,
#sitemapBody .gnb .tit:after{
	display:block;
	position:absolute;
	top:5.3125vw;
	right:4.6875vw;
	width:4.0625vw; /*26px*/
	height:0.3125vw;
	background:#434343;
	content:'';
}
#sitemapBody .gnb .tit.ess:before,
#sitemapBody .gnb .tit.ess:after{display: none;}
#sitemapBody .gnb .tit:after{
	transform:rotate(90deg);
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-o-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	transition: all .3s ease;
}
#sitemapBody .gnb .tit.on:before{display: none;}
#sitemapBody .gnb .tit.on:after{
	background: #e9254c;
	transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	-ms-transform:rotate(180deg);
}
#sitemap .sub_menu{
	padding: 2.8125vw 0;
	display:none;
	background-color:#f0f0f0;
	overflow: hidden;
    -webkit-transition: max-height 0.4s ease-out;
    -moz-transition: max-height 0.4s ease-out;
    -ms-transition: max-height 0.4s ease-out;
    transition: max-height 0.4s ease-out;
}
#sitemap .sub_menu li a{
	display:block;
	padding:0 4.6875vw;
	color:#666;
	line-height:2.5em;
}
#gnb{display:none;}
.sub_header .header{
	background: #fff;
	z-index: 1000;
}

/* footer */
.footer{
	padding: 3.125vw 0;
	background: #333;
	color: #9b9b9b;	
	text-align: center;
}
.footer .txt_wrap{line-height: 1.429em;}
.footer ul li:first-child{margin-right: 1.5625vw;}
.footer ul li a{
	cursor: text; 
	color: #9b9b9b !important;
}


@media screen and (min-width: 420px){
	.ms_block{display:none;}	
	.ms_none{display: inline-block;}
	
	
}
@media screen and (min-width: 768px){
	.m_block{display:none;}
	.t_block{display:block;}
	.ts_block{display:block;}
	.tpc_f_left{float:left;}
	.tpc_f_right{float:right;}

	.inner{
		margin-left:21.875px;
		margin-right:21.875px;
	}

	/* font-size */
	.header .fs20,.sitemap .fs20{font-size: 20px;}
	.header .fs22,.sitemap .fs22{font-size: 22px;}
	.main .fs68{font-size: 40px;}
	.fs12{font-size: 14px;}
	.fs12_76{font-size: 15px;}
	.fs13{font-size: 16px;}
	.fs14{font-size: 18px}
	.fs15{font-size: 19px;} /* 19px */
	.fs15_ceo{font-size: 20px;} /* 16px */
	.fs16{font-size: 20px;} /* 20px */
	.fs17{font-size: 17px;}
	.fs18{font-size: 22px;} /* 22px */
	.fs18_43{font-size: 23px;} /* 23px */
	.fs20{font-size: 24px;} /* 24px */
	.fs22{font-size: 26px;} /* 26px */
	.fs26{font-size: 30px;}
	.fs28{font-size: 32px;} /* 32px */
	.fs30{font-size: 34px;} /* 34px */
	.fs35{font-size: 35px;}
	.fs40{font-size: 44px;} /* 44px */
	.fs50{font-size: 54px;}
	.fs70{font-size: 74px;} /* 74px */
	.fs22{font-size: 22px;}
	.fs35{font-size: 35px;}
	.fs55{font-size: 55px;}

	/* 간격 */
	.m_pt100{padding-top:85px;}
	.sub_cont.mt120{margin-top: 120px;}	
	.sub.ideas #section02 .pt60{padding-top: 15px;}
	.ideas .pb90{padding-bottom: 76px;}
	.pt13{padding-top: 11px;}
	.pt60{padding-top: 51px;}
	.pt65{padding-top: 65px !important;}
	.pt100{padding-top: 85px;}
	.pb18{padding-bottom: 15px;}
	.pb40{padding-bottom: 32px;}
	.pb53{padding-bottom: 45px;}
	.pb60{padding-bottom: 51px;}
	.pb66{padding-bottom: 52px;}
	.pl20{padding-left: 16px;}
	.mt5{margin-top: 4px;}
	.mt13{margin-top: 11px;}
	.mt15{margin-top: 13px;}
	.mt20{margin-top: 17px;}
	.mt24{margin-top: 20px;}
	.mt30{margin-top: 25px;}
	.mt45{margin-top: 36px;}
	.mt57{margin-top: 45px;}
	.mt80{margin-top: 68px;}

	/* header */
	.header{height:120px;}
	.header .logo{
		top:44px;
		width:250px;
	}	
	.header .inner {
		margin-left: 30px;
		margin-right: 30px;
	}
	
	#siteMapOp{top:44px;}
	#siteMapOp span{
		width:37px;
		height:4px;
		margin-bottom:8px;
	}
	#sitemap{padding-bottom:50px;}
	#sitemapHead{height:120px;}
	#sitemapHead img{
		width:163px;
		margin-top:41px;
	}
	#sitemapHead .sitemap_cls{
		top:42px;
		right:3px;
		width:32px;
		height:32px;
	}
	#sitemapHead .sitemap_cls:before,
	#sitemapHead .sitemap_cls:after{
		top:15px;
		left:-5px;
		width:42px;
		height:2px;
	}
	#sitemapBody{height:calc(100% - 50px);}
	#sitemapBody .gnb .tit{padding:26px 30px;}	
	#sitemapBody .gnb .tit:before,
	#sitemapBody .gnb .tit:after{
		top:32px;
		right:30px;
		width:26px;
		height:2px;
	}
	#sitemap .sub_menu{
		padding:18px 0;
	}
	#sitemap .sub_menu li a{padding:0 30px;}
	#sitemap .sub_menu li a.works_last{color:#a8cb38;}

	/* footer */
	.footer {
		padding: 20px 0;
		text-align: left;	
	}	
	.footer .inner{
		position: relative;
		width: 559px;
		padding-left: 111px;
		margin-left: auto;
		margin-right: auto;
	}
	.footer ul li:first-child{margin-right: 10px;}
	.footer .footer_tit{
		position: absolute;
		top: 0; left: 0;
	}
	
}

@media screen and (min-width: 1024px){
	.mt_block, .ts_block{display:none;}
	.tb_block, .tpc_block{display:block;}
	.fs15_ceo{font-size: 15px;}
	.mt_f_left{float:initial;}
	.tbpc_f_left{float:left;}
	.tbpc_f_right{float:right;}

	/* 간격 */	
	.m_pt100{padding-top:0;}
	.ideas .pb90{padding-bottom: 40px;}
}

@media screen and (min-width: 1280px){
	.t_block, .tb_block{display:none;}
	.pc_block{display:block;}
	.pc_f_left{float:left;}
	.pc_f_right{float:right;}

	/* 간격 */		
	.sub.ideas #section02 .pt60{padding-top: 60px;}
	.ideas .pb90{padding-bottom: 60px;}
	.pt13{padding-top: 13px;}		
	.pt60{padding-top: 60px;}
	.pt100{padding-top: 25px;}
	.pb18{padding-bottom: 18px;}
	.pb40{padding-bottom: 40px;}
	.pb53{padding-bottom: 53px;}
	.pb60{padding-bottom: 60px;}
	.pb66{padding-bottom: 66px;}
	.pl20{padding-left: 20px;}
	.mt5{margin-top: 5px;}
	.mt13{margin-top: 13px;}
	.mt15{margin-top: 15px;}
	.mt20{margin-top: 20px;}
	.mt24{margin-top: 24px;}
	.mt30{margin-top: 30px;}
	.mt45{margin-top: 45px;}
	.mt57{margin-top: 57px;}
	.mt80{margin-top: 80px;}


	.inner{
		width:1200px;
		margin-left:auto;
		margin-right:auto;
	}

	/* font-size */
	.main .fs68{font-size: 68px;}
	.fs12{font-size: 12px;}
	.fs12_76{font-size: 12.76px;}
	.fs13{font-size: 13px;}
	.fs14{font-size: 14px}
	.fs15{font-size: 15px;}
	.fs15_ceo{font-size: 14px;}
	.fs16{font-size: 16px;}
	.fs17{font-size: 17px;}
	.fs18{font-size: 18px;}
	.fs18_43{font-size: 18.43px;}
	.fs20{font-size: 20px;}
	.fs22{font-size: 22px;}
	.fs25{font-size: 25px;}	
	.fs26{font-size: 26px;}
	.fs28{font-size: 28px;}	
	.fs30{font-size: 30px;}
	.fs40{font-size: 40px;}
	.fs50{font-size: 50px;}
	.fs70{font-size: 70px;}

	/* header */
	#siteMapOp, #sitemap{display:none;}
	/*.header:after{
		content:'';
		position: absolute;
		top: 0;left: 0;
		width: 100%;
		height: 315px;
		z-index: -1;	
		background-image: linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 100%);
	}*/
	.header .inner {
		margin-left: auto;
		margin-right: auto;
	}
	.header .logo{
		top:51px;
		width:232px;
	}
	
	.pc_pl17 .header{padding-left:17px;}
	#gnb{
		display:block;
		width:898px;
		margin-left:304px;
		height: 120px;
	}
	#gnb>ul>li{
		float:left;
		position:relative;
		padding-right: 108px;
		/* padding:0 54px; */
		height: 82px; /* 120px에서 bg가 겹쳐져서 조절 */
	}
	#gnb>ul>li>a{
		color:#424242;
		line-height:120px; 
		padding-left:5px;
	}
	#gnb>ul>li.ess_link{
		padding-right: 0;
		margin-left: 10px;
		height: 73px;
		border-bottom: 3px solid #82b364;
	}
	#gnb>ul>li.ess_link>a{
		padding-left: 0px;
	}
	#gnb>ul>li.ess_link>a i{font-size: 17px;}
	#gnb .lnb{
		display:none;
		position:absolute;
		top:82px;
		left: 0;
		width:100%;
		height: 241px;
		overflow: hidden;
		background-color:rgba(0,0,0,.2);
	}
	#gnb .lnb:after{
		position: absolute;
		bottom: -70px; left: 0;
		width: 100%;
		height: 70px;
		content:'';
		background: rgba(0,0,0,.2);

	}
	#gnb .lnb li a{
		display:block;
		width:100%;
		height:100%;
		color:#fff;
		line-height:30px;
		padding-left: 5px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#gnb .lnb li a:hover{
		background: rgba(0,0,0,.55)
	}
	#gnb .lnb li a.works_last{
		color:#82b364;
		font-weight:600;
	}
	
	/* footer */
	.footer .inner{
		width: 448px;
		padding-left: 88px;
	}
	
}

@media screen and (min-width: 1440px){
	.sub .sub_cont .inner{padding-left: 306px;}
	.sub .fade_bg_white{padding: 20px;}
	.sub.work .work_slick{width: 100%;}
	.sub.location .location_img{width: 100%;}
	.ideas .pb90{padding-bottom: 90px;}
	.pt100{padding-top: 100px;}
}