@charset "utf-8";

html, body {width:100%;height:100%; top:0px; padding:0; font-family:Malgun Gothic;}

.off-nav-links {display:none;}

/* ============================================================================================================================================================================================
===== Wrap */
#wrap {
	position:relative;top:0;left:0;margin:0 auto;padding:0;
	width:100%;
	overflow-x:hidden;
	vertical-align:top;

	
}



/* ============================================================================================================================================================================================
===== Navigation */
aside#gnb{position:absolute;left:-100%;top:0;width:100%;height:100%;z-index:9999999;}
aside#gnb .cont1{position:relative;left:0;top:0;width:250px;height:100%;background:#fff; z-index:1000000; }
aside#gnb header{width:100%;height:55px; border-top:10px solid #192268;}
aside#gnb header .login{padding:0 15px;}
aside#gnb header span{display:block;float:left;font-weight:bold;font-size:16px;line-height:45px; width:90%;}
aside#gnb header .btn_logout{margin-top:15px;overflow:hidden;display:block;float:right;width:16px;height:45px;background:url("../images/common/btn_logout.png") no-repeat center top;background-size:12px 16px; text-indent:-1000em;}
aside#gnb header .btn_close{overflow:hidden;display:block;position:absolute;right:-50px;top:0;width:50px;height:48px;background:url("../images/common/btn_x.png") no-repeat center center;background-size:50px 48px;text-indent:-1000em;}
aside#gnb .btns{clear:both;background:#e2e2e2;height:10px;}

aside#gnb .category_list{top:0px; margin-top:0px; padding-top:0px; z-index:1000000; }
aside#gnb .category_list ul{}
aside#gnb .category_list ul li{background:#e9e9e9;border-bottom:solid 1px #b6b6b6;  width:100%; text-align:left;}
aside#gnb .category_list ul li a{display:block;padding:0 15px;font-size:13px;line-height:50px;color:#323232; font-weight:800; text-align:left;}
aside#gnb .category_list ul li.selected a,
aside#gnb .category_list ul li a:hover{background:url("../images/common/icon4.png") no-repeat right 10px center #ffffff;background-size:20px 20px;color:#192268 !important; font-weight:800;}

aside#gnb .category_list ul.dep2 {position:relative;  display:block;   text-align:left; background-color:#fff; }
aside#gnb .category_list ul.dep2 li{ padding-left:5%; background-color:#fff; text-align:left; width:95%; }
aside#gnb .category_list ul.dep2 li a{display:block; background:none; padding:7px 5px; white-space:nowrap;   font-size:12px; line-height:18px; color:#323232 !important; font-weight:500; }
aside#gnb .category_list ul.dep2 li a:hover,
aside#gnb .category_list ul.dep2 li a:focus{color:#192268; background:none;}

.bg_gnb{position:fixed;left:-100%;top:0;width:100%;height:100%;background:url("../images/common/bg_black80.png");}





/* ============================================================================================================================================================================================
===== Header */
#header{position:relative;left:0; top:0px; max-width:1200px; height:140px; margin:0px auto; }

#header .logo{  width:250px;  margin:0px auto; }
#header .logo img {width:100%; margin-top:35px;}



/*=====  슬로건 */
#header .slogan {width:25%; text-align:left; float:left; }
#header .slogan img {width:100%; height:auto; margin-top:42px;}


/*=====  오른쪽상단 한국어영어 */
#header a.btn_kor{position:absolute;right:80px;top:45px; padding:7px 10px 10px; font-weight:bold; font-size:12px; line-height:2; color:#fff;  background-color:#d3d3d3; border-radius:70px;}
#header a.btn_eng{position:absolute;right:30px;top:45px; padding:7px 10px 10px; font-weight:bold; font-size:12px;  line-height:2; color:#fff;  background-color:#d3d3d3; border-radius:70px;}
#header a.on {color:#fff; background-color:#404040;}




