@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700&family=Roboto:wght@100;300;400;700&display=swap');

/* CSS Reset */

html, body, div , span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin: 0; padding: 0; border: 0; font-size: 100%;}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section{display: block;}
body{font-family: "돋움", Dotum,"굴림",Gulim, sans-serif; font-size: 16px;
  color: #333}
ol, ul{list-style: none;}
table{border-collapse: collapse; border-spacing: 0;}
address{font-style: normal}
a{color: #333; text-decoration: none}
img{border: 0; vertical-align: top}

.hidden{display: block; position: absolute;
 left: -1000%; width: 1px; height: 1px;
  overflow: hidden; color: #fff}

/*skipNav */
#skipNav{position:relative;width:100%;overflow:hidden;z-index: 110}
#skipNav a{display:block; height:1px; margin-bottom:-1px;
      overflow:hidden; text-align:center; color:#fff; font-size:16px; font-weight: bold;}
#skipNav a:hover,#skipNav a:focus,#skipNav a:active{
  height:auto;padding:10px 0; background:orange;}

  /* font-family: 'Nanum Gothic', sans-serif; font-weight:700;
font-family: 'Roboto', sans-serif; */

.wrap{width: 100%; overflow: hidden; position: relative;}

/* header 공통영역*/
#headerArea{width: 100%; height: 185px;position: fixed; left: 0;top:0;z-index: 100; background:#fff;
            border-bottom: 1px solid #ccc; }
#headerArea .header_inner{width: 1200px; height: 185px;margin: 0 auto; }

#headerArea h1{ width: 277px; height: 62px; margin: 10px auto;}
#headerArea h1 a{display: block; width:277px; height: 62px;background: url(../images/logo.png); text-indent: -999px;overflow: hidden;}            
#headerArea .top_menu{overflow: hidden}
#headerArea .top_menu ul{overflow: hidden; float: right; margin: 12px 26px 12px 0;}
#headerArea .top_menu li{float: left; margin-left:10px;}
#headerArea .top_menu .last{background: none;}  
#headerArea .top_menu li a{display: block; font-size: 14px;}

#headerArea #gnb{}

	
#gnb ul.dropdownmenu{float:left;width: 100%;}
#gnb ul.dropdownmenu li.menu{position:relative;float:left;width:16.66%; height: 80px; }
#gnb ul.dropdownmenu li a.depth1{display:block;padding: 24px 0; text-align: center; transition: all .5s;font-size: 1.2em;font-family: 'Nanum Gothic', sans-serif; font-weight:700; }

	
    /* 2depth */
#gnb ul.dropdownmenu li ul{width: 100%;  position:absolute;top:50px;left:0; height: 200px;
		  padding:15px 0; line-height:2em; display:none;}

#gnb ul.dropdownmenu li ul li{ text-align:center; font-weight:bold;}
#gnb ul.dropdownmenu li ul li a{display:block;  transition: all .5s;font-size: 1em;font-family: 'Nanum Gothic', sans-serif; font-weight:700;}
#gnb ul.dropdownmenu li ul li a:hover{color:#f07404;}
/* #headerArea #gnb ul{overflow: hidden; margin: 30px 0 20px 86px; }
#headerArea #gnb li{float: left; margin-right: 130px;}
#headerArea #gnb li:last-child{margin-right: 0;}
#headerArea #gnb li a{font-size: 1.2em;font-family: 'Nanum Gothic', sans-serif; font-weight:700;} */


/* footer 공통영역*/
#footerArea{width: 100%; border-top: 1px solid #ccc; font-family: 'Nanum Gothic', sans-serif; margin-top: 146px; padding: 0 0 50px;position: relative;}
#footerArea .footer_inner{width: 1200px; margin: 0 auto; clear: both;}
#footerArea .footer_top{height: 74px; overflow: hidden;}
#footerArea::after{content: ''; display: block; width: 100%; height: 1px;
  background: #ccc; position: absolute; left:0; top:80px}
#footerArea .footer_menu{float: left; margin: 30px 0px 30px 14px;}
#footerArea .footer_menu li {float: left;  margin-left: 22px;}
#footerArea .footer_menu li a  {color: #333; transition: all .1s;}
#footerArea .footer_sns{ float: right; margin-top: 20px;}
#footerArea .footer_sns ul{}
#footerArea .footer_sns li{float: right; margin-left: 12px;}
#footerArea .footer_sns li a{ width: 37px; height: 37px; transition: all .1s;}
#footerArea .footer_bottom{clear: both; padding: 43px 0 0; z-index: 5;}
#footerArea .footer_copy{float: left;}
#footerArea .footer_logo{float: left; margin: 0 30px;}
#footerArea address{float: left;color: #333; line-height: 2;}
#footerArea p{margin-bottom: 55px;}
#footerArea .family{float: right;}

/* *{margin:0; padding:0;} */
ul{ list-style:none}
a{ color:#333; text-decoration:none}

.family{width:205px; height:48px; background:#fff; border:1px solid #7a1f7f;
    position:relative; background:url(../images/plus.png) 87% 50% no-repeat; margin:50px; padding: 5px; box-sizing: border-box;}
.family .arrow{ display:block; font-size:20px; font-weight: bold; padding-top: 6px; padding-right: 30px; text-align: center;}
.family .arrow:hover{color:#7a1f7f;}
.family .aList{ position:absolute; top:-182px; left:-1px; width:203px; border:1px solid #7a1f7f; display:none;z-index: 10;}
.family .aList li{ line-height:1.5em; border-bottom:1px solid #7a1f7f; background: #fff; }
.family .aList li a{display:block;padding-left:20px; padding: 10px; }
.family .aList li a:hover{ background:#7a1f7f; color:#fff}

/* top move */
.topMove{display: block; position: fixed;left: 50%;margin-left: 650px; bottom: 320px; z-index: 10;}
.topMove i {font-size: 50px; color:#f07404;}













