﻿@charset "UTF-8";

* {
margin:0;
padding:0
}

html {
width:100%;
height:100%;
background:#fff;
}

body {
position:relative;
font-family:'Titillium Web',Arial,'NanumSquareR',sans-serif;
font-weight:400;
font-size:16px;
color:#454545;
letter-spacing:-.6px;
height:100%;
background:#fff;
-webkit-text-size-adjust:100%;
-moz-text-size-adjust:100%;
-ms-text-size-adjust:100%;
}

.fa { width: 1em; text-align: center;}

body,div,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,form,fieldset,table,tr,th,td {
margin:0;
padding:0
}

ul,ol,li {
list-style:none
}

img,fieldset {
border:none;
vertical-align:top
}

legend,caption {
position:absolute;
top:-9999px;
left:-9999px;
z-index:-1
}

textarea,button {
vertical-align:middle
}

input,select {
vertical-align:middle;
background:#fff;
border:1px solid #ccc;
font-family:'Titillium Web',Arial,'NanumSquareR',sans-serif;
color:#999;
letter-spacing:-.4px;
border-radius:0;
font-size:16px
}

input {
padding:3px 10px;
height:32px
}

option {
padding:3px 10px
}

input[type="radio"],input[type="checkbox"] {
border:0;
padding:0;
height:auto;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none
}

input[type="password"] {
height:40px;
border:1px solid #ccc;
color:#999;
background:#fff;
-webkit-appearance:none;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
font-family:'arial'
}

input[type="text"] {
width:278px;
background:#fff;
-webkit-appearance:none;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none
}

label {
font-size:16px
}

select {
padding:5px;
height:40px;
border:1px solid #ccc;
background:#fff
}

textarea {
padding:10px;
vertical-align:middle;
background:#fff;
border:1px solid #ccc;
font-family:'Titillium Web',Arial,'NanumSquareR',sans-serif;
color:#999;
font-size:16px;
letter-spacing:-.4px;
-webkit-appearance:none;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
border-radius:0
}

a {
text-decoration:none;
color:#454545
}

a:hover,a:focus,a:active {
text-decoration:none
}

table {
border-collapse:collapse;
width:100%
}

button {
background:none;
border:none;
padding:0;
margin:0;
cursor:pointer;
overflow:visible;
white-space:nowrap;
font-size:16px;
font-family:'Titillium Web',Arial,'NanumSquareR',sans-serif
}

button:active {
outline:none
}

button::-moz-focus-inner {
padding:0;
border:0
}

::-webkit-input-placeholder {
color:#999
}

::-moz-placeholder {
color:#999
}

:-ms-input-placeholder {
color:#999
}

:-moz-placeholder {
color:#999
}

.goCon {
display:block;
width:100%;
height:25px;
line-height:25px;
position:absolute;
top:-25px;
left:0;
font-size:20px;
color:#fff;
text-align:center;
background:#333bca;
z-index:9999
}

.goCon:focus,.goCon:active {
top:0
}

#wrapper {
position:relative;
width:100%;
max-width:100%;
overflow:hidden
}

#header {
	position: relative;
	width: 100%;
	height: 80px;
	background: #fff;
	text-align: center;
	overflow: hidden;
	z-index: 10
}

#header h1 {
display:inline-block;
margin-top:0px;
}

#header .gnbBt {
position:absolute;
top:0;
right:0
}

#gnb {
position:absolute;
top:0;
left:100%;
width:100%;
height:100%;
min-height:700px;
background:#37393d;
z-index:9999
}

#gnb .logo {
display:block;
position:absolute;
top:188px;
left:50%;
margin-left:-119px;
z-index:10
}

#gnb > ul {
position:relative;
width:1200px;
height:100%;
margin:0 auto;
overflow:hidden
}

#gnb > ul li {
float:left;
padding-top:420px;
width:25%;
height:100%;
box-sizing:border-box;
border-right:1px solid #4b4d51
}

#gnb > ul li:first-child {
border-left:1px solid #4b4d51
}

#gnb > ul li .oneD {
display:block;
padding:0 40px;
font-size:30px;
color:#fff;
line-height:1;
margin-bottom:50px
}

#gnb > ul li .twoD {
position:relative;
display:block;
padding:0 40px;
font-size:18px;
color:#fff;
line-height:1;
margin-bottom:20px
}

#gnb > ul li .twoD.on,#gnb > ul li .twoD:hover,#gnb > ul li .twoD:focus {
color:#56b74e
}

#gnb > ul li .twoD.on:before {
content:'';
position:absolute;
top:50%;
left:0;
width:40px;
height:1px;
background:#56b74e;
}

