@charset "UTF-8";
@import url(/design/default/css/font.css);

/* behavior: url( "/design/default/css/PIE.htc" ); */

/*-----------------
-------RESET-------
------------------*/
* {margin:0; padding:0; border:0; outline:0;}

html { overflow-y:scroll; }
html,body { width: 100%;}
body{padding-top:115px;}
body,div,h1,h2,h3,h4,h5,h6,p,ul,li,img,a,iframe,dl,dt,dd,th, td, input, select, textarea{
	font-size:13px;
	font-family:'NanumSquare','NanumBarunGothic',"³ª´®¹Ù¸¥°íµñ", 'dotum',"µ¸¿ò",sans-serif;
	*font-family:'Nanum Gothic'; 
	color:#333;
	letter-spacing: -0.2;
	line-height:160%;
}

label {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	-webkit-box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	box-sizing:border-box;
	
}

input {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding:0;}

ul{
	list-style-type:none;
}
img{
	border:0 none;
}
hr{
	position:absolute;
	left:-999px;
	width:0;
	height:0;
	line-height:0;
	overflow:hidden;
	visibility:hidden;
}
a:link,a:visited{
	text-decoration:none;
	color:#666;
}
a:hover,a:active{
	text-decoration:none;
	color:#ef114c;
}
input, select, img, textarea{vertical-align:middle;}
table, th, td{border:none; border-collapse:collapse;box-sizing:border-box;}
caption{display:none;}

select { 
width: 190px; 
height: 40px; 
padding-left: 10px; 
color: #333; 
line-height:40px;
border: 1px solid #ccc; 
border-radius: 3px; 
-webkit-appearance: none; /* È­»ìÇ¥ ¾ø¾Ö±â for chrome*/ 
-moz-appearance: none;    /* È­»ìÇ¥ ¾ø¾Ö±â for firefox*/ 
appearance: none;         /* È­»ìÇ¥ ¾ø¾Ö±â °øÅë*/ 
background:#fff url('/design/default/images/select-arrow.png') no-repeat 92% 50%; /* È­»ìÇ¥ ¾ÆÀÌÄÜ Ãß°¡ */  
}
select::-ms-expand { display: none; /* È­»ìÇ¥ ¾ø¾Ö±â for IE10, 11*/ } 