/*=====  상단메인메뉴 */
#gnb_contain_back {background-color:#192268; height:65px; width:100%;}
#gnb_contain { max-width:1200px;   position:relative; z-index:100000;  margin:0px auto;}
#gnb {width:100%; margin:0 auto; height:65px; }
#gnb ul{float:left; padding:0; list-style:none;  width:100%; }
#gnb ul li {float:left;list-style-type: none; width:25%; }
#gnb ul li a {padding:10px 0px 0px; display:block; color: #fff;  text-align:center;  height:55px; font-size:21px; line-height:2; font-weight: bold; font-family:'malgun Gothic'; text-decoration:none;}
#gnb ul li a:hover{ color: #fff; background-color:#1c3c76;  }

#snb {display:none; top:1px; width:100%; height:140x; background-color:#fff; border-bottom:solid 2px #1c3c76; border-top:1px solid #dedede;}
#submenu {width:100%; height:auto; overflow:hidden; margin:0px auto;  }
#submenu1 {float:left; text-align:left; width : -webkit-calc(25% - 1px);  width : -moz-calc(25% - 1px);  width : calc(25% - 1px); text-align:center; height:230px; border-right:1px solid #dedede; padding:15px 0px 25px;}
#submenu2 {float:left; text-align:left; width : -webkit-calc(25% - 1px);  width : -moz-calc(25% - 1px);  width : calc(25% - 1px); text-align:center; height:230px; border-right:1px solid #dedede; padding:15px 0px 25px;}
#submenu3 {float:left; text-align:left; width : -webkit-calc(25% - 1px);  width : -moz-calc(25% - 1px);  width : calc(25% - 1px); text-align:center; height:230px; border-right:1px solid #dedede; padding:15px 0px 25px;}
#submenu4 {float:left; text-align:left; width : -webkit-calc(25% - 1px);  width : -moz-calc(25% - 1px);  width : calc(25% - 1px); text-align:center; height:230px; border-right:1px solid #dedede; padding:15px 0px 25px;}
#submenu5 {float:left; text-align:left; width : -webkit-calc(25% - 1px);  width : -moz-calc(25% - 1px);  width : calc(25% - 1px); text-align:center; height:230px;  padding:15px 0px 25px;}

#submenu a{color:#000000; font-size:15px;  text-align:left;text-decoration:none; line-height:2;}
#submenu a:hover{ color: #ff4a26;}
#submenu a.on { color: #ff4a26; font-weight:800;}












#topmenu {position:relative; left:0; width:100%; padding:1px;  height:40px; background-color:#192268; color:#fff; text-align:center;}
#topmenu  {margin-top:0px; }
#topmenu  table {width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed;word-break:break-all;border:0; }
#topmenu  table td { line-height:40px; color:#fff; font-size:12px; font-weight:800;  text-align:center; }
#topmenu  table td a {color:#fff;}
#topmenu  table td a:hover {color:#000 !important;}

#topmenu_sun {position:relative; left:0; width:100%;   height:2px; background-color:#192268; color:#fff; text-align:center;}
#topmenu_sun2 {position:relative; left:0; width:100%;   height:5px; background-color:#192268; color:#fff; text-align:center;}
#topmenu_sun22 {position:relative; left:0; width:100%;   height:1px; background-color:#e9e9e9; color:#fff; text-align:center;}







/*===== Header */
#header2 {position:relative;left:0;top:0;width:100%; height:55px;}
#header2 .hsearch {position:absolute;left:0;bottom:0;width:100%;height:55px;}
#header2 .hsearch h1.logo{position:absolute; top:12px; width:100%; text-align:center; height:auto; z-index:2;}
#header2 .hsearch h1.logo img{width:103px; height:auto; padding-right:10%;}
#header2 .hsearch a.btn_login{position:absolute;right:10px;top:15px;padding:5px 7px;border:solid 1px #ea4242;font-weight:bold;font-size:12px;color:#ea4242; z-index:4;}

.btn_menu{position:absolute;left:0;top:10px;width:45px;height:35px;z-index:4; }
.btn_menu a{display:block;width:100%;height:100%;background:url("../images/common/btn_menu2.png") no-repeat center center;background-size:23px auto;}



/* ============================================================================================================================================================================================
===== Container */




#container {
	position:relative;top:0;left:0;
	margin:0px auto 0px;padding:0;
	width:100%;
	
}