#gnb .close {
display:block;
position:absolute;
top:0;
right:0;
z-index:10
}

#footer {
position:relative;
padding:40px 80px 60px;
background:#37393d;
z-index:10
}

#footer:after {
content:"";
clear:both;
display:block!important
}

#footer .left {
float:left
}

#footer .left .links a {
position:relative;
display:inline-block;
padding-right:12px;
margin-right:10px;
font-family:'Titillium Web',Arial,'NanumSquareR',sans-serif;
font-weight:400;
color:#b9b9b9
}

#footer .left .links a:after {
content:'';
width:1px;
height:10px;
background:#4a4c50;
position:absolute;
top:50%;
right:0;
margin-top:-5px
}

#footer .left .links a:first-child {
margin-left:0
}

#footer .left .links a:last-child {
padding-right:0;
margin-right:0
}

#footer .left .links a:last-child:after {
width:0;
height:0
}

#footer .left .links a.type2 {
color:#57b74e
}

#footer .left .address {
word-break:keep-all;
margin-top:20px
}

#footer .left .address span {
position:relative;
display:inline-block;
padding-right:12px;
margin-right:10px;
font-size:14px;
color:#FFF
}

#footer .left .address span:after {
content:'';
width:1px;
height:10px;
background:#4a4c50;
position:absolute;
top:50%;
right:0;
margin-top:-5px
}

#footer .left .address span:last-child {
padding-right:0;
margin-right:0
}

#footer .left .address span:last-child:after {
width:0;
height:0
}

#footer .left .copy {
font-size:14px;
color:#fff;
word-break:keep-all;
margin-top:10px
}

#footer .family {
position:relative;
float:right;
}

#footer .family > a {
display:inline-block;
padding:0 0 0 20px;
border:1px solid #58595b;
box-sizing:border-box;
width:180px;
height:40px;
font-size:14px;
color:#FFF;
line-height:40px;
background:#303135 url(" ../images/family_icon.png") no-repeat right 15px top 50%
}

#footer .family > a.on {
background:#303135 url(../images/family_icon_on.png) no-repeat right 15px top 50%
}

#footer .family > div {
display:none;
position:absolute;
bottom:40px;
left:0;
width:100%
}

#footer .family > div a {
display:block;
padding-left:20px;
font-size:14px;
color:#b9b9b9;
line-height:40px;
background:#58595b;
border-top:1px solid #4f4f4f
}

#cBody {
position:relative;
width:100%;
overflow:hidden
}

.mt0 {
margin-top:0!important
}

.mt5 {
margin-top:5px!important
}

.mt10 {
margin-top:10px!important
}

.mt15 {
margin-top:15px!important
}

.mt18 {
margin-top:18px!important
}

.mt20 {
margin-top:20px!important
}

.mt25 {
margin-top:25px!important
}

.mt30 {
margin-top:30px!important
}

.mt35 {
margin-top:35px!important
}

.mt40 {
margin-top:40px!important
}

.mt45 {
margin-top:45px!important
}

.mt50 {
margin-top:50px!important
}

.mt55 {
margin-top:55px!important
}

.mt60 {
margin-top:60px!important
}

.mt65 {
margin-top:65px!important
}

.mt70 {
margin-top:70px!important
}

.mL10 {
margin-left:10px!important
}

.pt120 {
padding-top:120px!important
}

.pd120 {
padding:120px 0!important
}

.disB {
display:block!important
}

.disIB {
display:inline-block!important
}

.disN {
display:none!important
}

.disT {
display:table!important
}

.taC {
text-align:center!important
}

.taR {
text-align:right!important
}

.taL {
text-align:left!important
}

.verT {
vertical-align:top!important
}

.verM {
vertical-align:middle!important
}

.overF {
width:100%;
overflow:hidden
}

.overV {
overflow:visible!important
}

.fl {
float:left
}

.fr {
float:right
}

.clear {
content:"";
clear:both;
display:block!important
}

.clear:after {
content:"";
clear:both;
display:block!important
}

h3 {
padding:74px 0;
font-family:'Titillium Web','NanumSquareB',Arial,sans-serif;
font-weight:400;
font-size:42px;
color:#000;
text-align:center;
line-height:1
}

h3.info {
padding:74px 0 120px;
position:relative
}

h3.info:after {
content:"";
display:block;
position:absolute;
left:50%;
width:1px;
top:150px;
height:50px;
background:#b2b2b2
}

.bold {
font-family:'Titillium Web','NanumSquareB',Arial,sans-serif!important;
font-weight:400!important
}

