@charset "utf-8";

@import url("normalize.css");
@import url("fonts.css");


/* COMPANY - 스크립터 추가분 */

.companyProfile .profileList ul li ol li {padding: 5px 0 0 0;}
ol.digits {height:75px;margin-bottom:6px;overflow:hidden;}
.digits > li {float:left;padding:0}
.cou-item > ol { width: width:45px;}
.cou-item > ol > li {color: #fff; font-size: 90px; line-height: 1; font-family: 'Kepler Regular';padding:0;width:46px;height:77px;}
/* float 해제 */
.clear {display: inline-block;}
.clear:after {content: *.*;	height:0; visibility:hidden; display:block;	clear:both;}
* html .clear {	height:1%;}

/* //COMPANY - 스크립터 추가분 */


html, body, div, p, h1, h2, h3, h4, h5, h6, ol, ul, li, dl, dt, dd, section, article, main, footer, header, nav, button {margin:0; padding:0;}
ol, ul, li {list-style-type:none;}
h1, h2, h3, h4, h5, h6, strong {font-weight:normal;}
em {font-style:normal;}

html, body {width:100%; height:100%; font-family: 'Helvetica Roman', sans-serif; line-height:1.3;}
a {text-decoration:none;}
button {margin:0; padding:0; border:0; background:none; cursor:pointer;}

.wrap {height:100%;}
.blind {position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}


/* ###### default PC1 1280~ ###### */

.height320 { display: none; }


/* header */
.header {position:fixed; width:100%; z-index:200;}
.header .logo {display:block; position:absolute; left:30px; top:30px; width:164px; height:65px; background:url(images/logo.png) no-repeat center; z-index:205; transition:all .5s;}

.mainHeader {position:fixed; width:100%; z-index:200;}
.mainHeader .logo {display:block; position:absolute; left:30px; top:30px; width:164px; height:65px; background:url(images/logo.png) no-repeat center; z-index:205; transition:all .5s;}

/* hamburger menu */
.hamburger {position:absolute; top:18px; right:17px; width:54px; height:54px; padding-top:17px; z-index:205; box-sizing:border-box; transition:all .5s;}
.hamburger .line{
	width: 28px;
	height: 2px;
	background-color: #fff;
	display: block;
	margin: 7px auto 0;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.hamburger .line:first-child{
	margin-top:0;
}

.hamburger:hover{
	cursor: pointer;
}

.hamburger.is-active .line:nth-child(2){
	opacity: 0;
}

.hamburger.is-active .line:nth-child(1){
	-webkit-transform: translateY(9px) rotate(45deg);
	-ms-transform: translateY(9px) rotate(45deg);
	-o-transform: translateY(9px) rotate(45deg);
	transform: translateY(9px) rotate(45deg);
}

.hamburger.is-active .line:nth-child(3){
	-webkit-transform: translateY(-9px) rotate(-45deg);
	-ms-transform: translateY(-9px) rotate(-45deg);
	-o-transform: translateY(-9px) rotate(-45deg);
	transform: translateY(-9px) rotate(-45deg);
}

.header.active .logo { opacity: 0; width: 0px; height: 0px; overflow: hidden;}
.header.active .hamburger {top:30px; background:#333;}


/* gnb */
.gnbLayer {display:none; position:fixed; top:0; bottom:0; left:0; right:0; width:100%; height:100%; z-index:200; background:#fff;}
/*.gnbLayer .textLink {position:absolute; right:77px; top:33px; font-family:'Helvetica Bold'; font-size:11px; color:#e9ecef;}*/
.gnbLayer nav {height:100%;}
.gnb {overflow:hidden; height:100%;}
.gnb li {position:relative; float:left; overflow:hidden; width:25%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover;}
.gnb li:after {display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; z-index:10; background-repeat:no-repeat; background-position:center; background-size:cover; opacity:0; transition:opacity .3s;}
.gnb li.menu1 {background-image:url(images/bg_gnb1.jpg);}
.gnb li.menu2 {background-image:url(images/bg_gnb2.jpg);}
.gnb li.menu3 {background-image:url(images/bg_gnb3.jpg);}
.gnb li.menu4 {background-image:url(images/bg_gnb4.jpg);}
.gnb li.menu1:after {background-image:url(images/bg_gnb1_on.jpg);}
.gnb li.menu2:after {background-image:url(images/bg_gnb2_on.jpg);}
.gnb li.menu3:after {background-image:url(images/bg_gnb3_on.jpg);}
.gnb li.menu4:after {background-image:url(images/bg_gnb4_on.jpg);}
.gnb li:hover:after {opacity:1;}
.gnb li a {display:block; width:100%; height:100%; position:relative; font-family:'Kepler Regular'; font-size:50px; line-height:1; color:#aaa; vertical-align:middle; text-align:center; z-index:20;}
.gnb li a .textWrap {display:block; width:100%; height:100px; position:absolute; top:50%; margin-top:-70px; text-align:center;}
.gnb li em {font-family:'Helvetica Bold'; font-size:13px; color:#9d8c4a;}
.gnb li strong {display:block;}
.gnb li a:hover, .gnb li a:hover em {color:#fff;}





/* lnb : indicator */
.lnb {position:fixed; top:50%; right:0; z-index:100; display:none; z-index: 101;}
.lnb li {position:relative; margin:15px 0; padding:0 20px 0 40px; font-size:13px; color:#fff;}
.lnb li .numWrap {position:absolute; top:50%; right:0; width:0; height:16px; margin-top:-8px; overflow:hidden; transition:all .3s;}
.lnb li .num1 {display:block; width:71px; position:absolute; top:0; right:0;}
.lnb li .num1:after {content:''; width:51px; position:absolute; top:50%; right:0; margin-top:-1px; border-top:1px solid #fff;}
.lnb li a { display:block; }
.lnb li .num2 {display:block; width:71px; position:absolute; top:0; right:0; color: #48871f; }
.lnb li .num2:after {content:''; width:51px; position:absolute; top:50%; right:0; margin-top:-1px; border-top:1px solid #48871f;}

.lnb li a span { position: absolute; top: auto; bottom: 0; right: 21px; width: 10px; height: 0%; transition:all .4s; overflow: hidden; }
.lnb li a span.rvs { top: 0; bottom: auto; }

.lnb li.on .numWrap {padding-left:71px;}
.lnb li.on a span { height: 100%; top: 0; bottom: auto; transition:all .5s; }
.lnb li.onRvs .numWrap {padding-left:71px;}
.lnb li.onRvs a span { height: 100%; top: auto; bottom: 0; transition:all .5s; }


/* common */
.subCont {background-repeat:no-repeat; background-position:center; background-size:cover;}
.contents {max-width:1140px; height:100%; margin:0 auto;}
.vMiddle {height:100%;}
.vMiddle:before {content: ""; display: inline-block; width: 1px; height: 100%; margin:0 0 0 -6px; vertical-align: middle;}
.vMiddle .inner {display:inline-block; width:100%; vertical-align:middle;}
.intro {text-align:center;}
.intro .head {margin-bottom:60px; font-family:'Kepler Regular'; font-size:120px; line-height:.4; color:#fff;}
.intro .para {font-size:25px; line-height:1.44; color:#fff;}
.intro .para span { display: block; }

.kepItBold {font-family:'Kepler Bold It';}
small, sub {font-size:100%;}
.subHead strong {font-family:'Helvetica Bold'; font-size:28px;display:block}
.subHead small {display:block; margin-bottom:4px; font-size:16px;}

.pager {overflow:hidden; clear: both; }
.pager a {display:block; float:left; position:relative; width:50%; height:319px; background-repeat:no-repeat; background-position:center; text-align:center; box-sizing:border-box; background-size:cover;}
/*
.pager a.btnPrev {background-image:url(images/bg_pager_prev.jpg);}
.pager a.btnNext {border-left:1px solid #2f2f2f; background-image:url(images/bg_pager_next.jpg);}
*/

.pager a.companyPager {background-image:url("images/pager/bg_pager_company.jpg");}
.pager a.valuePager {background-image:url("images/pager/bg_pager_value.jpg");}
.pager a.portfolioPager {background-image:url("images/pager/bg_pager_portfolio.jpg");}
.pager a.teamPager {background-image:url("images/pager/bg_pager_team.jpg");}


.pager .pageName {display:block; position:absolute; top:50%; left:0; width:100%; margin-top:-40px; font-size:70px; line-height:64px; color:#d7d7d7; line-height:1;}
.pager .pageName small {display:block; font-family:'Helvetica Bold'; font-size:13px; color:#9d8c4a;}
.pager .pageName span {font-family:'Kepler Regular';}
.pager .prev, .pager .next {display:block; position:absolute; bottom:-45px; left:50%; width:38px; margin-left:-30px; font-size:12px; line-height:21px; color:#999;}

.pager .prev {padding-left:22px; background:url(images/ico_pager_prev.gif) no-repeat left 6px; text-align:left;}
.pager .next {padding-right:22px; background:url(images/ico_pager_next.gif) no-repeat right 6px; text-align:right;}

.footer {background:#222;}
.copyright {height:60px; padding:20px 0 0; background:#222; font-size:14px; color:#4f4f4f; text-align:center; box-sizing:border-box;}

.toTop { display: none; position: fixed; right: 17px; bottom: 17px; z-index: 100; transition:all .5s; }
.toTop span { display: block; width: 54px; height: 54px; text-indent: -9999em; background: url("images/goToTop.png") no-repeat 0 0; }

/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {
	/*.gnbLayer .textLink {display:block; position:static; height:43px; line-height:43px; background:#222; font-size:9px; color:#999; text-align:center;}*/
	/*
	.gnbLayer nav {background:#222;}
	.gnb li {float:none; width:100%; height:25%;}
	.gnb li:after {display:none;}
	.gnb li.menu1 {background-image:url(images/mobile/bg_gnb1.jpg);}
	.gnb li.menu2 {background-image:url(images/mobile/bg_gnb2.jpg);}
	.gnb li.menu3 {background-image:url(images/mobile/bg_gnb3.jpg);}
	.gnb li.menu4 {background-image:url(images/mobile/bg_gnb4.jpg);}
	.gnb li a {font-size:25px;}
	.gnb li a .textWrap {height:auto; margin-top:-12px;}
	.gnb li em {font-size:7px;}
	*/

	.intro .head {font-size:100px;}
	.intro .para {font-size:18px;}

	.contents {max-width:none; padding: 0 20px;}

	.pager a.companyPager {background-image:url("images/pager/bg_pager_company_s.jpg");}
	.pager a.valuePager {background-image:url("images/pager/bg_pager_value_s.jpg");}
	.pager a.portfolioPager {background-image:url("images/pager/bg_pager_portfolio_s.jpg");}
	.pager a.teamPager {background-image:url("images/pager/bg_pager_team_s.jpg");}

}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {
	.header .logo {left:20px; top:20px; width:159px; height:62.5px; background-image:url(images/mobile/logo.png); background-size:159px auto; z-index:200;}
	.mainHeader .logo {left:20px; top:20px; width:159px; height:62.5px; background-image:url(images/mobile/logo.png); background-size:159px auto; z-index:200;}
	.hamburger {right:20px; top:28px;}
	.hamburger .line {width:24px;}
	.lnb {display:none;}

	.intro .head {font-size:80px;}
	.intro .para {font-size:15px; line-height:20px;}
	.intro .para span { display: inline; }
	.contents {padding: 0; margin:0 20px;}

	.subHead {font-size:23px;}
	.subHead small {font-size:12px;}
	
	.pager a {height:145px;}

	.pager .pageName {font-size:32px; line-height:27px;}
	.pager .pageName small {font-size:9px;}
	.pager .prev, .pager .next {bottom:-23px; width:38px; margin-left:-30px; font-size:9px; line-height:13px;}
	.pager .prev {background:url(images/mobile/ico_pager_prev.png) no-repeat left 3px; background-size:13px auto;}
	.pager .next {background:url(images/mobile/ico_pager_next.png) no-repeat right 3px; background-size:13px auto;}

	.copyright {height:55px; font-size:11px;}

}
/* ###### default 320 ###### */
@media (max-width: 320px) {
	.header .logo {left:12px; top:12px; width:100px; height:40px; background-image:url(images/mobile/logo.png); background-size:100px auto; z-index:200;}
	.mainHeader .logo {left:12px; top:12px; width:100px; height:40px; background-image:url(images/mobile/logo.png); background-size:100px auto; z-index:200;}
	.hamburger {right:12px; top:12px;}
}
@media all and (orientation:landscape) and (max-width: 1023px) { 
	.height320.on { display: table; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #0b6d3a url("images/height320.jpg") no-repeat center 50%; background-size: cover;  z-index: 1000;  }
	.height320.on h1 { background: url("images/logo.png") no-repeat 0 0; background-size: cover; width: 140px; height: 55px; position: absolute; top: 15px; left: 15px; text-indent: -9999em; overflow: hidden; display: block;}
	.height320.on p { display: table-cell; vertical-align: middle; color: #fff; text-align: center; font-family: "Kepler Regular"; font-size: 70px; }


} 





/* 가로모드 */
@media all and (orientation:landscape) { 
	/* gnb */
	.gnbLayer {display:none; position:fixed; top:0; bottom:0; left:0; right:0; width:100%; height:100%; z-index:200; background:#fff;}
	/*.gnbLayer .textLink {position:absolute; right:77px; top:33px; font-family:'Helvetica Bold'; font-size:11px; color:#e9ecef;}*/
	.gnbLayer nav {height:100%;}
	.gnb {overflow:hidden; height:100%;}
	.gnb li {position:relative; float:left; overflow:hidden; width:25%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover;}
	.gnb li:after {display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; z-index:10; background-repeat:no-repeat; background-position:center; background-size:cover; opacity:0; transition:opacity .3s;}
	.gnb li.menu1 {background-image:url(images/bg_gnb1.jpg);}
	.gnb li.menu2 {background-image:url(images/bg_gnb2.jpg);}
	.gnb li.menu3 {background-image:url(images/bg_gnb3.jpg);}
	.gnb li.menu4 {background-image:url(images/bg_gnb4.jpg);}
	.gnb li.menu1:after {background-image:url(images/bg_gnb1_on.jpg);}
	.gnb li.menu2:after {background-image:url(images/bg_gnb2_on.jpg);}
	.gnb li.menu3:after {background-image:url(images/bg_gnb3_on.jpg);}
	.gnb li.menu4:after {background-image:url(images/bg_gnb4_on.jpg);}
	.gnb li:hover:after {opacity:1;}
	.gnb li a {display:block; width:100%; height:100%; position:relative; font-family:'Kepler Regular'; font-size:50px; line-height:1; color:#aaa; vertical-align:middle; text-align:center; z-index:20;}
	.gnb li a .textWrap {display:block; width:100%; height:100px; position:absolute; top:50%; margin-top:-70px; text-align:center;}
	.gnb li em {font-family:'Helvetica Bold'; font-size:13px; color:#9d8c4a;}
	.gnb li strong {display:block;}
	.gnb li a:hover, .gnb li a:hover em {color:#fff;}
}
@media all and (orientation:landscape) and (max-width: 768px) { 
	.gnb li a {font-size:25px;}
	.gnb li a .textWrap {height:auto; margin-top:-12px;}
	.gnb li em {font-size:7px;}
}
/* 세로모드 */
@media all and (orientation:portrait) { 
	.gnbLayer nav {background:#222;}
	.gnb li {float:none; width:100%; height:25%;}
	.gnb li:after {display:none;}
	.gnb li.menu1 {background-image:url(images/mobile/bg_gnb1.jpg);}
	.gnb li.menu2 {background-image:url(images/mobile/bg_gnb2.jpg);}
	.gnb li.menu3 {background-image:url(images/mobile/bg_gnb3.jpg);}
	.gnb li.menu4 {background-image:url(images/mobile/bg_gnb4.jpg);}
	.gnb li a {font-size:25px;}
	.gnb li a .textWrap {height:auto; margin-top:-12px;}
	.gnb li em {font-size:7px;}
}



/* ===================================================
	MAIN CONTETNS 
=================================================== */

/* main contents */
.main {height:100%; position:relative; background:#fff no-repeat center; background-size:cover;}
.main.cont1 {background-image:url(images/bg_main_1.jpg);}
.main.cont2 {background-image:url(images/bg_main_2.jpg);}
.main.cont3 {background-image:url(images/bg_main_3.jpg);}
.main .desc2 { opacity: 0; }
.main .desc3 { opacity: 0; }
.main .descWrap {width:444px; height:480px; position:fixed; right:150px; top:50%; margin-top:-240px; background:#051001; background:rgba(5, 16, 1, .6);}
.main .descWrap:before {content: ""; display: inline-block; width: 1px; height: 100%; margin-left:-6px; vertical-align: middle;}
.main .descWrap.leftAlign {right:auto; left:150px;}
.main .descWrap .innerBox {display:inline-block; padding:0 40px; vertical-align:middle;}
.main .descWrap .title {margin-bottom:40px; font-family:'Kepler Regular'; font-size:44px; line-height:1; color:#fff;}
.main .descWrap .text {font-size:16px; color:#eee; padding-bottom: 50px; }
.main .descWrap .btnMore {display:inline-block; height: 30px; line-height: 30px; font-family:'Helvetica Bold'; font-size:12px; color:#ddd;}
.main .descWrap .btnMore span {display:inline-block; padding-right:12px; background:url(images/ico_arrow.png) no-repeat right center;}

.scrollDown {width:60px; position:fixed; left:50%; bottom:25px; margin-left:-30px; padding-top:45px; border:none; background:none; font-family:'Helvetica Bold'; font-size:12px; color:#fff; text-align:center; cursor:pointer;}
.scrollDown .ico {display:block; width:12px; height:30px; position:absolute; left:50%; top:0; margin-left:-6px; background:url(images/ico_scroll.png) no-repeat center top; transition:all .5s ease-out;}
.scrollDown.last .ico {transform:rotate(180deg)}
.scrollDown strong {opacity:.7;}
.main .scrollDown {position:absolute;}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {
	.main {min-height:0;}
	.main.cont1 {background-image:url(images/bg_main_1_m.jpg);}
	.main.cont2 {background-image:url(images/bg_main_2_m.jpg);}
	.main.cont3 {background-image:url(images/bg_main_3_m.jpg);}
	.main .descWrap {width:auto; min-width:0; height:auto; top:25.4%; bottom:20.6%; left:20px; right:20px; margin-top:0;}
	.main .descWrap.leftAlign {right:20px; left:20px;}
	.main .descWrap .innerBox {padding:0 25px;}
	.main .descWrap .title {margin-bottom:25px; font-size:34px;}
	.main .descWrap .text {font-size:13px; padding-bottom: 0; }
	.main .descWrap .btnMore {margin-top:20px; font-size:10px;}
	.main .descWrap .btnMore span {display:inline-block; padding-right:10px; background:url(images/mobile/ico_arrow.png) no-repeat right center; background-size:5px auto;}
	.scrollDown {width:50px; bottom:20px; margin-left:-25px; font-size:10px; padding-top: 35px; }
	.scrollDown .ico {height:22px; left:40%; margin:0 auto 10px; background:url(images/mobile/ico_scroll.png) no-repeat center top; background-size:11px auto;}

}
/* ###### default 375 ###### */
@media (max-width: 375px) {
	.contents {padding: 0; margin:0 10px;}
	.main .descWrap {top:22%; bottom:17%;}
}
/* ###### default 375 ###### */
@media (max-width: 360px) {
	.main .descWrap .title { font-size: 32px; }
}
/* ###### default 320 ###### */
@media (max-width: 320px) {
	.contents {padding: 0; margin:0 10px;}
	.main .descWrap {top:15.4%; bottom:10.6%;}
}
@media all and (orientation:landscape) and (max-height: 360px) { 
	.main .descWrap {top:10%; bottom:10%;}
} 



/* ===================================================
	SUB CONTETNS _______________ VALUE
=================================================== */

/* VALUE STYLE GUIDE */
.subCont.value {background-image:url(images/bg_value_visual.jpg);}
.subHead {color:#fff;}

/* philosophy */
.ourPhilosophy {padding:120px 0; background:url(images/bg_value_phliosophy.jpg) no-repeat center; background-size:cover; text-align:center; }
.ourPhilosophy .contents { position: relative; }
.ourPhilosophy .subHead {margin-bottom:65px;}
.ourPhilosophy .diagramHead {position:absolute; left: 0; bottom: 190px; z-index: 100; width:100%; height:98px; }
.ourPhilosophy .diagramHead strong { display: inline-block; width:98px; height:98px; line-height:98px; font-size:40px; color:#fff; background: linear-gradient(to right, #2e7728 , #117e44); transform: rotate(-45deg); }
.ourPhilosophy .diagramHead strong span { display: block; transform: rotate(45deg); }
.ourPhilosophy .diagram {overflow:hidden; color: #fff; border:1px solid #2c2d2e; border:1px solid rgba(255, 255, 255, .15); border-bottom: none; max-width: 780px; margin: 0 auto; box-sizing: border-box; }
.ourPhilosophy .diagram li {float:left; width:50%; position:relative; box-sizing:border-box; padding: 50px 0; border-right: 1px solid #2c2d2e; border-right: 1px solid rgba(255, 255, 255, .15); border-bottom: 1px solid #2c2d2e; border-bottom: 1px solid rgba(255, 255, 255, .15);}
.ourPhilosophy .diagram li.s1 {  }
.ourPhilosophy .diagram li.s2 { border-right: none; }
.ourPhilosophy .diagram li.s3 {  }
.ourPhilosophy .diagram li.s4 { border-right: none; }
.ourPhilosophy .diagram li > div { padding: 60px 20px 0; background-repeat:no-repeat; background-position: center 0; box-sizing: border-box;}
.ourPhilosophy .diagram li.s1 > div {margin-left:0; background-image:url(images/ico_value_1.png);}
.ourPhilosophy .diagram li.s2 > div {background-image:url(images/ico_value_2.png);}
.ourPhilosophy .diagram li.s3 > div {background-image:url(images/ico_value_3.png);}
.ourPhilosophy .diagram li.s4 > div {margin-right:0; background-image:url(images/ico_value_4.png);}
.ourPhilosophy .diagram li .tit { text-transform: uppercase; display:block; margin-bottom:15px; font-family:'Helvetica Bold'; font-size:12px; color:#ccc;}
.ourPhilosophy .diagram li .desc {font-size:14px; line-height:16px; color:#8e8f90; height: 48px; }
.ourPhilosophy .diagram li .desc span { display: block; }

.managementP {margin:150px 0; overflow:hidden;}
.managementP .textBox {float:left; width:640px; padding-right:60px; box-sizing:border-box;}
.managementP .imgBox {float:right; width:500px;overflow:hidden;}
.managementP .head {position:relative; top:12px; margin:0 0 58px; font-size:90px; line-height:1; color:#444; z-index: 10;}
.managementP .subHead {margin-bottom:30px; font-family:'Kepler Regular'; font-style:italic; font-size:40px; line-height:1; color:#444;}
.managementP .listHead {display:block; margin-bottom:5px; font-family:'Kepler Bold It'; font-size:22px; color:#333;}
.listBox + .listBox {margin-top:40px;}
.circleList li {position:relative; margin-top:10px; padding-left:20px; font-size:15px; line-height:19px; color:#666;}
.circleList li:first-child {margin-top:0 !important;}
.circleList li:after {content:''; display:block; position:absolute; left:2px; top:8px; width:3px; height:3px; border-radius:2px; background:#999;}


/* strategy */
.subCont.strategy {background:url(images/bg_value_strategy.jpg) no-repeat center; background-size:cover; text-align:center;}
.strategy .contents {height:781px; overflow:hidden;}
.strategy .slideWrap {position:relative; padding-right:455px;}
.strategy .ctrlWrap {float:left; width:685px; margin:93px 0 104px; padding:0 30px; box-sizing:border-box;}
.strategy .ctrlWrap .subHead {margin-bottom:8px; font-family:'Helvetica Bold'; font-size:28px;}
.strategy .ctrlWrap .para {font-size:15px; line-height:20px; color:#d0d0d0;}
.strategy .ctrl {width:344px; height:323px; position:relative; margin:162px auto 0; /*background:url(images/bg_value_strategy_diagram.png) no-repeat center;*/}
.strategy .ctrl > img { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; }
.strategy .ctrl > img.pcOnly { display: block; }
.strategy .ctrl > img.mOnly { display: none; }

.strategy .ctrl strong {position:absolute; left:0; top:50%; width:100%; margin-top:-35px; font-size:15px; line-height:17px; color:#dcb789; text-align:center;}
.strategy .ctrl li {width:170px; position:absolute; top:50%; left:50%; border-radius:50%; overflow:hidden;}
.strategy .ctrl li.ctrl1 {margin:-267px 0 0 -85px;}
.strategy .ctrl li.ctrl2 {margin:-10px 0 0 -233px;}
.strategy .ctrl li.ctrl3 {margin:-10px 0 0 63px;}
.strategy .ctrl li a {display:block; height:170px; padding:83px 0 0; font-size:10px; line-height:13px; color:#b5b5b5; box-sizing:border-box; transition:all .15s; position: relative; }

.strategy .ctrl li.ctrl1 a {background:url(images/ico_strategy_slide_1.png) no-repeat center;}
.strategy .ctrl li.ctrl2 a {background:url(images/ico_strategy_slide_2.png) no-repeat center;}
.strategy .ctrl li.ctrl3 a {padding-top:71px; background:url(images/ico_strategy_slide_3.png) no-repeat center;}
.strategy .ctrl li.on a {color:#fff;}
.strategy .ctrl li.ctrl1.on a {background-image:url(images/ico_strategy_slide_1_on.png);}
.strategy .ctrl li.ctrl2.on a {background-image:url(images/ico_strategy_slide_2_on.png);}
.strategy .ctrl li.ctrl3.on a {background-image:url(images/ico_strategy_slide_3_on.png);}

.strategy .slideCont {position:absolute; right:0; top:0; bottom:0; width:455px; height:798px; background:rgba(0, 0, 0, .3);}
.strategy .slideCont .frame {width:100%; overflow:hidden;}
.strategy .slideCont .slider {width:300%; position:relative; overflow:hidden;}
.strategy .slideCont .slider > li {width:33.3%; height:681px; float:left;}
.strategy .iconBox {/*padding-top:75px;*/ background-repeat:no-repeat; background-position:center top;}
.strategy .iconBox p.icon { padding-bottom: 20px;  }
/*
.strategy .stSlide1 .iconBox {background-image:url(images/ico_strategy_1.png);}
.strategy .stSlide2 .iconBox {background-image:url(images/ico_strategy_2.png);}
.strategy .stSlide3 .iconBox {background-image:url(images/ico_strategy_3.png);}
*/
.strategy .iconBox .tit {display:block; margin-bottom:30px; font-family:'Helvetica Bold'; font-size:12px; line-height:18px; color:#fff; text-transform: uppercase; }
.strategy .listType2 {width:275px; margin:0 auto;}
.strategy .listType2 li {position:relative; margin-top:13px; padding-top:15px; font-size:15px; line-height:18px; color:#bbbdbd;}
.strategy .listType2 li:after {content:''; display:block; position:absolute; left:50%; top:0; width:3px; height:3px; margin-left:-1.5px; background:#dddddd; border-radius:3px;}
.strategy .listType2 li:first-child {margin-top:0 !important; padding-top:0 !important;}
.strategy .listType2 li:first-child:after {display:none;}

.strategy .indicator {width:80px; overflow:hidden; margin:0 auto;}
.strategy .indicator li {float:left; position:relative; padding-left:10px;}
.strategy .indicator li:first-child {padding-left:0;}
.strategy .indicator li:after {content:''; display:block; width:100%; height:1px; position:absolute; right:50%; top:50%; background:url(images/bg_dashed.gif) repeat-x left center;}
.strategy .indicator li:first-child:after {display:none;}
.strategy .indicator span {position:relative; display:block; width:20px; height:20px; position:relative; text-align:center; border-radius:100%; z-index:5;}
.strategy .indicator span a {position:absolute; left:50%; top:50%; display:inline-block; width:10px; height:10px; margin:-5px 0 0 -5px; background: #999999; border-radius:100%;}
.strategy .indicator .on span a {background-color: #dcb789;}
.strategy .indicator .on span {background:rgba(255, 255, 255, .2);}


/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {

	/* VALUE STYLE GUIDE */
	/* philosophy  */
	.managementP {margin:150px 22px;}
	.managementP .textBox {width:48.9%; padding-right:40px;}
	.managementP .imgBox {width:51.1%;}
	.managementP .imgBox img {min-width:100%;}
	.managementP .head {margin:0 0 55px; font-size:80px; text-shadow:1px 1px 1px #fff;}


	/* strategy */
	.subCont.strategy {background:black url(images/bg_value_strategy_s.jpg) no-repeat center; background-size:cover;}
	.strategy .contents {height:auto; margin:0;}
	.strategy .slideWrap {padding-right:0;}
	.strategy .ctrlWrap {float:none; width:auto; margin:65px 0 40px; padding:0;}
	.strategy .ctrlWrap .subHead {margin-bottom:20px; font-size:23px;}
	.strategy .ctrlWrap .para {padding:0 20px; font-size:16px; line-height:19px;}
	.strategy .ctrl {max-width:204px; height:197px; margin:70px auto 0; /* background:url(images/mobile/bg_value_strategy_diagram.png) no-repeat center; background-size:100%; */ }
	.strategy .ctrl > img { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; }
	.strategy .ctrl > img.pcOnly { display: none; }
	.strategy .ctrl > img.mOnly { display: block; }

	.strategy .ctrl strong {margin-top:-24px; font-size:13px; line-height:16px;}
	.strategy .ctrl li {width:75px;}
	.strategy .ctrl li.ctrl1 {margin:-141px 0 0 -38px;}
	.strategy .ctrl li.ctrl2 {margin:9px 0 0 -125px;}
	.strategy .ctrl li.ctrl3 {margin:9px 0 0 49px;}
	.strategy .ctrl li a {height:75px; padding:0;}
	

	.strategy .ctrl li.ctrl1 a {background:url(images/mobile/ico_strategy_slide_1.png) no-repeat center; background-size:100%;}
	.strategy .ctrl li.ctrl2 a {background:url(images/mobile/ico_strategy_slide_2.png) no-repeat center; background-size:100%;}
	.strategy .ctrl li.ctrl3 a {padding-top:0; background:url(images/mobile/ico_strategy_slide_3.png) no-repeat center; background-size:100%;}
	.strategy .ctrl li a em {position: absolute; overflow: hidden; margin: -1px; border: 0; padding: 0; width: 1px; height: 1px; clip: rect(0 0 0 0);}
	.strategy .ctrl li.ctrl1.on a {background-image:url(images/mobile/ico_strategy_slide_1_on.png);}
	.strategy .ctrl li.ctrl2.on a {background-image:url(images/mobile/ico_strategy_slide_2_on.png);}
	.strategy .ctrl li.ctrl3.on a {background-image:url(images/mobile/ico_strategy_slide_3_on.png);}
	.strategy .slideCont {position:static; width:auto; height:auto; padding:40px 0 20px; background:rgba(0, 0, 0, .25);}
	.strategy .slideCont .slider > li {height:auto;}
	.strategy .iconBox {/*padding-top:55px;*/ background-size:36px auto; padding-bottom: 20px;}
	/*
	.strategy .stSlide1 .iconBox {background-image:url(images/mobile/ico_strategy_1.png);}
	.strategy .stSlide2 .iconBox {background-image:url(images/mobile/ico_strategy_2.png);}
	.strategy .stSlide3 .iconBox {background-image:url(images/mobile/ico_strategy_3.png);}
	*/
	.strategy .iconBox .tit {margin-bottom:35px; font-size:13px;}
	.strategy .listType2 {width:auto; padding:0 20px;}
	.strategy .listType2 li {margin-top:11px; padding-top:11px; font-size:14px; line-height:17px;}
	.strategy .indicator {width:50px;}
	.strategy .indicator li {padding-left:7px;}
	.strategy .indicator li:first-child {padding-left:0;}
	.strategy .indicator li:after {right:50%;}
	.strategy .indicator li:first-child:after {display:none;}
	.strategy .indicator span {width:12px; height:12px;}
	.strategy .indicator span a {width:6px; height:6px; margin:-3px 0 0 -3px;}
	.strategy .indicator .on span {background:rgba(255, 255, 255, .2);}


}

/* ###### default 1024 ###### */
@media (max-width: 1024px) {
	/* VALUE STYLE GUIDE */
	/* philosophy  */
	.managementP .textBox {width:60%; padding-right:40px;}
	.managementP .imgBox { width: 40%; position: relative; overflow: hidden; height: 0; padding-bottom: 735px;}
	.managementP .imgBox img { top: 0%; right: -100px; position: absolute; z-index: -1; }
}



/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {

	/* VALUE STYLE GUIDE */
	.subCont.value {background-image:url("images/bg_value_visual_m.jpg");  }

	/* philosophy */
	.ourPhilosophy {padding:60px 0 65px; background:url(images/mobile/bg_value_phliosophy.jpg) no-repeat center;}
	.ourPhilosophy .subHead {margin-bottom:60px;}
	.ourPhilosophy .diagramHead { position: static; background: url("images/diagramBg.png") no-repeat center 50%; margin-bottom: 60px; }
	.ourPhilosophy .diagramHead { height: 70px; }
	.ourPhilosophy .diagramHead strong { width:70px; height:70px; line-height:70px; font-size: 30px; }
	.ourPhilosophy .diagram {padding: 0 10%; border: none; }
	.ourPhilosophy .diagram li {float:none; width:auto; margin-top:37px; padding:0; border: none; }
	.ourPhilosophy .diagram li:first-child {margin-top:0;}
	.ourPhilosophy .diagram li > div {height:auto; padding:50px 0 0; border:none; background-position:center top; background-size:42px;}
	.ourPhilosophy .diagram li.s1 > div {background-image:url(images/mobile/ico_value_1.png);}
	.ourPhilosophy .diagram li.s2 > div {background-image:url(images/mobile/ico_value_2.png);}
	.ourPhilosophy .diagram li.s3 > div {background-image:url(images/mobile/ico_value_3.png);}
	.ourPhilosophy .diagram li.s4 > div {background-image:url(images/mobile/ico_value_4.png);}
	.ourPhilosophy .diagram li .tit {line-height:14px;}
	.ourPhilosophy .diagram li:before,
	.ourPhilosophy .diagram li:after {display:none;}
	.ourPhilosophy .diagram li .desc span { display: inline; }

	.managementP {overflow:visible; margin:65px 0;}
	.managementP .textBox {float:none; width:auto; padding-right:0;}
	.managementP .imgBox {display:none;}
	.managementP .head {position:static; margin:0 0 45px; font-size:56px; text-shadow:none; text-align:center;}
	.managementP .moBgCont {margin:0 -20px; padding:74.6% 20px 0; background:url(images/mobile/bg_value_mp.jpg) no-repeat center top; background-size:100%;}
	.managementP .subHead {margin-top:45px; margin-bottom:35px; font-size:35px;}
	.managementP .listHead {margin-bottom:5px;}
	.circleList li {position:relative; margin-top:10px; padding-left:10px; font-size:16px;}
	.circleList li:after {left:2px; top:9px; width:2px; height:2px; border-radius:2px;}

}

/* ###### default 320 ###### */
@media (max-width: 320px) {
	.managementP .head { font-size: 48px; }
}



/* ===================================================
	SUB CONTETNS _______________ CAMPANY
=================================================== */

/* CAMPANY STYLE GUIDE */
.subCont.campany {background-image:url("images/bg_campany_visual.jpg");}
.subHead {color:#fff;}

/* profile */
.companyProfile { background: #050505 url("images/bg_campany_1.jpg") no-repeat center 0; background-size: cover; padding: 120px 0; text-align: center; }
.companyProfile .profile { text-align: center; }
.companyProfile .profile dl { padding: 0 6%; }
.companyProfile .profile dl dt { font-size: 15px; color: #dcb789; font-weight: bold; padding: 10px 0; font-family: 'Helvetica Bold'; }
.companyProfile .profile dl dd { font-size: 17px; color: #cfcfcf; }

.companyProfile .profileList { padding-top: 80px; }
.companyProfile .profileList ul { padding: 0 5%; overflow: hidden; position: relative; }
.companyProfile .profileList ul li { text-align: center; box-sizing: border-box; padding: 0 10px; }
.companyProfile .profileList ul li div { max-width: 270px; box-sizing: border-box; border: 1px solid #2c2d2e; border: 1px solid rgba(255, 255, 255, .15); padding: 100px 10px 30px 10px; margin: 0 auto; }
.companyProfile .profileList ul li div strong { color: #fff; font-size: 90px; line-height: 1; font-family: 'Kepler Regular'; }
.companyProfile .profileList ul li div strong.billion { display: inline-block; vertical-align: super; height: 40px; }
.companyProfile .profileList ul li div strong span { font-size: 30px; }
.companyProfile .profileList ul li div p { height: 35px; color: #cccccc; font-weight: bold; font-size: 12px; text-transform: uppercase; font-family: 'Helvetica Bold';}

.companyProfile .profileList ul li.s1 { float: left; width: 50%; padding-bottom: 60px; padding-left: 18%;}
.companyProfile .profileList ul li.s2 { float: left; width: 50%; padding-bottom: 60px; padding-right: 18%; }
.companyProfile .profileList ul li.s3 { float: left; width: 33.33%; }
.companyProfile .profileList ul li.s4 { float: left; width: 33.33%; }
.companyProfile .profileList ul li.s5 { float: left; width: 33.33%; }

.companyProfile .profileList ul li.s1 div { background: url("images/ico_company_1.png") no-repeat center 30px; }
.companyProfile .profileList ul li.s2 div { background: url("images/ico_company_2.png") no-repeat center 30px; }
.companyProfile .profileList ul li.s3 div { background: url("images/ico_company_3.png") no-repeat center 30px; }
.companyProfile .profileList ul li.s4 div { background: url("images/ico_company_4.png") no-repeat center 30px; }
.companyProfile .profileList ul li.s5 div { background: url("images/ico_company_5.png") no-repeat center 30px; }

.companyProfile .profileList .btnM { display: none; }
.companyProfile .profileList .indicatorM { display: none; }


/* history */
.history { padding: 120px 0 70px 0; }
.history .subHead { font-family: 'Helvetica Bold'; font-size: 28px; color: #333333; text-align: center; }
.history .contents { padding: 0; }
.history .historyTop { text-align: center;  }
.history .historyTop dl { padding: 0 120px; }
.history .historyTop dl dt { font-size: 15px; color: #444444; font-weight: bold; padding: 10px 0; font-family: 'Helvetica Bold'; }
.history .historyTop dl dd { font-size: 15px; color: #666666; }

.history p { background: url("images/bg_company_history.jpg") no-repeat center 50%; background-size: cover; height: 0; padding-bottom: 35%; margin: 40px 0 50px 0; }
.history p img { width: 100%; }

.history .historyList { }
.history .historyList dl { }
.history .historyList dl dt { font-family: 'Kepler Bold It'; font-size: 22px; color: #333333; padding-bottom: 15px; font-weight: bold; font-style: italic; }
.history .historyList dl dd { color: #666666; padding-bottom: 50px; font-size: 15px; }


/* contactus */
.contactus { border-top: #e5e5e5 1px solid; padding-top: 100px; }
.contactus .subHead { font-family: 'Helvetica Bold'; font-size: 28px; color: #333333; text-align: center; }
.contactus .contusAddress { text-align: center; color: #666666; font-size: 15px; padding: 20px 0 40px 0; }
.contactus .contusAddress p { padding-bottom: 12px; }
.contactus .contusAddress p span { display: inline-block; padding: 0 15px; }
.contactus .contusAddress p span:first-child { background: url("images/ico_line.png") no-repeat right 50%; padding-right: 17px; }
.contactus .map { /*background: url("images/map.jpg") no-repeat center 50%; background-size: cover; */height: 0; padding-bottom: 35%; position: relative; }
.contactus .map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}



/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {

	/* CAMPANY STYLE GUIDE */
	/* profile */
	/* history */
	.history { padding: 150px 0 100px 0; }
	.history .historyTop dl { padding: 0 20px; }
	.history p { margin: 65px 0; }

	.history .historyList dl { padding: 0 20px; }	

	/* contactus */
	.contactus { padding-top: 120px; }
	.contactus .map { background: url("images/map_s.jpg") no-repeat center 50%; background-size: cover; height: 0; padding-bottom: 55%;}

}
/* ###### default 1024 ###### */
@media (max-width: 1024px) {
	
	/* CAMPANY STYLE GUIDE */
	/* profile */
	.companyProfile .profileList ul { padding: 0 0; }
}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {

	/* CAMPANY STYLE GUIDE */
	.subCont.campany {background-image:url("images/bg_campany_visual_m.jpg");}

	/* profile */
	.companyProfile { background: #050505 url("images/bg_campany_1_m.jpg") no-repeat center 0; background-size: cover; padding: 60px 0; }
	.companyProfile .profileList { padding-top: 50px; width: 100%; overflow: hidden; position: relative; padding-bottom: 50px;}
	.companyProfile .profileList ul { overflow: hidden; width: 600%; }
	.companyProfile .profileList ul li { padding: 0; }
	.companyProfile .profileList ul li div { max-width: 80%; }
	.companyProfile .profileList ul li.s1 { float: left; width: 20%; padding-bottom: 0; padding-left: 0;}
	.companyProfile .profileList ul li.s2 { float: left; width: 20%; padding-bottom: 0; padding-right: 0; }
	.companyProfile .profileList ul li.s3 { float: left; width: 20%; }
	.companyProfile .profileList ul li.s4 { float: left; width: 20%; }
	.companyProfile .profileList ul li.s5 { float: left; width: 20%; }

	.companyProfile .profileList .btnM { display: block; }
	.companyProfile .profileList .btnM .goLeft { position: absolute; bottom: 38%; left: 1%; background: url("images/left.png") no-repeat 0 50%; background-size: 100%; width: 8%; max-width: 35px; height: 11%; text-indent: -9999em; }
	.companyProfile .profileList .btnM  .goRight { position: absolute; bottom: 38%; right: 1%; background: url("images/right.png") no-repeat 0 50%; background-size: 100%; width: 8%; max-width: 35px; height: 11%; text-indent: -9999em; }

	.companyProfile .profileList .indicatorM {display: block; overflow:hidden; margin:0 auto; padding-top: 15px; }
	.companyProfile .profileList .indicatorM li {display: inline-block; position:relative; width: 15px; }
	.companyProfile .profileList .indicatorM li:first-child {padding-left:0;}
	.companyProfile .profileList .indicatorM li:after {content:''; display:block; width:100%; height:1px; position:absolute; right:50%; top:50%; }
	.companyProfile .profileList .indicatorM li:first-child:after {display:none;}
	.companyProfile .profileList .indicatorM a {left:50%; top:50%; display:inline-block; width:10px; height:10px; background: #999999; border-radius:100%; }
	.companyProfile .profileList .indicatorM .on a {background-color: #dcb789;}

	/* history */
	.history { padding: 75px 0 25px 0; }
	.history p { margin: 50px 0; background: url("images/bg_company_history_s.jpg") no-repeat center bottom;  background-size: cover; padding-bottom: 60%; }
	.history .historyList dl { padding: 0; }

	/* contactus */
	.contactus { padding-top: 60px; }
	.contactus .map { padding-bottom: 100%;}
}

/* ###### default 480 ###### */
@media (max-width: 480px) {
	.companyProfile .profileList ul li div { max-width: 74%; }
	.companyProfile .profileList ul li div strong { font-size: 75px; }
}

/* ###### default 320 ###### */
@media (max-width: 320px) {
	.companyProfile .goLeft { left: 0; }
}



/* ===================================================
	SUB CONTETNS _______________ TEAM / PORTFOLIO
=================================================== */

/* TEAM STYLE GUIDE */
/* PORTFOLIO STYLE GUIDE */

/* TEAM / PORTFOLIO 공통 */
.sortby { border-top: #dcdcdc 1px solid; border-bottom: #dcdcdc 1px solid; position: relative;  height: 56px; padding: 10px; margin-bottom: 30px; }
.sortby > div { float: left; box-sizing: border-box; }
.sortby > div > a { display: inline-block; font-family: 'Kepler Regular'; color: #666666; font-size: 22px; margin-right: 40px; height: 60px; line-height: 60px; box-sizing: border-box; }
.sortby .dropdown { display: inline-block; position: relative;  }
.sortby .dropdown > a { padding-right: 20px; margin-left: 20px; background: url("images/ico_dropdown.png") no-repeat right 50%; transition:all .1s ease-out; }
.sortby .dropdown > a.open { background: url("images/ico_up.png") no-repeat right 50%; transition:all .1s ease-out; }
.sortby .dropdown + ul { display: none; width: 100%; position: absolute; top: 79px; left: 0; z-index: 100; background-color: #f1f1f1; box-sizing: border-box; padding: 25px 10px;  }
.sortby .dropdown + ul li { display: inline-block; margin-right: 50px; vertical-align: middle; box-sizing: border-box;  } 
.sortby .dropdown + ul li:last-child { margin-right: 0; }
.sortby .dropdown + ul li a { border-bottom: #f1f1f1 2px solid; display: inline-block;  font-size: 11px; line-height: 1.6; color: #666; font-family: "Helvetica Bold"; text-transform: uppercase; color: #999999; letter-spacing: .5px; box-sizing: border-box; }
.sortby .dropdown + ul li:last-child { padding-right: 0;  }
.sortby .dropdown + ul li a span { display: block; }
.sortby .dropdown + ul li a.on { color: #b79264; border-bottom: #b79264 2px solid; }
.sortby .dropdown + ul li a:hover,
.sortby .dropdown + ul li a:focus,
.sortby .dropdown + ul li a:active { color: #b79264; border-bottom: #b79264 2px solid; }
.sortby .dropdown + ul li a.on span { color: #b79264; }

.sortby .dropdown + ul.byTeamList { padding: 35px 10px; }
.sortby .dropdown + ul.byPositionList { padding: 30px 10px; }
.sortby .dropdown + ul.byPortfolioList { padding: 35px 10px; }
.sortby .dropdown + ul.byFundList { padding: 35px 10px; }

.sortby .searchBox { border: #dcdcdc 1px solid; border-radius: 30px; height: 50px; line-height: 50px; box-sizing: border-box; position: absolute; top: 10px; right: 0; padding: 0 20px 0 45px; background: url("images/ico_search.png") no-repeat 21px 50%;}
.sortby .searchBox input[type="text"] { border: none; background: none; min-width: 200px; height: 30px; line-height: 30px; padding: 0 5px; font-family: "Helvetica Bold"; font-size: 14px; }
.sortby .searchBox input[type="text"]::-webkit-input-placeholder { color: #999a9a; font-family: "Helvetica Bold"; font-size: 14px; }
.sortby .searchBox input[type="text"]::-moz-placeholder { color: #999a9a; font-family: "Helvetica Bold"; font-size: 14px; }
.sortby .searchBox input[type="text"]:-ms-input-placeholder { color: #999a9a; font-family: "Helvetica Bold"; font-size: 14px; }
.sortby .searchBox input[type="text"]:-moz-placeholder { color: #999a9a; font-family: "Helvetica Bold"; font-size: 14px; }


.notFound { text-align: center; padding: 20% 0; }
.notFound p { font-size: 28px; color: #b79264; font-family: "Helvetica Roman";  }
.notFound p span { display: inline-block; text-decoration: underline; line-height: 1.3; padding: 2px 2px 3px 2px; vertical-align: middle;  }
.notFound p span:after { content: '"'; }
.notFound p span:before { content: '"'; }


.boardList {  }
.boardList .item { width: 23.5%; margin-right: 2%; float: left; box-sizing: border-box; padding-bottom: 25px; opacity:0}

.boardList .item.here { background: url("images/ico_here.png") no-repeat center bottom; }
.boardList .item.nth3 { margin-right: 2%; }
.boardList .item.nth4 { margin-right: 0; }

.boardList .item .position { height: 0; padding-bottom: 118%;  position: relative; }
.boardList .item .position p { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; background: #383838 url("images/team_itemBg.png") repeat-x 0 0; background-size: auto 100%;  }
.boardList .item .position p img { position: absolute; top: 0; right: 0;  width: 100%; height: 100%;  max-width: 390px;  }
.boardList .item .position dl { position: absolute; bottom: 0; left: 0; padding: 0 9% 6%; width: 82%; color: #fff; text-shadow: #000 1px 1px; 
background: -webkit-linear-gradient(transparent, #070707); 
background: -o-linear-gradient(transparent, #070707);
background: -moz-linear-gradient(transparent, #070707); 
background: linear-gradient(transparent, #070707); 
}
.boardList .item .position dl dt { padding-bottom: 13px; }
.boardList .item .position dl dt strong { display: block; font-size: 14px; color: #d0d0d0; padding-bottom: 4px;}
.boardList .item .position dl dt span { display: block; font-size: 18px; text-transform: uppercase; font-weight: bold; letter-spacing: 1px;}
.boardList .item .position dl dd { word-spacing: -2px; color: #c4c4c4; font-size: 15px; }
.boardList .item .position .dim { position: absolute; top: 0; left: 0; display: none; width: 100%; height: 100%; background-color: #000; opacity: .5; transition:all .3s; }
.boardList .item .position .dim.hide { display: block; transition:all .3s; }


.moreview { clear: both; text-align: center;}
.moreview span { margin-top: 30px; color: #666666; font-size: 18px; display: inline-block; padding: 0 20px 0 0; background: url("images/ico_dropdown.png") no-repeat right 58%; }



/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {

	/* TEAM STYLE GUIDE */
	/* PORTFOLIO STYLE GUIDE */

	/* TEAM / PORTFOLIO 공통 */
	.sortby .dropdown + ul li { display: inline-block; margin-right: 50px; vertical-align: middle; box-sizing: border-box; padding: 10px 0; } 
	.sortby .dropdown + ul li a span { display: inline; }

	.sortby .dropdown + ul.byTeamList { padding: 25px 10px; }
	.sortby .dropdown + ul.byPositionList { padding: 20px 10px; }
	.sortby .dropdown + ul.byPortfolioList { padding: 25px 10px; }
	.sortby .dropdown + ul.byFundList { padding: 25px 10px; }	

	.sortby .searchBox input[type="text"] { min-width: 60px; max-width: 103px; }

	.boardList .item { width: 32%; margin-right: 2%; float: left; box-sizing: border-box; padding-bottom: 20px; }
	.boardList .item.nth3 { margin-right: 0%; }
	.boardList .item.nth4 { margin-right: 2%; }
	.boardList .item .position { padding-bottom: 119%; }
	.boardList .item .position p img { width: 100%; height: 100%;  max-width: 390px;  }

	.moreview span { margin-top: 40px; }

}
/* ###### default 751 ~1023 ###### */
@media (max-width: 1023px) {
	.sortby > div > a { margin-right: 30px; }
	.sortby .byTeam a { width: 75%;; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.sortby .byPosition a { width: 80%; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {
	.sortby .byTeam a { width: auto; max-width: 100%; overflow: visible; text-overflow: clip; white-space: normal; }
	.sortby .byPosition a { width: auto; max-width: 100%; overflow: visible; text-overflow: clip; white-space: normal; }

	.sortby .dropdown + ul.byTeamList { top: 122px; padding: 15px 10px; }
	.sortby .dropdown + ul.byPositionList { top: 183px; padding: 15px 10px; }

	.sortby .dropdown + ul.byPortfolioList { top: 122px; padding: 15px 10px; }
	.sortby .dropdown + ul.byFundList { top: 183px; padding: 15px 10px; }	

	.notFound { text-align: center; padding: 20% 0; }
	.notFound p { font-size: 28px; color: #b79264; font-family: "Helvetica Roman";  }
	.notFound p span { max-width: 90%; vertical-align: top;  }
	.notFound p strong { display: block; }

}
/* ###### default 320 ###### */
@media (max-width: 320px) {	
	.sortby > div > a { font-size: 21px; }
	.boardList .item .position dl { padding: 0 10px 10px; }

}




/* ===================================================
	SUB CONTETNS _______________ TEAM
=================================================== */

/* TEAM STYLE GUIDE */
/* TEAM ONLY */
.subCont.team {background-image:url("images/bg_team_visual.jpg");}

/* teamPeople */
.teamPeople { background-color: #f1f1f1; padding: 80px 0 60px 0; overflow: hidden; }
.teamPeople .subHead { font-family: 'Helvetica Bold'; font-size: 28px; color: #333333; text-align: center; padding-bottom: 70px; }


.boardList .itemViewer { clear: both; width: 100%; min-height: 150px; margin-bottom: 25px; background-color: #fff; position: relative; line-height: 1; overflow:hidden; }
.boardList .itemViewer div  { padding: 60px 50px; }
.boardList .itemViewer .closeBtn { position: absolute; top: 50px; right: 50px; background: url("images/btn_close2.png") no-repeat 0 0; width: 23px; height: 23px; display: block; text-indent: -9999em; }

.boardList .itemViewer div dt { padding-bottom: 40px; padding-right: 25px; }
.boardList .itemViewer div dt strong { display: block; font-family: 'Kepler Regular'; font-size: 40px; padding-bottom: 12px; }
.boardList .itemViewer div dt span { font-size: 18px; display: block; color: #999999; }
.boardList .itemViewer div dd { padding-right: 50px; line-height: 1.6; word-spacing: 1px; }


/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {

	/* TEAM STYLE GUIDE */
	/* TEAM ONLY */
		/* teamPeople */
	.teamPeople .subHead { padding-bottom: 70px; }

	.boardList .itemViewer div  { padding: 60px 20px; }
	.boardList .itemViewer .closeBtn { top: 60px; right: 20px; }
	.boardList .itemViewer div dd { padding-right: 0; }

}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {

	/* TEAM STYLE GUIDE */
	.subCont.team {background-image:url("images/bg_team_visual_m.jpg"); background-size: cover; }

	/* teamPeople */
	.teamPeople { padding: 60px 0 40px 0; }
	.teamPeople .subHead { padding-bottom: 60px; }
	.sortby { height: auto; border-bottom: none; padding: 0; }
	.sortby > div { float: none; border-bottom: #dcdcdc 1px solid; padding: 0 10px; }
	.sortby > div > a { display: block; margin-right: 0; }
	.sortby .dropdown { display: block;  }
	.sortby .dropdown > a { display: block; margin-left: 0; }
	.sortby .dropdown + ul { height: auto; }
	.sortby .dropdown + ul.btList { top: 122px; padding: 15px 10px; }
	.sortby .dropdown + ul.bpList { top: 183px; padding: 15px 10px; }
	.sortby .dropdown + ul li { display: block; padding: 5px 0; } 
	.sortby .dropdown + ul li a { line-height: 1.2; }
	.sortby .dropdown + ul li a span { display: inline; }
	.sortby .searchBox { clear: both;  position: static; display: block; margin-top: 20px; }
	.sortby .searchBox input[type="text"] { width: 100%; max-width: 95%; }
	
	.boardList .item { width: 100%; margin-right: 0; float: none;  }
	.boardList .item.nth3 { margin-right: 0%; }
	.boardList .item.nth4 { margin-right: 0; }
	.boardList .item .position { height: 0; padding-bottom: 55.5%; }
	.boardList .item .position p { position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 0; text-align: right;}
	.boardList .item .position p img { width: auto; height: 100%;  }
	.boardList .item .position dl { box-sizing: border-box; padding: 7% 25px 20px 25px; width: 100%; }
	.boardList .itemViewer div  { padding: 40px 20px; }
	.boardList .itemViewer .closeBtn { top: 40px; right: 20px; }
	.moreview a { margin-top: 20px; }
	.moreview span { margin-top: 20px; }


}



/* ===================================================
	SUB CONTETNS _______________ PORTFOLIO
=================================================== */

/* PORTFOLIO STYLE GUIDE */
/* PORTFOLIO ONLY */
.subCont.portfolio {background-image:url("images/bg_portfolio_visual.jpg");}

/* portfolio */
.portfolioWork { background-color: #f1f1f1; padding: 80px 0; overflow: hidden; }
.portfolioWork .subHead { font-family: 'Helvetica Bold'; font-size: 28px; color: #333333; text-align: center; padding-bottom: 70px; }

.portfolioWork .boardList .item .position p { background: #000; }
.portfolioWork .boardList .item .position p .pcOnly { display: block; }
.portfolioWork .boardList .item .position p .mOnly { display: none; }

.portfolioWork .boardList .item .position dl { background: none; bottom: auto; top: 0; width: 88%; height: 82%; padding: 9% 6%;  }
.portfolioWork .boardList .item .position dl dd.bt { position: absolute; bottom: 5%; left: 6%; font-family: 'Helvetica Bold'; font-size: 14px; color: #d1d1d1; }

.boardList .itemViewer2 { clear: both; width: 100%; min-height: 150px; margin-bottom: 25px; background-color: #fff; position: relative; line-height: 1; overflow:hidden;}
.boardList .itemViewer2 div  { padding: 70px 40px; }
.boardList .itemViewer2 div p.logo { padding-bottom: 18px;  }

.boardList .itemViewer2 .closeBtn { position: absolute; top: 70px; right: 40px; background: url("images/btn_close2.png") no-repeat 0 0; width: 23px; height: 23px; display: block; text-indent: -9999em; }

.boardList .itemViewer2 div dt { padding-bottom: 60px; }
.boardList .itemViewer2 div dt strong { display: block;  font-family: 'Kepler Regular'; font-size: 40px; padding-bottom: 10px; }
.boardList .itemViewer2 div dt strong a { display: inline-block; font-family: 'Helvetica Bold'; font-size: 12px; color: #888888; text-transform: uppercase; margin-left: 20px; }
.boardList .itemViewer2 div dt strong a small { background: url("images/ico_go.png") no-repeat right 45%; padding-right: 12px;  }

.boardList .itemViewer2 div dt span { font-size: 18px; display: block; color: #999999; }

.boardList .itemViewer2 div dd { display: table; line-height: 1.6; word-spacing: 1px; }
.boardList .itemViewer2 div dd ul { display: table-cell; font-size: 16px; }
.boardList .itemViewer2 div dd ul li { line-height: 1.5; padding-bottom: 10px; }
.boardList .itemViewer2 div dd ul:first-child { width: 260px; padding-right: 40px; }
.boardList .itemViewer2 div dd ul:first-child li strong { font-weight: bold; }

.boardList .itemViewer2 div dd ul:last-child li { background: url("images/ico_bullet00.png") no-repeat 0 12px; padding-left: 10px;  }


/* ###### default PC2 751~1279 ###### */
@media (max-width: 1279px) {

	/* PORTFOLIO STYLE GUIDE */
	/* PORTFOLIO ONLY */
	.boardList .itemViewer2 div  { padding: 70px 20px; }
	.boardList .itemViewer2 .closeBtn { top: 70px; right: 20px; }
	.boardList .itemViewer2 div dd ul:first-child { width: 210px; }

}

/* ###### default Mobile ~750 ###### */
@media (max-width: 750px) {

	/* PORTFOLIO STYLE GUIDE */
	.subCont.portfolio {background-image:url("images/bg_portfolio_visual_m.jpg");}

	.portfolioWork { padding: 60px 0 40px 0; }
	.portfolioWork .subHead { padding-bottom: 60px; }

	.portfolioWork .sortby .dropdown + ul.btList { top: 183px;  }
	.portfolioWork .boardList .item .position p .pcOnly { display: none; }
	.portfolioWork .boardList .item .position p .mOnly { display: block; }
	.portfolioWork .boardList .item .position p img { width: 100%; max-width: 750px; }

	.boardList .itemViewer2 .closeBtn { top: 40px; right: 20px; }

	.portfolioWork .boardList .item .position dl { width: 90%; height: 90%; padding: 5% 5%;  }
	.portfolioWork .boardList .item .position dl dt { padding-bottom: 10px; }
	
	.portfolioWork .boardList .item .position dl dd.bt { bottom: 0%;  font-size: 12px; }

	.boardList .itemViewer2 div  { padding: 40px 20px; }
	.boardList .itemViewer2 div dt { padding-bottom: 35px; }
	.boardList .itemViewer2 div dt strong { padding-bottom: 0;  }
	.boardList .itemViewer2 div dt strong a { display: block; margin-left: 0; padding: 15px 0 20px 0; }

	.boardList .itemViewer2 div dd { display: block; }
	.boardList .itemViewer2 div dd ul { display: block; width: 100%; padding: 0; }
	.boardList .itemViewer2 div dd ul:first-child { width: auto; padding-bottom: 30px; padding-right: 0; }
	.boardList .itemViewer2 div dd ul:last-child li { line-height: 1.4;  }

}