#container_main {
	position:relative;top:0;left:0;
	margin:0px auto 0px;padding:0;
	width:100%;
	
}

#container_login {
	position:relative;top:0;left:0;
	margin:0px auto 0px;padding:0;
	width:100%;
	
}

#container .con_form{
	max-width:700px;
	margin:0 auto;padding:0;
}

#con_sub {background-color:#fff;   }

/* ============================================================================================================================================================================================
===== Footer */
#footer {	position:relative;top:0;left:0;padding:15px 0px; 	z-index:20; margin-top:20px; background-color:#f4f4f4; }
#footer:after{clear:both;display:block;content:"";}
#footer .fnb{padding:15px 0 10px; width:100%; text-align:center; color:#656565; font-weight:800; font-size:14px;}
#footer .fnb_na{padding:10px 5%; width:90%; text-align:center; background:#fff; color:#656565; margin:0px auto; font-size:15px; line-height:24px; letter-spacing:-1px;}


#footer .siteinfo{clear:both;  width:1200px;  text-align:left; height:auto; overflow:hidden; padding:35px 0px 35px 20px;     margin:0px auto; }
#footer .siteinfo span{margin:0px; font-size:14px ; font-family: 'Noto Sans KR', 'NanumGothic', 'NanumBarunGothic' , 'NanumSquare',sans-serif ;color:#000000; line-height:1.7;}

#footer .flogo {float:right; width:10%; height:auto; display:inline-block; margin-right:5%; }
#footer .flogo img {width:100%;}

#footer .cus_tel { width:84%;  padding:25px 3%; margin:15px 5%; background-color:#fff; min-height:80px;  border-radius:10px; display:inline-block; }
#footer .cus_tel ul li {float:left; font-size:30px; line-height:1.3; font-weight:800; color:#192268;  padding:0px 1%;  }
#footer .cus_tel ul li img {vertical-align:middle; }
#footer .cus_tel ul li.fax {  padding:12px 0px 0px 4%;  margin-left:4%;  height:38px;  border-left:1px solid #CCC;   }
#footer .cus_tel ul li h1{font-size:17px; color:#000;  line-height:1.3; font-weight:800;}








#footer .btn_top{display:block;position:absolute;right:10px;bottom:0;width:40px;height:34px;border:solid 1px #b3b3b3;z-index:10;}
#footer .btn_top img{width:100%;height:100%;}

