@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);/*font-family: 'Nanum Gothic', sans-serif;*/
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);/*font-family: 'Nanum Gothic Coding', monospace;*/

@import url(https://fonts.googleapis.com/css?family=Rufina:400,700&subset=latin,latin-ext);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);

@import "//fonts.googleapis.com/css?family=Noto+Sans";
*,body {font-family: 'Noto Sans', sans-serif;}
/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                 reseat
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/


html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, address, dl, dd, dt, ol, ul, li, form, input, legend, fieldset, select, table, caption, tbody, thead, tfoot, tr, th, td, textarea{margin:0; padding:0;}
img, fieldset{border:none;}
table{border-collapse:collapse;}
ul, ul li{list-style:none;}
ol{margin-left:30px;}
ol li {list-style:decimal-leading-zero;line-height:22px;}
address, em{font-style:normal;}
dt img, dd img, li img, object{vertical-align:top;} 
input, select, textarea, form img{vertical-align:middle;}
legend, caption,hr, .skip{position:absolute; left:-5000px; width:0; height:0; font-size:0; line-height:0; overflow:hidden;}
caption{position:static;}

/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                   layout include
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/

body{font-family:'맑은 고딕', 'Malgun Gothic', 'Noto Sans', "돋움", Dotum, "굴림", Gulim, Verdana, AppleGothic, sans-serif;color:#6c6c6c;font-size:14px; line-height:170%;-webkit-text-size-adjust:none;}
input, select, textarea{color:#6c6c6c; font:100% "돋움", Dotum, sans-serif, serif;}

img {vertical-align:middle;}
a,img, input { outline:none; selector-dummy:expression(this.hideFocus = true);outline:none;}       
a:link, a:visited    {color:#6c6c6c;text-decoration: none;}
a:active             {color:#6c6c6c;text-decoration:none;}
a:hover, a:focus     {color:#3c79cc;}

input::placeholder {color: #444;}

/*자주쓰이는 요소*/
.hide-off            {position: absolute;top: -999em;height:0px;}
.hide-text           {text-indent: -999em; display: block; overflow: hidden; text-decoration: none;height:0px;}
.clear {clear:both;height:0px;}
.col {float:left;}
.row {margin-bottom:40px;}
.hr_line {height:1px; border-top:1px solid #efefef; width:100%;}


/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                  header include   1100 = 50 + 190 + 20 + 790 + 50 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/


#topLine{background-color:#e0ebf2;}
#topLine ul {width:1000px;margin:0 auto;height:30px;text-align:right;}
#topLine ul li{display:inline-block;margin-left:10px;font-size:.9em;}
#topLine{}

/* 로고 */

#header {width:1000px;margin:0 auto;height:90px;z-index:1001;background:#fff url(/images/md7004/headerBg.jpg) no-repeat right 0;z-index:1000;}
#header h1 {padding-top:20px;}

/*--- header 메뉴---*/

.topMenuBox {width:100%;background-color:#2c8fd3;height:45px;}

.topMenuBox .htb {width:1000px;margin:0 auto;z-index:10;}
.topMenuBox .htb li.top_b {display:block; float:left;position:relative;height:45px; line-height:45px;color:#fff;}
.topMenuBox .htb li.top_b.check { font-weight:bold;color:#ffe050;}
.topMenuBox .htb li.top_b a{color:#fff;display:inline-block;width:auto;height:45px;}
.topMenuBox .htb li.top_b span{color:#fff;font-size:1.1em;display:block;height:45px;text-indent:-10000px;overflow:hidden;margin:0 12px;}
.topMenuBox .htb li.top_b span.menu01{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -24px 0;width:130px;}
.topMenuBox .htb li.top_b span.menu02{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -170px 0;width:60px;}
.topMenuBox .htb li.top_b span.menu03{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -250px 0;width:75px;}
.topMenuBox .htb li.top_b span.menu04{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -351px 0;width:60px;}
.topMenuBox .htb li.top_b span.menu05{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -433px 0;width:40px;}
.topMenuBox .htb li.top_b span.menu06{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -496px 0;width:45px;}
.topMenuBox .htb li.top_b span.menu07{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -566px 0;width:45px;}
.topMenuBox .htb li.top_b span.menu08{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -633px 0;width:45px;}
.topMenuBox .htb li.top_b span.menu09{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -698px 0;width:45px;}
.topMenuBox .htb li.top_b span.menu10{background:#2c8fd3 url(/images/md7004/menu.png) no-repeat -760px 0;width:170px;}



.topMenuBox .htb a:hover {visibility:visible;}
.topMenuBox .htb li:hover {position:relative; z-index:200;}
.topMenuBox .htb ul, 
.topMenuBox .htb :hover ul.top_sub,#top_menu .htb :hover ul.top_sub li.group_list ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
.topMenuBox .htb :hover ul.top_sub {left:0; top:35px; background: #242d5a; padding:3px 0 10px;width:400px; height:auto;box-shadow: 0 1px 5px #999;-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius:3px;background-color:#fff;}
.topMenuBox .htb :hover ul.top_sub li {display:block;  position:relative; float:left;text-align:left;padding:0; line-height:27px;}
.topMenuBox .htb :hover ul.top_sub li a {display:inline-block; font-size:13px; height:27px;width:130px; line-height:27px;text-indent:10px;color:#555;}
.topMenuBox .htb :hover ul.top_sub li a:hover {background:#3f4875; color:#fff;}



/*모바일헤더*/
#topLink {display:none;position:fixed;padding:10px 0;width: 100%; background: #2c8fd3;z-index: 3;}
#topLink  .ma5-menu-header	{position:absolute;top:10px;right:10px;}

#cd-logo {display:none; margin: 0 0 0 20px;color:#fff;height:35px;max-width:45%;}
#cd-logo img { display: block; height:100%;width:auto;}



@media only screen and (max-width: 800px) {
#topLine,
#header,
.topMenuBox{display:none;}


#topLink {display:block;}
#cd-logo {display:block;}


}


@media only screen and (max-width: 640px) {

}

@media only screen and (max-width: 480px) {
#cd-logo {height:37px;}

}

@media only screen and (max-width: 375px) {

}




/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                   footer include
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/


#footer .copyright{color:#8991a3;font-size:.9em;line-height:1.5em;}

#footer { background-color:#3d4351;padding:0; } 
#footer h2.shareTitle{ font-size:.9em;padding-left:10%;padding-top:50px;color:#fff;} 
#footer .footerBtm{background:#3d4351 url(/images/md7004/logo_footer.jpg) no-repeat 0 20px;padding:20px 0 50px 200px;}

/*footer*/
.footerTop{position:relative;background-color:#495061;text-align:left;height:60px;}
.footerTop .topBtn{position:absolute;top:0;right:0;}

.footerTop .footer-navMenu {}
.footerTop .footer-navMenu li{display:inline;line-height:60px;font-size:.9em;color:#fff;padding-right:20px;}
.footerTop .footer-navMenu li a{color:#fff;}


#m7-go-top {display:none; position: fixed; overflow: hidden; text-align: center;width: 50px; height: 50px; line-height: 50px; background: #fcb700; 	-webkit-border-radius: 50px; 	-moz-border-radius: 50px; 	border-radius: 50px; 	background-clip: padding-box; 	right: 50px; bottom: 50px; font-size: 14px; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; transition: all 300ms linear; } 
#m7-go-top:hover {-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;background: #fcb700;}
#m7-go-top a { display: block; text-decoration: none; position: relative; height: 100%; color: #ffffff; -webkit-transition: background-color 200ms linear; -moz-transition: background-color 200ms linear; -o-transition: background-color 200ms linear; -ms-transition: background-color 200ms linear; transition: background-color 200ms linear; } 
#m7-go-top a:hover {color: #ffffff;} 
#m7-go-top a span {font-size: 14px;} 
#m7-go-top a img { display: block; position: absolute; top: 0px; left: 0px; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; transition: all 300ms linear; } 
#m7-go-top a img + img { position: absolute; top: 0px; left: 0px; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; transition: all 300ms linear; } 
#m7-go-top:hover a img[data-hover-image='true'] {-moz-opacity: 0;-khtml-opacity: 0;opacity: 0;} 
#m7-go-top:hover a img[data-hover-image='true'] + img {-moz-opacity: 1;-khtml-opacity: 1;opacity: 1; z-index: 2;}


@media only screen and (max-width: 800px) {
#m7-go-top {right: 15px; bottom: 15px;}
#m7-go-top {display:block; }
}


@media only screen and (max-width: 640px) {
#footer .footerBtm{background:none;padding:20px 15px 50px 15px;}
.footerTop .container{padding:0;}
}

@media only screen and (max-width: 480px) {

}

@media only screen and (max-width: 375px) {

}




@media print {
	#header {display:none;}
	#visualBox {display:none;}
	#leftMenuBox {display:none;}
	#footer {display:none;}
}

