/************************************************************
*
* 공통 CSS
*
************************************************************/
/* noto-sans-kr-100 - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-100.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-100.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-100.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-100.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-100.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-300 - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-300.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-300.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-300.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-300.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-300.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-regular - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-regular.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-700 - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-700.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-700.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-700.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-700.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-700.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-500 - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-500.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-500.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-500.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-500.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-500.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-900 - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/noto-sans-kr-v13-latin_korean-900.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('../fonts/noto-sans-kr-v13-latin_korean-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/noto-sans-kr-v13-latin_korean-900.woff2') format('woff2'), /* Super Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-900.woff') format('woff'), /* Modern Browsers */
  url('../fonts/noto-sans-kr-v13-latin_korean-900.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../fonts/noto-sans-kr-v13-latin_korean-900.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/Roboto-Thin.ttf') format('truetype');
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/Roboto-Light.ttf') format('truetype');
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Roboto-Reqular.ttf') format('truetype');
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/Roboto-Medium.ttf') format('truetype');
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/Roboto-Bold.ttf') format('truetype');
}
/* Roboto-black - latin_korean */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/Roboto-Black.ttf') format('truetype');
}
@font-face {
  font-family: 'twayair';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_tway@1.0/twayair.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
* {margin:0; padding:0; border:0; font-size:16px; color:#333; box-sizing:border-box; font-family: 'Noto Sans KR', sans-serif; line-height: 1.5; word-break: keep-all;}
address, caption, cite, code, dfn, em, strong, th, var {font-style :normal; font-weight:normal}
table {border-collapse:collapse;}
a { text-decoration:none;}
img {vertical-align:middle; border:0;}
ul, li, ol { list-style:none;}
html,body { width:100%; height:100%; min-width:1600px;}
/* input 기본 스타일 초기화 */
input { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; box-sizing:border-box; border-radius:0; box-shadow:none;}
/* IE10 이상에서 input box 에 추가된 지우기 버튼 제거 */
input::-ms-clear { display: none; }
input::placeholder {color:#999; font-size:14px;}
/* input type number 에서 화살표 제거 */
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none;}
select {  border-radius:0; box-shadow:none;}
input:focus {outline:none;}
select:focus {outline:none;}
textarea:focus {outline:none; border-radius:0; box-shadow: 0;}
select::-ms-expand {display:none}
.wrap {width:100%; position: relative; background-color:#fff; }
.inner {width:1152px; margin: auto;}
/**** 공통 CSS END ****/


/************************************************************
*
* header CSS
*
************************************************************/
.header {width:100%; position: relative; z-index:999; min-width:1600px; transition: 0.3s;}
/*.header::before {position: absolute; top: 30px; left: 50%; transform: translateX(-50%); content: ''; width: 100%; height: 1px; background-color: #e8e8e8; opacity: 0;}*/
.header::before {content:""; width:0; height:1px; background-color: #ccc; position:absolute; top:30px; left:50%; transform: translateX(-50%); transition: 0.3s;}
/*.header.active::before {transition:0.6s; transition-delay:1.4s; opacity:1;}*/
.header.active::before {width:100%; transition:0.8s;}
.header.active2::before {width:100%; transition:0s;}
.header.on {background-color:#fff; transition: 0.3s;}
.header.on::before {background-color:#dfdfdf; transition: 0.3s;}
.header.on2 {background-color:#fff;}
.header.on2::before {background-color:#dfdfdf;}
.header .headerInner {overflow: hidden; opacity:0;}
.header.active .headerInner {transition:0.6s; transition-delay:1.4s; opacity:1;}
.header.active2 .headerInner { opacity:1;}

.header .headerInner .hd_top {height: 30px; overflow: hidden;}
.header .headerInner .hd_top ul {float: right; overflow: hidden;}
.header .headerInner .hd_top ul li {position: relative; float: left;}
.header .headerInner .hd_top ul li + li {padding-left: 18px; margin-left: 18px;}
.header .headerInner .hd_top ul li + li::before {position: absolute; top: 50%; transform: translateY(-50%); left: 0; content: ''; width: 1px; height: 12px; background-color: #e4e4e4;}
.header .headerInner .hd_top ul li div {font-size: 13px; color: #777; font-weight: 400; letter-spacing: -0.025em; line-height: 29px;}
.header .headerInner .hd_top ul li div.lang {padding-right: 15px; background: url('../img/common/hd_arrow.png') center right no-repeat; background-size: 6px auto;}

.header .headerInner .hd_bot {position: relative; overflow: hidden;}
.header .headerInner .hd_bot img.logo {position: absolute; top: 50%; transform: translateY(-50%); left: 0;}
.header .headerInner .hd_bot ul {float:right; overflow: hidden;}
.header .headerInner .hd_bot ul li {float:left; margin-left:100px; line-height: 80px;}
.header .headerInner .hd_bot ul li a {font-size: 20px; color:#333; font-weight:500; letter-spacing:-0.025em; line-height:1.5; transition:all 0.2s;}
.header .headerInner .hd_bot ul li a:hover {color: #005b38;}
.header.on .headerInner p {color:#222;}
.header.on .headerInner .hd_bot ul li a {color:#222;}
.header.on .headerInner .hd_bot ul li a:hover {color:#5492F9; opacity:1;}
/**** header END ****/



.footer {width: 100%; background: linear-gradient(#0b1a14, #002819);}
.footer .inner {position: relative; padding: 45px 0 40px; padding-left: 240px;}
.footer .inner .f_logo {position: absolute; top: 50%; transform: translateY(-50%); left: 0; font-size: 0;}
.footer .inner .addr {width: 100%;}
.footer .inner .addr span {position: relative; display: inline-block; font-size: 14px; color: #cecece; font-weight: 400; letter-spacing: -0.025em;}
.footer .inner .addr span + span {padding-left: 12px; margin-left: 12px;}
.footer .inner .addr span + span:before {position: absolute; top: 50%; transform: translateY(-50%); left: 0; content: ''; width: 1px; height: 16px; background-color: #cecece;}

.footer .inner p.copyright {font-size: 14px; color: #999; font-weight: 400; letter-spacing: -0.025em; margin-top: 8px;}
.iso_banner {position: absolute;right: 46px;top: 50px;}

.footer .inner .topBtn {position: absolute; top: 50%; transform: translateY(-50%); right: -37px; margin-top: -15px; content: ''; width: 36px; height: 36px; border: 2px solid #7ec424; -ms-border-radius: 50%; -o-border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background: url('../img/common/topBtn.png') center no-repeat; cursor: pointer;}
.footer .inner .topBtn:hover {background: #7ec424 url('../img/common/topBtn_on.png') center no-repeat; transition: 0.2s all;}


.section {width:100%;}


.sub_visual {width:100%; height:250px; position:relative; z-index:1; overflow: hidden;}
.sub_visual img {min-width:1920px; width:100%;}
.sub_visual span {position:absolute; top: 50%; transform: translateY(-50%); margin-top: -30px; left:0; text-align: center; font-size:25px; color:#fff; font-weight:400; letter-spacing:-0.05em; width:100%; opacity: 0.5;}
.sub_visual p {position:absolute; top: 50%; transform: translateY(-50%); margin-top: 25px; left:0; text-align: center; font-size:60px; color:#fff; font-weight:400; letter-spacing:-0.05em; line-height:54px; width:100%;}

.section {width:100%; }

.nav {width:100%; border-bottom:1px solid #e0e0e0; position:relative; z-index:99;}
.nav .navInner {height:50px;}
.nav .navInner .home {width:55px; height:50px; float:left; background-image:url("../img/common/home.png"); background-repeat: no-repeat; background-position:center; background-color:#fff; border-right:1px solid #e0e0e0; border-left:1px solid #e0e0e0; transition:all 0.2s;}
/*.nav .navInner .home:hover {background-color:#4478cf;}*/
.nav .navInner .depth {width:210px; float:left; position:relative;}
.nav .navInner .depth::after {content:""; width:1px; height:100%; background-color:#e0e0e0; position:absolute; top:0; right:0; z-index:3;}
.nav .navInner .depth .depthTitle {width:100%; height:50px; padding:0px 20px; position:relative; cursor: pointer; z-index:2; background-color:#fff;}
.nav .navInner .depth .depthTitle p {font-size:16px; color:#555; font-weight:400; letter-spacing:-0.025em; line-height:50px; transition:all 0.3s;}
.nav .navInner .depth .depthTitle:hover p {color:#005b38;}
.nav .navInner .depth .depthTitle div { background-image:url("../img/common/navArrow.png"); width:13px; height:9px; position:absolute; top:50%; right:20px; margin-top:-5px; transition:all 0.3s;}
.nav .navInner .depth .depthTitle:hover div {background-image:url("../img/common/navArrow_on.png");}
.nav .navInner .depth .depthTitle.on div {-ms-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); transform: rotate(-180deg);}

.nav .navInner .depth .depthTitleNone {width:100%; height:50px; padding:0px 20px; position:relative; z-index:2; background-color:#fff;}
.nav .navInner .depth .depthTitleNone p {font-size:16px; color:#555; font-weight:400; letter-spacing:-0.025em; line-height:50px; transition:all 0.3s;}

.nav .navInner .depth ul {width:calc(100% + 1px); left:-1px; position:absolute; top:51px; border:1px solid #e0e0e0; border-top:0; display:none; box-shadow:0px 2px 10px rgba(0,0,0,0.15); z-index:1; background-color:#fff;}
.nav .navInner .depth ul li {width:100%; border-bottom:1px solid #e0e0e0; transition:all 0.2s;}
.nav .navInner .depth ul li:hover {background-color:#f8f8f8;}
.nav .navInner .depth ul li:last-child {border-bottom:0;}
.nav .navInner .depth ul li div {width:100%; padding:14px 20px; font-size:14px; color:#777; background-image:url("../img/common/navArrow2.png"); background-position:right 20px center; background-repeat: no-repeat;}

p.subTitle {position: relative; font-size:32px; color:#333; font-weight:400; letter-spacing:-0.05em; line-height:40px; padding: 70px 0 35px; text-align: center;}
p.subTitle::before {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin-top: -12px; content: ''; width: 80px; height: 4px; background-color: #00502f;}

.service_visual {position:relative; z-index:1; width:100%; height:250px; background:url("../img/service/sub_visual.jpg") center top;}
.service_visual span {position:absolute; top: 50%; transform: translateY(-50%); margin-top: -30px; left:0; text-align: center; font-size:25px; color:#fff; font-weight:400; letter-spacing:-0.05em; width:100%; opacity: 0.5;}
.service_visual p {position:absolute; top: 50%; transform: translateY(-50%); margin-top: 25px; left:0; text-align: center; font-size:60px; color:#fff; font-weight:400; letter-spacing:-0.05em; line-height:54px; width:100%;}

.position_visual {position:relative; z-index:1; width:100%; height:250px; background:url("../img/position/sub_visual.jpg") center top;}
.position_visual span {position:absolute; top: 50%; transform: translateY(-50%); margin-top: -30px; left:0; text-align: center; font-size:25px; color:#fff; font-weight:400; letter-spacing:-0.05em; width:100%; opacity: 0.5;}
.position_visual p {position:absolute; top: 50%; transform: translateY(-50%); margin-top: 25px; left:0; text-align: center; font-size:60px; color:#fff; font-weight:400; letter-spacing:-0.05em; line-height:54px; width:100%;}

.contactus_visual {position:relative; z-index:1; width:100%; height:250px; background:url("../img/contactus/sub_visual.jpg") center top;}
.contactus_visual span {position:absolute; top: 50%; transform: translateY(-50%); margin-top: -30px; left:0; text-align: center; font-size:25px; color:#fff; font-weight:400; letter-spacing:-0.05em; width:100%; opacity: 0.5;}
.contactus_visual p {position:absolute; top: 50%; transform: translateY(-50%); margin-top: 25px; left:0; text-align: center; font-size:60px; color:#fff; font-weight:400; letter-spacing:-0.05em; line-height:54px; width:100%;}