/* 바로가기 */
.fgoto{border-bottom:solid 1px #e41112;}
.fgoto .cont1{padding:20px 0;background:#eee;}
.fgoto .cont1:after{clear:both;display:block;content:""; }
.fgoto .cont1 ul{margin:0 0 0 3.75%;width:92.5%;}
.fgoto .cont1 ul li{float:left;width:50%;}
.fgoto .cont1 ul li a{display:block;margin:-1px 0 0 -1px;padding:10px;background:#fff;border:solid 1px #d4d4d4;font-size:12px;text-align:center;}
/* ============================================================================================================================================================================================
===== Etc. */
.clear{display:block;float:none;clear:both;width:100%;height:0;font-size:0 !important;line-height:0 !important;overflow:hidden;margin:0 !important;padding:0 !important;}



/* sub visual */
.sVisual {width:100%;height:243px; z-index:99;}
.sVisual span {display:block;width:100%; height:245px; background-repeat:no-repeat; background-position:center 0; background-color:#000; }


.sub01 {background:url("../image/sub/subpromo01.jpg") center top no-repeat;} 
.sub02 {background:url("../image/sub/subpromo02.jpg") center top no-repeat;} 
.sub03 {background:url("../image/sub/subpromo03.jpg") center top no-repeat;} 
.sub04 {background:url("../image/sub/subpromo04.jpg") center top no-repeat;} 

/* submenu */

.submenu_sub { position:relative;   margin:0px auto;  width:100%; background-color:#f5f5f5;  z-index:100;  text-align:center;}

.submenu_sub .lst {width:1200px;  margin:0px auto;  height:60px; padding:0px 0px; text-align:center; }
.submenu_sub .lst ul {}
.submenu_sub .lst li {float:left; text-align:left; vertical-align:middle; height:60px;    text-align:center;  }
.submenu_sub .lst li a { display:block;   font-size:16px; color:#000; line-height:2;  padding:15px 29px ; font-weight:700;  letter-spacing:-1px; }
.submenu_sub .lst li.on a,
.submenu_sub .lst li a:hover {color:#fff; background-color:#5e656d;  }





.submenu_sub p {padding:57px 0px 30px;}
.submenu_sub p img {padding-bottom:5px;}

.lefttitle_img { position:absolute; width:100%; height:190px; text-align:center; margin-top:100px;     }
.lefttitle_img h1 { color:#fff; font-size:32px; width:100%; font-weight:700; line-height:40px; letter-spacing:0px; padding-bottom:0px;    margin:0px auto; }
.lefttitle_img span {color:#dcdcdc; font-size:15px; font-weight:500; line-height:25px;  padding-top:15px; }


.main_btn {max-width:1200px; padding:25px 0px; margin:0px auto; overflow:hidden; height:auto;}
.main_btn ul li {float:left; width: calc(87%/3); text-align:center;  margin:30px 2%;   font-size:20px;  line-height:2; font-weight:600;  padding:75px 0px;  }
.main_btn ul li a {color:#fff;}
.main_btn ul li.main_btnimg01 { background-image:url(../image/main/main_img01.png); background-size:100% 100%; background-position:50% 50%; background-repeat:no-repeat;}
.main_btn ul li.main_btnimg02 { background-image:url(../image/main/main_img02.png); background-size:100% 100%; background-position:50% 50%; background-repeat:no-repeat;}
.main_btn ul li.main_btnimg03 { background-image:url(../image/main/main_img03.png); background-size:100% 100%; background-position:50% 50%; background-repeat:no-repeat;}


.main_partner {max-width:1200px; padding:25px 0px; margin:0px auto; overflow:hidden; height:auto;}
.main_partner ul li {float:left; width:20%; text-align:center; }
.main_partner ul li img {width:80%;}


h1.page_title {
	padding:50px 0 0px;
	font-size:27px; width:100%; text-align:center; line-height:2; font-weight:600; letter-spacing:-1px;
	color:#000;
}

h1.page_title img {margin-top:26px;}


.subcon {max-width:1200px; width:100%; text-align:center; margin:50px auto; }
.subcon table  {width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed;word-break:break-all;border:0; border-top:2px solid #3b62ab; margin:0px auto;}
.subcon table th {background:#fff; padding:10px 0 ; border:1px solid #ddd; font-size:14px; color:#4f4f4f; line-height:2; text-align:center; font-weight:800;}
.subcon table td {padding:7px 3px; border-bottom:1px solid #e4e4e4; text-align:center; vertical-align:middle;  font-size:15px;  line-height:2; letter-spacing:-1px;}
.subcon table td.bb { font-weight:700; color:#000; background-color:#e1e9f8 ; font-size:15px; font-weight:800; padding:10px 0 ;}
.subcon table td.cc {  background-color:#f4f4f4 ; font-weight:800; }

.subcon.left {text-align:left;}


.map {width:534px; margin:15px 1%; display:inline-block; }

.history {width:100%;}
.history table {width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed;word-break:break-all; border:0; border-top:1px solid #3b62ab; margin:0px auto;}
.history table td {padding:7px 3px 7px 10px; border-bottom:1px solid #e4e4e4; text-align:left; vertical-align:middle;  font-size:17px;  line-height:2; letter-spacing:-1px; }
.history table td.year { color:#122d71; background-color:#fff ; border:none; font-size:25px; line-height:2; font-weight:800; padding:10px 0 ; width:150px; vertical-align:top; padding:7px 3px ;}
.history table td.mon {   width:50px; font-weight:800;  text-align:center; background-color:#f4f4f4 ; padding:7px 3px ;}


.kae {width:100%; margin-bottom:50px; border-bottom:1px solid #eee; padding-bottom:50px;}
.kae .lg { width:20%; text-align:left; display:inline-block; vertical-align:top; }
.kae .lg img {width:80%;}
.kae .lg_na { width:70%; text-align:left;display:inline-block; }
.kae table {width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed;word-break:break-all; border:0;  margin:0px auto;}
.kae table td {padding:2px 3px;  text-align:left; vertical-align:middle;  font-size:17px;  line-height:2; border:0; letter-spacing:-1px; }
.kae table td.contents_b {  font-weight:800; padding:7px 3px ; border-bottom:2px solid #e4e4e4;}



/*about > 인증 (KYN)*/
    .certi_list dl {padding-bottom: 40px; min-width: 1200px;}
    .certi_list dt:after,
    .certi_list dd:after {content: "";display: block;clear: both;} 
    .certi_list dt h3 { font-size: 22px;float: left; padding-bottom: 10px;}
    .certi_list dt h3 span { font-size: 16px; color:#666666; font-weight: normal; margin-left:10px;}
    /*다운로드버튼*/
    .certi_list dt p.btndownload {float:right;}    
    .certi_list dt p.btndownload a {colr:#333; background-color: #dcdcdc; width:180px; height: 36px; display: block; border:1px solid #dcdcdc; box-sizing:border-box;; font-size:15px; font-weight: 400; padding-top:8px; margin-bottom: 4px; border-radius: 5px; letter-spacing: -1px; transition: all .3s ease 0s}
    .certi_list dt p.btndownload a:hover {color:#000; background-color: #b5b7ef; border-color: #b5b7ef;}
    .certi_list dt p.btndownload a img {vertical-align: bottom; margin-left:8px;}
    .certi_list dd {border: 1px solid #e4e4e4; border-radius: 0 0 10px 10px; background-color: #fff;  background-color: #f6f6f6; box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.09); padding:30px 0; transition: all .3s ease 0s}
    /*인증서,TEXT*/
    .certi_list dd div.certiicon {float: left; width:290px; position: relative;}
    .certi_list dd div.certiicon p {text-align: center; transition: all .3s ease 0s}
    .certi_list dd div.certiicon p.icon {min-height:160px}
    .certi_list dd div.certiicon p.certi {position: absolute; left:0; top:0; width:100%; opacity: 0;}
    .certi_list dd div.certiicon p.certi img { height:160px}
    .certi_list dd div.txt {float: right; width:907px; text-align: left; font-size: 16px; line-height:1.8; letter-spacing: -1px; color:#333333; word-break: keep-all; box-sizing: border-box; padding-right: 20px;}
    /*동적구현*/
    .certi_list dd:hover {box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.2); }
    .certi_list dd:hover div.certiicon p.icon { opacity: 0}
    .certi_list dd:hover div.certiicon.off p.icon { opacity: 1}
    .certi_list dd:hover div.certiicon p.certi { opacity: 1}




@media only screen and (max-width:1020px){
    .subcon {width:100%; text-align:center; margin:20px auto; }
    .submenu_sub .lst {width:100%; height:50px; }
    .submenu_sub .lst li a {  font-size:12px; padding:10px  ;}
    
/*about > 인증 (KYN)*/
    .certi_list dl {width: 100%;min-width: inherit}
    /*인증서,TEXT*/
    .certi_list dd div.certiicon {width:35%;}
    .certi_list dd div.txt {width:65%;}
}


@media only screen and (max-width:640px){
	
    #header{ height:100px;  }

    #header .logo{ width:150px;} 



    /*=====  슬로건 */
    #header .slogan {width:30%; }
    #header .slogan img { margin-top:42px;}


    #header a.btn_kor{right:60px;top:30px; }
    #header a.btn_eng{right:10px;top:30px;}


    .main_btn ul li { margin:15px 2%;   font-size:15px;   padding:35px 0px;  }
    .main_btn ul li img {width:30px;}






    .subcon img {width:90%; margin:0px auto;}
    .subcon.left img   {width:auto;}

    h1.page_title {
        font-size:17px; 

        }
    h1.page_title img {margin-top:5px;}


    .kae { margin-bottom:20px; padding-bottom:20px;}
    .kae table td {font-size:15px; }





    .inner { width:100%; margin:0 auto;  zoom:1; position:relative; width:100%;  height:40px; background-color:#192268; color:#fff; text-align:center;  z-index:2000000; }
    .inner .nav {float:left; width:100%; margin-top:0px; text-align:center;  z-index:2000000;  }
    .inner .nav ul {position:relative;}
    .inner .nav ul li {display:inline-block; *display:inline; zoom:1; margin:0px; padding:0px 5px;  height:25px; }
    .inner .nav ul li a {display:block; line-height:40px; color:#fff; font-size:12px; font-weight:800;  text-align:center; }
    .inner .nav ul li.over > a,
    .inner .nav > ul > li > a:hover {color:#fff; !important}
    .inner .nav ul li.m01 {}
    .inner .nav ul li.m02 {}
    .inner .nav ul li.m03 {}
    .inner .nav ul li.m04 {}
    .inner .nav ul li.m05 {}
    .inner .nav ul li.m06 {}
    .inner .nav ul li.m07 {}


    .inner .nav .dep2 {position:absolute; top:0px; background-color:#2d2d2d; margin-top:17px; height:40px;}
    .inner .nav .dep2 a {display:block;  padding:6px 2px;  font-size:12px; color:#dcdcdc; line-height:28px; }
    .inner .nav .dep2 .on a,
    .inner .nav .dep2 a:hover {color:#fff; font-weight:bold; }
    .inner .nav .dep2 ul li {  padding:0px 3px;}
    .inner .nav .m01 .dep2 {width:100%;left:0px; text-align:center;}
    .inner .nav .m02 .dep2 {width:100%;left:0px; text-align:center;}
    .inner .nav .m03 .dep2 {width:100%;left:0px; text-align:center;}
    .inner .nav .m04 .dep2 {width:100%;left:0px; text-align:center; }
    .inner .nav .m05 .dep2 {width:100%;left:0px; text-align:center;}
    .inner .nav .m06 .dep2 {width:100%;left:0px; text-align:center;}
    .inner .nav .m07 .dep2 {width:100%;left:0px; text-align:center;}




    #container {
        margin:0px auto 0px;
        border-top:0px solid #f4f4f4;
    }



    .move_notice {margin-top:0px; }

    #gnb ul li a { font-size:15px; height:40px;}

    #gnb_contain_back {background-color:#192268; height:50px; width:100%;}
    #gnb {height:50px; }




    #footer  {margin-top:0px;}	
    #footer .siteinfo{padding:15px 0px; width:90%; margin:0px auto; }

    #footer .siteinfo span{ font-size:12px;}

    #footer .cus_tel { padding:0px 3%; }
    #footer .cus_tel ul li { font-size:20px;text-align:center; float:none;  padding:10px 0px 5px; text-align:center; }

    #footer .cus_tel ul li.fax { border-left:none; padding:0px;  margin-left:0px;  }	


    /*=====  오른쪽 예치금 */

    .right_gry {position:relative;  width:92%;  margin:0px auto 0px; left:0px; padding:2% 4%; border:none;  border-bottom:1px solid #192268;   border-radius:0px; }
    .right_gry ul li {padding:6px 0px 0px;  text-align:left;  font-weight:600; font-size:12px; line-height:1.3;  overflow:hidden; height:auto;  color:#192268;  border-bottom:0px solid #d2dcee;}
    .right_gry ul li.ps {display:none;}
    .right_gry .ref { display:none;}
    .right_gry .ref2 { display:inline-block; float:right;}
    .right_gry .ref2 img {width:20px;}

    /*=====  오른쪽 공지사항 */
    .right_notice {position:relative; width:90%;  margin:0px auto;left:0px; display:none;}


    /*=====  오른쪽 고객센터 */
    .right_cus {position:relative; width:90%;  margin:0px auto; left:0px; display:none; }

/*about > 인증 (KYN)*/
    /*인증서,TEXT*/
    .certi_list dd div.certiicon,
    .certi_list dd div.txt {float:inherit; width:inherit; text-align: center}
    .certi_list dd div.txt {padding-right:inherit;}
    .certi_list dt p.btndownload a img,
    .certi_list dd div.certiicon p.icon img,
    .certi_list dd div.certiicon p.certi img {width:auto}
}