.gBold {
font-size:36px;
color:#3ea133!important;
font-family:'Titillium Web','NanumSquareB',Arial,sans-serif;
font-weight:400
}

.btnArea {
text-align:right;
margin-top:30px
}

.okBtn {
display:inline-block;
vertical-align:top;
padding:12px 0;
width:60px;
background:silver;
font-size:16px;
color:#fff;
line-height:1;
text-align:center
}

.grayBtn {
display:inline-block;
vertical-align:top;
padding:15px 0;
width:120px;
background:silver;
font-size:16px;
color:#fff;
text-align:center;
line-height:1;
border-radius:23px
}

.grnBtn {
display:inline-block;
vertical-align:top;
padding:15px 0;
width:120px;
background:#3ea133;
font-size:16px;
color:#fff;
text-align:center;
line-height:1;
border-radius:23px
}

.grnBtn.w180 {
width:180px
}

@media all and (max-width:1215px) {
#header {
text-align:left
}

#header h1 {
padding-left:30px
}

#gnb > ul {
width:-webkit-calc(100% - 40px);
width:calc(100% - 40px)
}

#gnb > ul li .oneD {
padding:0 20%
}

#gnb > ul li .twoD {
padding:0 20%
}

#gnb > ul li .twoD.on:before {
content:'';
position:absolute;
top:50%;
left:0;
width:30px;
height:1px;
background:#56b74e
}

#footer {
padding:40px 30px 60px
}
}

@media all and (max-width:981px) {
#gnb .logo {
margin-left:-99px
}

#gnb .logo > img {
height:100px
}

#gnb > ul li .oneD {
padding-right:0;
font-size:30px
}

#gnb > ul li .twoD {
padding-right:0;
font-size:16px
}

#footer .left .address span:first-child {
display:block;
padding:0;
margin:0
}

#footer .left .address span:first-child:after {
width:0;
height:0
}
}

@media all and (max-width:758px) {
#header {
height:50px
}

#header h1 {
padding-left:15px;
margin-top:-5px
}

#header h1 img {
height:50px
}

#header .gnbBt > img {
height:50px
}

#gnb .logo {
top:50px!important;
margin-left:-60px
}

#gnb .logo > img {
height:50px
}

#gnb > ul {
width:-webkit-calc(100% - 30px);
width:calc(100% - 30px)
}

#gnb > ul li {
padding-top:120px!important;
width:50%;
height:50%
}

#gnb > ul li:first-child {
height:370px
}

#gnb > ul li:nth-child(2) {
height:370px
}

#gnb > ul li:nth-child(3) {
padding-top:0!important;
height:-webkit-calc(100% - 350px);
height:calc(100% - 350px);
border-left:1px solid #4b4d51
}

#gnb > ul li:nth-child(4) {
padding-top:0!important;
height:-webkit-calc(100% - 350px);
height:calc(100% - 350px)
}

#gnb > ul li .oneD {
padding:0 20%;
padding-right:0;
font-size:20px;
margin-bottom:30px
}

#gnb > ul li .twoD {
padding:0 20%;
padding-right:0;
font-size:14px;
margin-bottom:15px
}

#gnb > ul li .twoD.on:before {
content:'';
position:absolute;
top:50%;
left:0;
width:25px;
height:1px;
background:#56b74e
}

#gnb .close > img {
height:50px
}

#footer {
padding:35px 15px 40px;
text-align:center
}

#footer .left {
float:none
}

#footer .left .links a {
padding-right:8px;
margin-right:5px;
font-size:14px
}

#footer .left .address span:nth-child(3) {
padding:0;
margin:0
}

#footer .left .address span:nth-child(3):after {
width:0;
height:0
}

#footer .left .address span:last-child {
display:block
}

#footer .left .copy span {
display:block
}

#footer .family {
display:none
}

h3 {
padding:50px 0 40px;
font-size:26px
}

h3.info {
padding:50px 0 70px
}

h3.info:after {
height:35px;
top:90px
}

.gBold {
font-size:18px
}

.btnArea {
text-align:center;
margin-top:20px
}

.okBtn {
padding:8px 0 9px;
width:50px;
font-size:13px
}

.grayBtn {
padding:9px 0 10px;
width:80px;
font-size:13px;
line-height:1;
border-radius:17px
}

.grnBtn {
padding:9px 0 10px;
width:80px;
font-size:13px;
line-height:1;
border-radius:17px
}

.grnBtn.w180 {
width:110px
}
}

@media all and (max-width:350px) {
#wrapper {
min-height:550px
}
}