/* check, hover ½ºÅ¸ÀÏ ¼³Á¤ IE, Chrome */ 
select option:checked,  
select option:hover { background: #d0111b; color: #fff; } 




/* check, hover ½ºÅ¸ÀÏ ¼³Á¤ FireFox */ 
select option:checked, 
select option:hover {  box-shadow: 0 0 10px 100px #b20809 inset;    color: #fff; } 


.inner{width:1200px; margin:0 auto; clear:both; position:relative;}
.clear{clear:both;}

/* °£°Ý */
.mt0{margin-top:0px !important} .mt5{margin-top:5px !important} .mt10{margin-top:10px !important} .mt15{margin-top:15px !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} .mt75{margin-top:75px !important}.mt80{margin-top:80px !important;}
.ml0{margin-left:0px !important} .ml5{margin-left:5px !important} .ml10{margin-left:10px !important} .ml15{margin-left:15px !important} .ml20{margin-left:20px !important} .ml25{margin-left:25px !important} .ml30{margin-left:30px !important} .ml35{margin-left:35px !important} .ml40{margin-left:40px !important} .ml45{margin-left:45px !important} .ml50{margin-left:50px !important} .ml55{margin-left:55px !important}  .ml60{margin-left:60px !important} .ml65{margin-left:65px !important} .ml70{margin-left:70px !important} .ml75{margin-left:75px !important} .ml80{margin-left:80px !important;}
.mr0{margin-right:0px !important} .mr5{margin-right:5px !important} .mr10{margin-right:10px !important} .mr15{margin-right:15px !important} .mr20{margin-right:20px !important} .mr25{margin-right:25px !important} .mr30{margin-right:30px !important} .mr35{margin-right:35px !important} .mr40{margin-right:40px !important} .mr45{margin-right:45px !important} .mr50{margin-right:50px !important} .mr55{margin-right:55px !important} .mr60{margin-right:60px !important} .mr65{margin-right:65px !important} .mr70{margin-right:70px !important} .mr75{margin-right:75px !important} .mr80{margin-right:80px !important;}
.mr0{margin-bottom:0px !important} .mb5{margin-bottom:5px !important} .mb10{margin-bottom:10px !important} .mb15{margin-bottom:15px !important} .mb20{margin-bottom:20px !important} .mb25{margin-bottom:25px !important} .mb30{margin-bottom:30px !important} .mb35{margin-bottom:35px !important} .mb40{margin-bottom:40px !important} .mb45{margin-bottom:45px !important} .mb50{margin-bottom:50px !important} .mb55{margin-bottom:55px !important} .mb60{margin-bottom:60px !important} .mb65{margin-bottom:65px !important} .mb70{margin-bottom:70px !important} .mb75{margin-bottom:75px !important} .mb80{margin-bottom:80px !important;}

.pt0{padding-top:0px !important} .pt5{padding-top:5px !important} .pt10{padding-top:10px !important} .pt15{padding-top:15px !important} .pt20{padding-top:20px !important} .pt25{padding-top:25px !important} .pt30{padding-top:30px !important} .pt35{padding-top:35px !important} .pt40{padding-top:40px !important} .pt45{padding-top:45px !important} .pt50{padding-top:50px !important} .pt55{padding-top:55px !important} .pt60{padding-top:60px !important} .pt65{padding-top:65px !important} .pt70{padding-top:70px !important} .pt75{padding-top:75px !important}.pt80{padding-top:80px !important;}
.pl0{padding-left:0px !important} .pl5{padding-left:5px !important} .pl10{padding-left:10px !important} .pl15{padding-left:15px !important} .pl20{padding-left:20px !important} .pl25{padding-left:25px !important} .pl30{padding-left:30px !important} .pl35{padding-left:35px !important} .pl40{padding-left:40px !important} .pl45{padding-left:45px !important} .pl50{padding-left:50px !important} .pl55{padding-left:55px !important}  .pl60{padding-left:60px !important} .pl65{padding-left:65px !important} .pl70{padding-left:70px !important} .pl75{padding-left:75px !important} .pl80{padding-left:80px !important;}
.pr0{padding-right:0px !important} .pr5{padding-right:5px !important} .pr10{padding-right:10px !important} .pr15{padding-right:15px !important} .pr20{padding-right:20px !important} .pr25{padding-right:25px !important} .pr30{padding-right:30px !important} .pr35{padding-right:35px !important} .pr40{padding-right:40px !important} .pr45{padding-right:45px !important} .pr50{padding-right:50px !important} .pr55{padding-right:55px !important} .pr60{padding-right:60px !important} .pr65{padding-right:65px !important} .pr70{padding-right:70px !important} .pr75{padding-right:75px !important} .pr80{padding-right:80px !important;}
.pr0{padding-bottom:0px !important} .pb5{padding-bottom:5px !important} .pb10{padding-bottom:10px !important} .pb15{padding-bottom:15px !important} .pb20{padding-bottom:20px !important} .pb25{padding-bottom:25px !important} .pb30{padding-bottom:30px !important} .pb35{padding-bottom:35px !important} .pb40{padding-bottom:40px !important} .pb45{padding-bottom:45px !important} .pb50{padding-bottom:50px !important} .pb55{padding-bottom:55px !important} .pb60{padding-bottom:60px !important} .pb65{padding-bottom:65px !important} .pb70{padding-bottom:70px !important} .pb75{padding-bottom:75px !important} .pb80{padding-bottom:80px !important;}


/* Á¤·Ä */
.alCenter{text-align:center !important}
.alRight{text-align:right !important}
.alLeft{text-align:left !important}
.fl{float:left !important}
.fr{float:right !important}
.lh120{line-height:120% !important;}
.lh140{line-height:140% !important;}
.lh160{line-height:160% !important;}
.lh180{line-height:180% !important;}
.lh200{line-height:200% !important;}
.ovH{overflow:hidden;}
.poR{position:relative !important}
.poA{position:absolute !important}
.textIndent{text-indent:-9999px; font-size:0px; height:0}


/*-----------------
-------HEADER------
------------------*/
#header{ background:#3b4052; position:fixed; width:100%; top:0px; margin-top:-0px; z-index:999; height:115px;}
#header .util{ background:#fff; text-align:right; height:30px;}
#header .util a, #header .util span{display:inline-block; line-height:30px; padding:0 20px; border-right:1px solid #c4c1c4; margin-right: -3px;}
#header .util a:hover{background:#f1f1f1;}
#header .util .favor{background:#3b4052; color:#fff;}
#header .util .favor:hover{background:#3b4052;}
#header .util .card{background:#000000; color:#fff;}
#header .util .card:hover{background:#000000;}
#header .util .name{background:#ef114c; color:#fff;}
#header .util .tel{font-size:14px;}

.nav-container {  -webkit-backface-visibility: hidden; max-width: 100%; }
nav {-webkit-backface-visibility: hidden; max-width: 100%; top: 0; width: 100%; z-index: 999;  height:85px;  z-index:998; }

.nav-bar { width:1200px; height: 85px; margin:0 auto; position:relative;}
.nav-bar a { display:inline-block;}
.nav-bar h1{display:table; float: left; height:85px;}
.nav-bar h1 a{display:table-cell; vertical-align:middle;}

.nav-flR{display: inline-block; float: right;}
.nav-flL{display: inline-block; float: left;}

.menu {  width: 100%; height: 85px; margin-right:50px; }
.menu > li {  margin-right: 65px; float: left; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; opacity: 1; }
.menu > li:last-child { /* margin-right: 0; */  }
.menu > li:last-child > ul { /* right: 0; */ }
.menu > li > a { font-size: 17px; font-weight: 600; color: #fff; opacity:0.8; max-width: 100%; text-align:center; line-height:90px; transition: all 0.3s ease;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; }
.menu > li > a:hover {  opacity: 1; color:#ef114c;}
.menu > li > a.selected{ opacity: 1; color:#ef114c;}
.menu > li > ul { width: 590px; background: #fff; position: absolute; z-index: 99; opacity: 0; visibility: hidden; margin: 0px 0 0 -295px; left:50%; top:85px; *display:none;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transform: translate3d(0, 10px, 0);
	-webkit-transform: translate3d(0, 10px, 0);
	-moz-transform: translate3d(0, 10px, 0);
}
.menu > li > ul > li {  position: relative; line-height: 24px; width: 590px !important; vertical-align: top;}
.menu > li > ul > .has-dropdown:after { color: #fff; top: 5px; right: 24px; content: "\e649"; }
.menu > li:hover > ul { opacity: 1; transform: translate3d(0, 0px, 0); -webkit-transform: translate3d(0, 0px, 0); -moz-transform: translate3d(0, 0px, 0); visibility: visible; }
.menu > li:last-child > ul{margin:0 0 0 -410px;}

.has-dropdown {padding-right:20px; background:url(/design/default/images/has_dropdown_arw_black.png) no-repeat right center;}
.has-dropdown:after {  position: absolute; top: 0; right: 0; font-size: 11px; font-family: 'themify'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none;  }
.has-dropdown:hover .mega-menu ul { opacity: 1; transform: translate3d(0, 0px, 0); -webkit-transform: translate3d(0, 0px, 0); -moz-transform: translate3d(0, 0px, 0); visibility: visible; }

.mega-menu {  width: 590px !important; height:222px; border:1px solid #909090;  white-space: nowrap; line-height: 24px; }
.mega-menu .nBanner{width:400px; height:222px; float:left;}
.mega-menu .nBanner.b01{background:url(/design/default/images/nav_s01_bg.jpg) no-repeat center center;}
.mega-menu .nBanner.b02{background:url(/design/default/images/nav_s02_bg.jpg) no-repeat center center;}
.mega-menu .nBanner.b03{background:url(/design/default/images/nav_s03_bg.jpg) no-repeat center center;}
.mega-menu .nBanner.b04{background:url(/design/default/images/nav_s04_bg.jpg) no-repeat center center;}
.mega-menu .nBanner.b05{background:url(/design/default/images/nav_s05_bg.jpg) no-repeat center center;}
.mega-menu .nBanner p{ color:#fff; font-size:20px; line-height:130%; padding:140px 0 0 20px;}
.mega-menu .nBanner p span{display:block;  font-size:13px;}
.mega-menu ul { width:190px; float:left !important; position: relative !important; left: auto !important; padding: 0 !important;}
.mega-menu > li { width: 190px !important; overflow: hidden; display: inline-block;}
.mega-menu > li a{ font-weight:normal; font-size:12px; color:#000; opacity:0.5; padding: 4px 15px 0px;/*padding: 7px 15px 0px; padding: 12px 15px 0px;*/ font-family:'nanum gothic';}
.mega-menu > li a:hover{color:#000; opacity:1;}
.mega-menu .title { letter-spacing: 1px; color: #fff; display: inline-block; padding: 6px 24px; text-transform: uppercase; font-size: 13px; font-weight: 300; }

.etc {position:absolute; right:0px; top:32px; z-index:100; background:none; cursor:pointer;}
.site_map {display:inline-block; background:none;}
.site_map .top{display:block; width:25px; height:4px; background-color:#fff}
.site_map .middle{display:block; width:25px; height:4px; margin-top:5px; background-color:#fff}
.site_map .bottom{display:block; width:25px; height:4px; margin-top:5px; background-color:#fff}

/* site_map */
.total_menu .cancel{position:absolute; right:0; top:100px; background:none; cursor:pointer; }
.total_menu .cancel_btn {font-size:2.5em; color:#fff; background:none; cursor:pointer;}
.total_gnb2 {clear:both; padding:30px 20px 10px 50px; border-top:1px solid #fff; border-bottom:1px solid #fff;}
.total_gnb2 > li{float:left; width:18%; margin-right:2%;}
.etcli > li {padding-bottom:5px;}
.etc .search {display:inline-block; height:27px; vertical-align:top;}
.site_map_logo {width:26% !important; }
.site_map_logo img{width:70%;}
.etcli03 {margin-right:0;}
.etcli > a {display:block; text-align:center; color:#fff; font-size:1.16em; padding-bottom:8px;}
.etcli .total_sub {border-top:1px solid #fff;}
.total_sub {padding:15px 0 0 10px;}
.total_sub  > li {margin-bottom:15px;}
.total_sub  > li.on_line {padding-top:15px; border-top:1px solid #fff;}
.total_sub  > li.on_line:first-child {padding-top:0; border-top: 0 none;}
.total_sub  > li > a {display:block; padding-left:35px; background:url(/design/default/images/site_map_bull.png) no-repeat left 3px; font-size:1em; color:#fff;}
.total_sub  > li > a:hover {text-decoration:underline;}
.total_3depth {padding-left: 18px;}
.total_3depth > li {margin-bottom:5px;}
.total_3depth > li:first-child {margin-top:20px;}
.total_3depth > li > a {background:url(/design/default/images/street_bar.png) no-repeat 0 center; padding-left:10px;  font-size:0.93em; color:#fff; font-weight:300;}
.total_3depth > li > a:hover {text-decoration:underline;}
.total_sub li:last-child .total_3depth{border:0 none;}
.total_sub_wrap > li {float:left; width:15.5%;/*width:19.5%;*/ margin-right:0.5%;}
.total_sub_wrap > li > a {display:block; padding:10px 0;  text-align:center; font-size:1.13em; font-weight:500; color:#86776e; background-color:#fff; }
.total_sub_wrap .clear {clear:both}
.total_menu > .container {padding-top:75px;}
.total_gnb {margin-top:100px;}
.ham {display:inline-block; margin-right:10px;  vertical-align:bottom;}
.ham .top, .ham .middle , .ham .bottom {display:block; width:25px; height:5px; margin-bottom:6px; background-color:#fff;}
.total_tit > h2 {display:inline-block; font-size:2em; vertical-align:top; color:#fff; padding:100px 0 0px;}
.total_menu {display:none; position:fixed;right:0; bottom:0; overflow:hidden; left:0; top:0; z-index:9999; width:100%; height:100%; background-color:rgba(34,68,137,0.95); overflow-y:scroll; }

/*-----------------
-------FOOTER------
------------------*/
#footer{background:#3b4052; clear:both;}
#footer .inner{overflow:auto; padding:55px 0;}
#footer .cs{background:#dfe1e3;}
#footer .cs h2{text-align:center; font-size:40px; text-transform:uppercase;}
#footer .cs .stt{text-align:center; font-size:14px;}
#footer .cs ul{margin-top:60px;}
#footer .cs li{float:left; text-align:center;}
#footer .cs li.email{ width:380px; padding-top:160px; height:100px; font-size:18px; background:url(/design/default/images/cs_icon01.png) no-repeat center top;}
#footer .cs li.tel{ width:326px; margin:0 57px; padding-top:150px; height:110px; font-size:35px; background:url(/design/default/images/cs_icon02.png) no-repeat center top;}
#footer .cs li.webhard{ width:380px; padding-top:160px; height:100px; font-size:18px; background:url(/design/default/images/cs_icon03.png) no-repeat center top;}
#footer .cs li.bank{ width:268px; border:1px solid #fff; font-size:14px; text-align:left; padding:15px 0 15px 110px; background:url(/design/default/images/bank_kb.png) no-repeat 20px center;}
#footer .cs li.bank strong{display:block; font-size:22px;}
#footer .cs li.kakao{ width:326px; margin:0 57px;}
#footer .cs li.kakao a{display:block; background:#ffd800; padding:10px 0; font-size:22px; color:#000; line-height:47px;}
#footer .cs li.kakao p{padding-top:10px;}
#footer .cs li.request{ width:380px;}
#footer .cs li.request a{display:block; background:#f08300; padding:10px 0; font-size:22px; color:#000; line-height:47px; color:#fff;}
#footer .cs li.request a:hover{background:#f04900;}
#footer .cs li.request p{padding-top:10px;}
#footer .link{background:#fff; text-align:center; padding:10px 0;}
#footer .link span{color:#ccc; padding:0 15px;}
#footer .f_logo{ width:340px; float:left;}
#footer .f_about{ width:430px; float:left;}
#footer .f_contact{width:430px; float:left;}
#footer .f_about h3, #footer .f_contact h3{ color:#fff; font-size:34px; font-weight:normal; padding-bottom:15px;}
#footer .f_about p, #footer .f_contact p{ color:#fff; font-size:16px;}

/* Pulse Shrink */
@-webkit-keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}
@keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}
.hvr-pulse-shrink {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
}
.hvr-pulse-shrink:hover, .hvr-pulse-shrink:focus, .hvr-pulse-shrink:active {
  -webkit-animation-name: hvr-pulse-shrink;
  animation-name: hvr-pulse-shrink;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

