@charset "utf-8";

/* default */
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url(fonts/NotoSansKR-Thin.woff2) format('woff2'),
	   url(fonts/NotoSansKR-Thin.woff) format('woff'),
	   url(fonts/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(fonts/NotoSansKR-Regular.woff2) format('woff2'),
		url(fonts/NotoSansKR-Regular.woff) format('woff'),
		url(fonts/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 600;
	src: url(fonts/NotoSansKR-Medium.woff2) format('woff2'),
		url(fonts/NotoSansKR-Medium.woff) format('woff'),
		url(fonts/NotoSansKR-Medium.otf) format('opentype');
}
* {padding:0; margin:0;}
html {height:100%; font-size:8px; -webkit-text-size-adjust:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
body {position:relative; min-width:320px; height:100%; font-size:1.6rem; line-height:1.4; word-break:keep-all;}
body, a, select, button, pre, input, textarea {font-family:'HelveticaNeue-Light', 'AppleSDGothicNeo-Light', 'Noto Sans CJK KR', 'Noto Sans KR', 'Malgun Gothic', sans-serif, Arial, Dotum, Gulim, Verdana, Tahoma;}
button {border:0; cursor:pointer;}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0;}
header, section, article, aside, footer, nav {display:block;}
h1, h2, h3, h4, h5, strong, b, th {font-weight:600;}
legend, .hidden {position:absolute; left:-9999px; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden;}
caption {height:0; font-size:0; line-height:0; overflow:hidden;}
pre {white-space:pre-wrap;}
fieldset {border:0;}
li {list-style:none;}
img {max-width:100%; border:0;}
a {text-decoration:none;}

/* layout */
.ie_update {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8); padding-top:100px; color:#fff; font-size:16px; text-align:center; z-index:2000;}
.ie_update .msg_update {position:absolute; top:50%; left:50%; margin:-67px 0 0 -155px;}
.ie_update .btn_area {margin-top:30px;}
.btn {display:inline-block; box-sizing:border-box; text-align:center; vertical-align:middle; white-space:nowrap; text-decoration:none !important;}
.btn {padding:0 30px; color:#fff; margin:0 5px; line-height:40px; background:#3b415a;}

body {position:relative; background:#f5f5f5;}
.inner {position:relative; box-sizing:border-box; width:100%; margin:auto; padding:0 20px;}
section {position:relative; box-sizing:border-box; min-height:100vh;}
section .inner {padding-top:4rem; padding-bottom:4rem;}
#header {position:fixed; left:0; right:0; top:0; min-width:320px; height:6.4rem; background:rgba(23,24,26,0.9); z-index:1000;}
#logo {position:absolute; left:20px; top:1.9rem;}
#logo a {display:block; width:11.3rem; height:2.7rem;}
#logo a img {display:block;}
#btn_menu {display:block; position:absolute; top:0; right:0; width:6.4rem; height:6.4rem; color:#fff; line-height:6.4rem; text-indent:100%; white-space:nowrap; background:url(../images/ico_menu.png) no-repeat center center; background-size:20px 5px; overflow:hidden; transition:0.3s;}
#btn_menu.on {transform:rotate(-90deg);}
#gnb {display:none; position:absolute; top:6.4rem; right:0; padding:1rem 0 1.5rem; background:rgba(23,24,26,0.9);}
#gnb li a {display:block; color:#fff; font-size:1.6rem; line-height:30px; padding:0 25px; text-align:center;}
#gnb li.active a {color:#00afdc; transition:0.3s;}
#footer {min-height:0; background:#000; text-align:center;}
#footer .inner {padding-top:2.2rem; padding-bottom:3rem;}
#logo_btm {display:block; width:14.6rem; height:3.9rem; margin:auto;}
#footer, #footer a {color:#b4b2b3;}
#footer address {display:block; margin:2rem 0; font-style:normal;}

/* 로딩 */
#loading {background-color:#fff; height:100%; width:100%; position:fixed; margin-top:0px; top:0px; right:0; left:0; bottom:0; z-index:100000000;}
#loading-center {width:100%; height:100%; position:relative;}
#loading-center-absolute {position:absolute; left:50%; top:50%; height:200px; width:200px; margin-top:-100px; margin-left:-100px; -ms-transform:rotate(-135deg); -webkit-transform:rotate(-135deg); transform:rotate(-135deg);}
.object {-moz-border-radius:50% 50% 50% 50%; -webkit-border-radius:50% 50% 50% 50%; border-radius:50% 50% 50% 50%; position:absolute; border-top:5px solid #374048; border-bottom:5px solid transparent; border-left:5px solid #374048; border-right:5px solid transparent; -webkit-animation:loadingRotate 2s infinite; animation:loadingRotate 2s infinite;}
#object_one {left:75px; top:75px; width:50px; height:50px;}
#object_two {left:65px; top:65px; width:70px; height:70px; -webkit-animation-delay:0.2s; animation-delay:0.2s;}
#object_three {left:55px; top:55px; width:90px; height:90px; -webkit-animation-delay:0.4s; animation-delay:0.4s;}
#object_four {left:45px; top:45px; width:110px; height:110px; -webkit-animation-delay:0.6s; animation-delay:0.6s;}
@keyframes loadingRotate {
	50% {
		-ms-transform: rotate(360deg) scale(0.8);
		-webkit-transform: rotate(360deg) scale(0.8);
		transform: rotate(360deg) scale(0.8);
	}
}

/* common */
.tit1 {position:relative; font-size:5rem; line-height:9rem; font-family:'Myriad Pro', 'HelveticaNeue-Light', 'AppleSDGothicNeo-Light', 'Noto Sans KR', 'Malgun Gothic', sans-serif, Arial, Verdana, Tahoma; letter-spacing:-0.03em;}
.tit1:before {content:''; position:absolute; top:0; left:0; width:8rem; height:1px; background:#000;}
.main_copy {font-size:2.4rem; line-height:1.4; letter-spacing:-0.03em;}
.pagination {font-size:0; line-height:0; text-align:center;}
.swiper-pagination-bullet {display:inline-block; box-shadow:inset 1px 1px 1px rgba(0,0,0,0.5); width:1.1rem; height:1.1rem; margin:0 4px !important; border:0; border-radius:0; text-indent:100%; white-space:nowrap; vertical-align:top; background:#5d5d5d; overflow:hidden;}
.swiper-pagination-bullet-active {background:#13a89e;}
.btn_prev, .btn_next {position:absolute; top:45%; width:1.3rem; height:2.6rem; text-indent:100%; white-space:nowrap; background:url(../images/btn_slider_prev.png) no-repeat; background-size:100% auto; cursor:pointer; opacity:0.5; overflow:hidden; z-index:100; transition:0.3s;}
.btn_prev {left:1rem;}
.btn_next {right:1rem; background-image:url(../images/btn_slider_next.png);}
.swiper-button-disabled {opacity:0.2;}

/* content */
/* 홈 */
#home {position:relative; display:flex; align-items:center; height:100%; background:#000; overflow:hidden;}
#home:before {display:block; content:''; position:absolute; left:0; top:0; right:0; bottom:0; bottom:-5rem; background:url(../images/bg_home.jpg) no-repeat center center; background-size:cover; animation:mainFade 16s forwards;}
#home .inner {padding-top:8rem; padding-left:0; padding-right:0;}
#home .slogan {color:#fff; letter-spacing:-0.03rem; text-align:center;}
#home .slogan .copy1 {font-size:2.5rem; font-family:'Myriad Pro', 'HelveticaNeue-Light', 'AppleSDGothicNeo-Light', 'Noto Sans KR', 'Malgun Gothic', sans-serif, Arial, Verdana, Tahoma; letter-spacing:0;}
#home .slogan .copy2 {margin-top:4rem; letter-spacing:-0.03rem; line-height:1.1;}
#home .slogan .copy2>span {display:inline-block; font-size:4rem;}
#home .slogan .copy2>strong {display:inline-block; margin-top:1rem; color:#13a89e; font-size:5rem; text-shadow:0.4rem 0.4rem 0.4rem rgba(0,0,0,0.2);}
#home .slogan .copy3 {margin:5rem 0 0; font-weight:100; font-size:2rem;}
#home .scroll {display:none; text-align:center;}
#home .scroll img {position:relative; animation:mouseMotion 1s infinite; animation-delay:3s;}
#home .nl {display:block;}
@keyframes mainFade { 
	0% {opacity:0.5;}
	10% {opacity:1;}
	50% {left:-5rem; top:-5rem; right:-5rem; bottom:-5rem;}
	100% {left:0; top:0; right:0; bottom:0;}
}
@keyframes mouseMotion {
	0% {top:0;}
	30% {top:-2rem;}
	70% {top:0;}
}

/* 회사소개 */
#company {overflow:hidden;}
#company .inner {position:static; overflow:hidden;}
#company .pagination {margin-top:4.5rem;}
#company .main_copy {font-size:2rem;}
.company_slider {margin:auto;}
.company p {margin-top:1.5em;}
.company p br {display:none;}
.company .visual {margin-top:3rem; height:15rem; overflow:hidden;}
.company .visual img {float:left; width:25%; min-height:100%; vertical-align:top;}

/* 사업실적 */
.tap_nav {display:flex; padding-left:1px;}
.tap_nav li {flex-grow:1; border:1px solid #e7e7e7; margin-left:-1px;}
.tap_nav li a {display:block; color:#151313; font-size:1.8rem; line-height:4.8rem; text-align:center; background:#fff;}
.tap_nav li.on a {color:#fff; background:#0083a1;}
.tap_cont {position:relative; margin-top:-1px; border:1px solid #e7e7e7; background:#fff;}
.tap_cont dl {display:none; box-sizing:border-box; padding:1.5rem 2rem;}
.tap_cont dt {position:absolute; left:-9999px; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden;}
.tap_cont dd {display:flex; margin-top:2.2rem; font-size:1.8rem; line-height:2.2rem;}
.tap_cont dt+dd {margin-top:0;}
.tap_cont dd strong {display:inline-block; min-width:3em; margin-right:1rem; color:#0083a1; vertical-align:top;}
.tap_cont dd span {color:#383838; vertical-align:top;}
.tap_cont .visual {display:none;}

/* 비즈니스 */
.business {display:flex; flex-wrap:wrap; margin:1.75em -1.25rem 0;}
.business .item {display:flex; flex-wrap:wrap; margin:1.25rem; width:100%;}
.business .item h3 {display:none;}
.business .item .tmb {width:100px; margin-right:20px;}
.business .item .tmb img {vertical-align:top;}
.business .item dl {width:calc(100% - 120px);}
.business .item dt {border-top:2px solid #00afdc; padding:1rem 0; font-size:1.8rem; line-height:2rem;}
.business .item dd {font-size:1.4rem; line-height:1.7; text-indent:-0.6em; padding-left:0.6em;}
.business .item dd br {display:none;}
.business .item dd:before {display:inline; content:'- ';}
@keyframes bizFade { 
	25% {width:100%;}
	100% {width:100%; height:36.5rem; background:rgba(1,21,19,0.75);}
} 

/* 포트폴리오 */
#portfolio {position:relative; overflow:hidden;}
#portfolio .inner {position:static; overflow:hidden;}
.portfolio_slider .swiper-slide {margin-bottom:2rem;}
.portfolio_slider a {color:#000; overflow:hidden;}
.portfolio_slider a:hover .tmb:after, .portfolio_slider a:focus .tmb:after {opacity:1;}
.portfolio_slider .tmb {display:block; position:relative; height:0; margin-bottom:3rem; padding-top:65.63%; border:1px solid #d9d9d9;}
.portfolio_slider .tmb img {position:absolute; top:0; left:0; width:100%; height:100%;}
.portfolio_slider .tmb:after {display:block; content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.75) url(../images/ico_link.png) no-repeat center center; background-size:23px 23px; opacity:0; transition:0.3s;}
.portfolio_slider .tit {display:block; font-size:1.8rem; line-height:3.9rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.portfolio_slider .tit:before {display:block; content:''; position:absolute; width:4.4rem; height:1px; background:#00afdc;}
.portfolio_slider .pagination {margin-top:4rem;}

/* CONTACT */
.location {margin-top:6.5rem;}
.location dl {margin-bottom:3rem;}
.location dt {margin:0 1rem 1.5rem 0; font-size:2.2rem; line-height:3rem;}
.location dt:before {display:inline-block; content:''; width:1.8rem; height:2.8rem; margin-right:0.5rem; vertical-align:middle; background:url(../images/ico_loc.png) no-repeat; background-size:100% auto;}
.location dd.address {margin-bottom:2.5rem; color:#383838; font-size:1.7rem; line-height:2.2rem;}
.location dd.map {clear:both; height:30rem; border:1px solid #007ab5; color:#383838; font-size:1.8rem;}
.root_daum_roughmap {width:auto !important;}
.root_daum_roughmap .wrap_map {height:30rem !important; background:#007ab5 !important;}
.root_daum_roughmap .wrap_controllers {display:none;}
.root_daum_roughmap .map_border {display:none;}

/* iPhone 6 plus */
@media only all and (min-width:414px) {
	/* layout */
	#btn_menu {display:none;}
	#gnb {display:block; top:0; padding:0; border-right:1px solid rgba(255,255,255,0.07); background:none; overflow:hidden;}
	#gnb li {float:left; box-sizing:border-box; border-left:1px solid rgba(255,255,255,0.07);}
	#gnb li a {padding:0 1.3rem; font-size:1.5rem; line-height:6.4rem;}
}

/* Tablet & PC */
@media only all and (min-width:768px) {
	/* layout */
	html {font-size:8px;}
	#gnb li {width:16.4rem;}
	#gnb li a {padding:0 1.2rem; font-size:1.6rem;}
	section .inner {padding-top:10rem; padding-bottom:10rem;}
	#footer .inner {padding-top:4rem; padding-bottom:6rem; text-align:left;}
	#logo_btm {margin:0;}
	
	/* common */
	.tit1 {font-size:7.7rem; line-height:12.5rem;}

	/* content */
	/* 홈 */
	#home .slogan .copy1 {font-size:2.7rem;}
	#home .slogan .copy2 {margin-top:4rem; letter-spacing:-0.1em; line-height:1.15;}
	#home .slogan .copy2 span {border-bottom:1px solid rgba(255,255,255,0.2); font-size:6rem; text-indent:-0.1em;}
	#home .slogan .copy2 strong {margin-top:0; border-bottom:1px solid rgba(255,255,255,0.2); font-weight:normal; font-size:7rem; text-indent:-0.1em;}
	#home .slogan .copy3 {margin-top:10rem; font-weight:100; font-size:2rem;}
	#home .scroll {display:block; margin-top:13rem;}
	#home .nl {display:inline;}

	/* 회사소개 */
	#company .main_copy {font-size:2.4rem;}

	/* 비즈니스 */
	.business .item {width:calc(50% - 2.5rem);}

	/* 사업실적 */
	.tap_cont dl {width:50%; padding:2.5rem 5rem 0; height:49.3rem; overflow-y:auto;}
	.tap_cont dl:after {display:block; content:''; height:2.5rem;}
	.tap_cont .visual {display:flex; align-items:center; justify-content:center; position:absolute; top:1rem; right:5rem; bottom:0; left:calc(50% + 5rem);}
}

/* PC */
@media only all and (min-width:1025px) {
	/* default */
	.inner {max-width:1430px; padding-left:15px; padding-right:15px;}
	html {font-size:10px; letter-spacing:-0.03rem;}
	h1, h2, h3, h4, h5, strong, b, th {font-weight:500;}

	/* common */
	 .btn_prev, .btn_next {width:2.6rem; height:5.1rem;}
	.tit1:before {width:11.2rem; height:2px;}
	 
	/* content */
	/* 홈 */
	#home {display:block; height:auto; min-height:100vh;}
	#home .inner {padding:18rem 0 9rem;}

	/* 회사소개 */
	.company {box-sizing:border-box; padding-right:40rem;}
	.company .visual {display:block; position:absolute; top:0; width:60rem; height:60rem; right:1.5rem; margin:0; transform:scale(0.5); transform-origin:90% 50%;}
	.company .visual img {position:absolute; float:none; width:auto; min-height:0;}
	.company .visual .obj1 {top:3.3rem; right:31.4rem;}
	.company .visual .obj2 {top:24.5rem; right:29.9rem; box-shadow:0.7rem 0.7rem 0.7rem rgba(0,0,0,0.2);}
	.company .visual .obj3 {top:8.5rem; right:7.6rem; box-shadow:0.7rem 0.7rem 0.7rem rgba(0,0,0,0.2);}
	.company .visual .obj4 {top:27.3rem; right:0;}

	/* 사업실적 */
	.tap_cont dl {height:42.4rem;}

	/* 비즈니스 */
	.business {flex-wrap:nowrap;}
	.business .item {position:relative; flex-shrink:1; width:auto; padding-bottom:6.9rem; color:#000; overflow:hidden;}
	.business .item h3 {display:block; position:absolute; bottom:0; left:0; right:0; font-weight:400; font-size:1.6rem; line-height:3.9rem; white-space:nowrap;}
	.business .item h3:before {display:block; content:''; position:absolute; width:4.4rem; height:1px; background:#00afdc;}
	.business .item .tmb {width:100%; margin:0;}
	.business .item dl {display:flex; flex-wrap:wrap; align-items:center; align-content:center; position:relative; position:absolute; top:0; left:0; right:0; bottom:6.9rem; width:auto; margin-top:5rem; padding:0 2rem; color:#fff; text-align:center; z-index:100; transition:0.6s; opacity:0;}
	.business .item:after {display:block; content:''; position:absolute; right:0; bottom:6.9rem; width:6.2rem; height:6rem; background:rgba(36,34,35,0.9) url(../images/ico_more1.png) no-repeat center center; background-size:1.9rem 1.9rem;}
	.business .item:after, .business .item dl {transition:0.6s;}
	.business .item:hover:after, .business .item:focus:after {animation:bizFade 0.6s forwards; background-image:none;}
	.business .item:hover dl, .business .item:focus dl {opacity:1; margin-top:0;}
	.business .item dt, .business .item dd {width:100%;}
	.business .item dt {padding:1.5rem 0; font-size:1.6rem; line-height:1.8rem; word-break:normal;}
	.business .item dd br {display:block;}
	.business .item dd {padding-left:0; font-size:1.2rem; line-height:1.5; text-indent:0;}
	
	/* 포트폴리오 */
	.portfolio_slider .tmb:after {background-size:46px 46px;}

	/* CONTACT */
	.location {display:flex; justify-content:space-between;}
	.location dl {width:calc(50% - 1.5rem);}
	.location dd.map {height:45rem;}
	.root_daum_roughmap .wrap_map {height:45rem !important;}
}
@media only all and (min-width:1280px) {
	/* content */
	/* 홈 */
	#home .inner {padding:26.5rem 0 11rem;}
	#home .slogan .copy2>strong {margin-top:1.4rem;}

	/* 비즈니스 */
	.business {flex-wrap:nowrap; justify-content:space-between;}
	.business .item {align-items:center; flex-basis:26rem;}
	.business .item h3 {font-size:1.8rem;}
	.business .item dt {font-size:1.8rem; line-height:2rem; letter-spacing:-0.08rem;}
	.business .item dd {font-size:1.4rem; line-height:1.7;}

	/* CONTACT */
	.location dt, .location dd.address {float:left;}
	.location dd.address {line-height:3rem;}
}
@media only all and (min-width:1400px) {
	/* layout  */
	#footer {font-weight:300; font-size:16px; line-height:30px;}
	#footer .inner {position:relative; padding-left:240px;}
	#footer address {margin:0 0 2rem;}
	#footer #logo_btm {position:absolute; top:4.6rem; left:15px;}

	/* common */
	.btn_prev, .btn_next {opacity:1;}
	.btn_prev {left:5rem;}
	.btn_next {right:5rem;}
	.swiper-button-disabled {opacity:0.5;}

	/* content */
	/* 회사소개 */
	.company {padding-right:65rem;}
	.company .main_copy {margin-bottom:2.5em;}
	.company .visual {transform:scale(1);}
	.company p br {display:block;}
}