@charset "utf-8";
@import url("../css/NotoKR.css");
/* CSS Document */
/*-- reset css --*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
html, body {
	font-family: 'Noto Sans Regular';
	width:100%;
	height:100%;
}
body {
   line-height:1;
	overflow-x: hidden;
	background-color: #fff;
	background-size:cover;
	background-attachment: fixed;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
ul, ol {list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	 text-decoration: none;
	
	 /* Link Style - change colours to suit your needs*/
	 color:#555;
	 -webkit-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	 -moz-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	 -ms-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	 -o-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	 transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;
	 outline:none;
}
a:hover {
	text-decoration:none;
	color:#000;
}

/* change colours to suit your needs */
table {
    border-collapse:collapse;
    border-spacing:0;
	 vertical-align:middle;
}
th, td {vertical-align:middle;}
input, select {
    vertical-align:middle;
}
summary, caption {display: none}
em { font-family:'Noto Sans Medium';font-style: normal;}
/*-- END reset css --*/

.endline {
	clear:both;
	content:'';
}


/*-- header --*/
header {
	position:fixed;
	width:200px;
	height:100%;
	background-color:#000;
	z-index:7777;
}
h1.logo {
	padding:50px 15px;
	margin:0 auto;
	width:100%;
}
h1.logo > a {
	display:block;
    width: 172px;
	height: 110px;		
	background:url('../img/logo.png') no-repeat;
}
.login_area{ position: absolute; top: 600px; left: 5px;   width:154px; margin-top: 120px;   padding: 0 15px;overflow:hidden;}
.login_area a:first-child{margin-right:5px;}
.login_area a{float:left; width:48%;color:#a4a4a4; font-size:14px; text-align:center; display:block;border-top:1px solid #aeaeae; border-bottom:1px solid #aeaeae; padding:8px 0;}
.login_area a:hover{color:#e9af3d; display: block;border-top:1px solid #e9af3d; border-bottom:1px solid #e9af3d;}

/*로그인후*/
ul.loginBox li.logTit {
	padding:7px 0;
	text-align:center;
	font-size:17px;
	color:#555;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	font-weight:600;
}
ul.loginBox li.logTxt {
	margin:10px 0;
	padding:5px 8px;
}
ul.loginBox li p {
	font-size:13px;
	color:#999;
}
ul.loginBox li p.name {
	margin-bottom:10px;
	font-size:16px;
	color:#333;
}
ul.loginBox li div.myBtn a {
	background-color:#0c6ab2;
}


nav.topMenu {
	margin-top:50px;
	border-top:1px solid #111;
}
nav.topMenu ul li a {
    position: relative;
    padding-left: 60px;
    display: block;
    width: 100%;
    height: 60px;
    line-height: 50px;
    border-bottom: 1px solid #111;
    font-size: 16px;
    color: #ffffff;
    box-sizing: border-box;
}
nav.topMenu > ul > li > a:hover {
	background:#191919;
}
span.ic {
	position:absolute;
	top:15px;
	left:28px;
	display:inline-block;
	width:22px;
	height:22px;
	background:url('../img/icon.png') no-repeat;
}
span.ic0 {background-position:0px 0px;} 
span.ic1 {background-position:-22px 0px;} 
span.ic2 {background-position:-44px 0px;} 
span.ic3 {background-position:-66px 0px;} 
span.ic4 {background-position:-88px 0px;} 
span.ic5 {background-position:-87px 0px;} 
span.ic6 {background-position:-110px 0px;} 
span.ic7 {background-position:-132px 0px;} 
/* submenu 서브메뉴 */
div.subMenu {
	display:none;
	position:fixed;
	top:0;
	left:200px;
	width:210px;
	height:100%;
	/*background:url('../img/submenu_background.png') no-repeat;*/
	background-color: #222;
	z-index:6666;
}
div.subMenu.menuShow {
	display:block;
}
div.subOn {
	display:block;
	z-index:5555;
}
div.subMenu > h2 {
	margin:80px 0 10px 30px;
	font-size:32px;
	color:#fff;
}
div.subMenu > p {
	margin-left:30px;
	font-size:11px;
	color:#fff;
	letter-spacing:2px;
}
div.subMenu > ul {
	margin-top:125px;
	border-top:1px solid #333;
}
div.subMenu > ul > li:hover {
	background:#333;
}
div.subMenu > ul > li.menuPick {
	background:#333;
}
div.subMenu > ul > li > a {
	padding-left:30px;
	color:#fff;
}
/* END submenu 서브메뉴 */
/*-- END header --*/


/*-- font--*/
.subTit {font-size: 22px; color: #1a1a1a; line-height: 30px; font-family: 'Noto Sans Regular'}
.subtxt { font-size: 14px; line-height: 25px;font-family: 'Noto Sans Regular'}
.box_out2 a {margin:0 48px;}
.step02_ul {overflow:hidden;}
.step02_ul li {display:block; padding:0 0 0 12px; margin:0 0 10px; font-size:12px; line-height:19px;  color:#747474; background:url("../img/bull.png") no-repeat 0 7px;}
.step02_ul li em {color:#010101;}
.step02_ul2 {overflow:hidden;}
.step02_ul2 li {display:block; padding:0 0 0 12px; margin:0 0 10px; font-size:14px; line-height:19px;  color:#747474; background:url("../img/bull.png") no-repeat 0 5px;}
.step02_ul2 li em {color:#010101}
.step02_ul2 li em.font_bold {color:#fb7d01;font-weight:bold;}
.step02_ul02 li {padding:0 0 0 5px; margin:0; background:none;}
/*-- // font--*/


article { background-color: #fff; width: 1200px; min-height: 800px; padding:50px 0 50px 200px; display: block; margin:0 auto;}

/*-- top 버튼--*/
#topBtn { display: none; position: fixed; bottom: 50px; right: 50px; width: 50px; height: 50px; border: 1px solid #fff; color: #fff; text-align: center; line-height: 50px;  border-radius: 50%; background-color: #da9a29;  transition: background 0.2s; cursor: pointer;z-index: 99;}
#topBtn img {display: block;margin: 10px auto 0}
#topBtn p {line-height: 26px;}
#topBtn:hover {  background-color: #fff;color: #000;	border: 1px solid #000;}
/*--// top 버튼--*/

/*---서브 탭메뉴---*/
.subMenuBox {width: 100%; border-bottom: 1px solid #d3d3d3;}
.subMenuBox .subBoxUl {width: 1200px; margin: auto; }
.subMenuBox .subBoxUl .submenuUl {border-left: 1px solid #d3d3d3; }
.subMenuBox .subBoxUl .submenuUl li {display: inline-block; border-right: 1px solid #d3d3d3; line-height: 40px; height: 40px;  width:33.1%; font-size: 16px; loat: left;/*border-bottom: 1px solid #d3d3d3;*/ border-top: 1px solid #d3d3d3; text-align: center;}
.subMenuBox .subBoxUl .submenuUl li:Hover {background: rgba(218, 154, 41, 0.6);border-right: 1px solid #dec6b4;  border-top: 1px solid #dec6b4;}
.subMenuBox .subBoxUl .submenuUl li.menuOn {background:#da9a29; color: #ffffff;}
.subMenuBox .subBoxUl .submenuUl li.menuOn a {color: #ffffff;width: 100%;}
.subMenuBox .subBoxUl .submenuUl li a {color: #000000;display: inline-block;width:100%; border-left: 1px solid #d0d0d0;}

.subMenuBox .subBoxUl .submenuUl5 {border-left: 1px solid #d3d3d3; }
.subMenuBox .subBoxUl .submenuUl5 li {display: inline-block; border-right: 1px solid #d3d3d3; line-height: 40px; height: 40px;  width:19.7%; font-size: 16px; loat: left;/*border-bottom: 1px solid #d3d3d3;*/ border-top: 1px solid #d3d3d3; text-align: center;}
.subMenuBox .subBoxUl .submenuUl5 li:Hover {background: rgba(218, 154, 41, 0.6);border-right: 1px solid #dec6b4;  border-top: 1px solid #dec6b4;}
.subMenuBox .subBoxUl .submenuUl5 li.menuOn {background:#da9a29; color: #ffffff;}
.subMenuBox .subBoxUl .submenuUl5 li.menuOn a {color: #ffffff;width: 100%;}
.subMenuBox .subBoxUl .submenuUl5 li a {color: #000000;display: inline-block;width:100%; border-left: 1px solid #d0d0d0;}
/*---// 서브 탭메뉴---*/

#wrap_basic .dashed {border-top: 1px dashed #969696; position: absolute; width: 40%; margin: 75px 0 0 350px;}
.dashedBox { width: 100%;  height: 170px; background-color: #f5f5f5;}

.mb0 {margin-bottom:0 !important} 
.mb10 {margin-bottom:10px !important} 
.mb20 {margin-bottom:20px !important} 
.mb30 {margin-bottom:30px !important} 
.mb40 {margin-bottom:40px !important} 
.mb50 {margin-bottom:50px !important} 
.mb100 {margin-bottom:100px !important} 
.mb200 {margin-bottom:200px !important} 
.mb300 {margin-bottom:300px !important} 
.mb400 {margin-bottom:400px !important} 
.mb500 {margin-bottom:500px !important}  
.mt10 {margin-top:10px !important} 
.mt20 {margin-top:20px !important} 
.mt30 {margin-top:30px !important} 
.mt35 {margin-top:35px !important} 
.mt40 {margin-top:40px !important} 
.mt50 {margin-top:50px !important} 
.mt60 {margin-top:60px !important}
.mt70 {margin-top:70px !important}
.mt80 {margin-top:80px !important}
.mt90 {margin-top:90px !important}
.mt100 {margin-top:100px !important}  
.mt150 {margin-top:150px !important}  
.mt170 {margin-top:170px !important} 
.mt200 {margin-top:200px !important} 
.mt300 {margin-top:300px !important} 
.mt400 {margin-top:400px !important} 
.mt500 {margin-top:500px !important} 
.mr5 {margin-right:5px !important} 
.mr10 {margin-right:10px !important} 
.mr20 {margin-right:20px !important} 
.mr30 {margin-right:30px !important} 
.mr35 {margin-right:35px !important} 
.mr40 {margin-right:40px !important} 
.mr50 {margin-right:50px !important}
.ml10 {margin-left:10px !important} 
.ml20 {margin-left:20px !important} 
.ml30 {margin-left:30px !important} 
.ml40 {margin-left:40px !important} 
.ml50 {margin-left:50px !important}
.ml100 {margin-left:100px !important}
.ml200 {margin-left:200px !important}
.ml120 {margin-left:120px !important}