@charset "euc-kr";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url("//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css");


html, body {
  margin: 0;
  padding: 0;
  /* ÇÊ¿äÇÒ °æ¿ì ¾Æ·¡ ¶óÀÎ Ãß°¡ */
  overflow-x: hidden; 
}
body {margin:0px;}
body, td, div, p, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, textarea, figure{font-family:Nanum Gothic, sans-serif; font-size:11pt; color:#000; line-height:140%; -webkit-text-size-adjust:none;}

img{border:0;}

h1, h2, h3, h4, h5, figure, p{padding: 0px; margin: 0px; font-weight: normal;}
ul, li{padding:0px; margin:0px; list-style:none;}
/* ·Î°í ¿µ¿ª */
#logo {
  background: none;       /* ¹è°æÀÌ¹ÌÁö Á¦°Å */
  color: #fff;            /* ±ÛÀÚ»ö Èò»ö */
  font-size: 24px;        /* ÀûÀýÈ÷ Á¶Á¤ */
  font-weight: bold;      /* º¼µå(±½°Ô) */
  line-height: 32px;      /* ·Î°í ³ôÀÌ Á¶Àý (ÇÊ¿ä½Ã) */
  display: inline-block;  /* °¡·Î Á¤·Ä¿ë */
  margin-top: 0px;        /* »ó´Ü ¿©¹é ±âÁ¸ ÄÚµå À¯Áö ¶Ç´Â Á¶Àý */
}

#fixNextTag article{width: 1200px; margin: 0 auto;}
/*main*/
#main_bg{background:url(/imgs/img4.jpg) top center no-repeat; background-attachment: fixed;}

/* page 00 */
#page00 .main_text{text-align: center; padding: 300px 0px;}
#page00 .main_text h2{font-size:120px; font-weight: bold; font-family:'Nanum Square'; color:#fff; line-height:85px;}
#page00 .main_text h2 span{display:block; font-size:40px;}

/* page 01 */
#page01{background:rgba(0,0,0,0.4);}
#page01 article{padding-bottom:50px;}
#page01 article .title{color:#fff;}
#page01 article .title span{color:#8699d0;}

#page01 article figure{width: 350px; height: 350px; text-align:center; background:#fff; float:left; margin:0px 25px 50px 25px;}
#page01 article figure h3{font-size:30px; font-family:'Nanum Square'; font-weight:bold; padding-top:30px;}
#page01 article figure .bar{width:50px; height:3px; background:#18223b; margin:25px auto;}
#page01 article figure h4{font-size:20px; color:#a0a0a0; font-family:'Nanum Square'; font-weight:bold; line-height:25px; padding-top:20px; }
#page01 article figure h4 span{display:block; font-size:40px; color:#3b6dd2;}
/* °øÅë ½ºÅ¸ÀÏ */
#page01 .services figure {
  float: left;
  width: 48%;
  height: 350px;
  margin: 1% 1% 30px 1%;
  box-sizing: border-box;

  /* °øÅë ¿É¼Ç: cover, Áß¾Ó Á¤·Ä, ¹Ýº¹ ¾øÀ½ */
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  /* ¡é fixed¸¦ ¾²½Ã¸é ¸ð¹ÙÀÏ¿¡¼­ ÀÌ½´°¡ ÀÖÀ» ¼ö ÀÖÁö¸¸, 
     ¸¸¾à ½ºÅ©·Ñ °íÁ¤ È¿°ú°¡ ÇÊ¿äÇÏ¸é À¯Áö */
}

/* 1¹øÂ° figure: img4.jpg */
#page01 .services figure:nth-child(1) {
  background-image: url("/imgs/img4.jpg");
  background-attachment: fixed; /* ÇÊ¿ä½Ã */
}

/* 2¹øÂ° figure: img5.jpg */
#page01 .services figure:nth-child(2) {
  background-image: url("/imgs/img5.jpg");
  background-attachment: fixed; /* ÇÊ¿ä½Ã */
}

/* 3¹øÂ° figure: img6.jpg */
#page01 .services figure:nth-child(3) {
  background-image: url("/imgs/img6.jpg");
  background-attachment: fixed; /* ÇÊ¿ä½Ã */
}

/* 4¹øÂ° figure: img7.jpg */
#page01 .services figure:nth-child(4) {
  background-image: url("/imgs/img7.jpg");
  background-attachment: fixed; /* ÇÊ¿ä½Ã */
}

/* page 02 */
#page02{background:#fff;}
#page02 article{padding-bottom:100px;}
#page02 article .title{color:#000000;}
#page02 article .title span{color:#8699d0;}
#page02 article .page02_img{box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.1);}

/* page 03 */
#page03{background:url(/imgs/img2.jpg) top center no-repeat; padding-bottom:100px;}
#page03 article .title{color:#fff;}
#page03 article .title span{color:#7180af;}

#page03 article figure{width:290px; height:290px; border-radius:50%; background:#bcbfc6; text-align:center; float:left; margin:0px 5px;}
#page03 article figure h3{font-size:30px; font-family:'Nanum Square'; font-weight:bold; color:#343948; padding-top: 50px;}
#page03 article figure .bar{width:64px; height:3px; background:#55575f; margin:20px auto;}
#page03 article figure .normal{font-size:22px; font-family:'Nanum Square'; font-weight:bold; color:#656e83;}

/* page 04 */
#page04{background:#e7e5e6;}
#page04 article{padding-bottom:100px;}
#page04 article .title{color:#000000;}
#page04 article .title span{color:#7180af;}

#page04 .page04_con{width:1200px; padding:40px; background:#fff; box-sizing:border-box; border:2px solid #b4b4b4;}
#page04 .page04_text, #page04 .page04_map{float:right;}
#page04 .page04_text{width: 36%; padding-right: 4%;}
#page04 .page04_text .normal{text-align: justify;}
#page04 .page04_text h3{font-size:30px; font-family:'Nanum Square'; font-weight:bold; line-height:30px; margin-bottom:20px;}
#page04 .page04_text h3 span{display:block; font-size:20px;}

#page04 .page04_map{width: 60%;}
.from{padding-top: 20px;}

/* copy */
.copy{padding:50px 0px;font-size:10pt; color:#666; line-height:135%; text-align: center;}

/* topmenu */
.top_bar_fix, .top_fix_zone{position:fixed; right:0px; z-index:999 !important; text-align:right;}

#topmenu{width: 1200px; margin: 0 auto; z-index: 10000;}
#topmenu ul, #topmenu h1{float: left;}
#topmenu ul{width: 80%;}
#topmenu h1{width: 20%;}
#topmenu ul li{display:inline-block;}

.top_bar_fix{background:rgba(0,0,0,0.7) !important;  top:0px !important;}

.top_fix_zone{background-color:none; top:0px; width:100%; padding: 13px 0px; top:0px;}
.top_fix_zone #topmenu a{color:#fff; text-decoration:none; font-size:16pt; font-weight: bold; padding-right: 20px; line-height:25pt;}

.top_bar_fix #topmenu a{color:#e2e2e2 !important;}

.top_bar_fix #topmenu a:hover{color:#fff !important;}
.top_fix_zone #topmenu a:hover{color:#333;}

.top_fix_zone #logo{width: 20%; height:32px; background:url(/skin/business6079/gnuboard4/images/logo.png) left top no-repeat; margin-top: 5px;}

label, #toggle, #call{display: none;}
#nav{padding: 0px; margin: 0px; display: inline;}
#contents{background: #d9e5ff; min-height: 200px;}
#footer{background: #eaeaea; font-size: 13px;}

/**/
.title{font-family:'Nanum Square'; font-size: 40px; font-weight:bold; text-align: center; padding:90px 0px; line-height:45px;}
.title span{display:block; font-size:26px; font-weight:normal;}

.normal{font-size:11pt; color:#666; line-height:150%; word-spacing:-1px;}

.sp10{height:10px; font-size:1px;}
.sp20{height:20px; font-size:1px;}
.sp30{height:30px; font-size:1px;}
.sp40{height:40px; font-size:1px;}
.sp50{height:50px; font-size:1px;}
.sp80{height:80px; font-size:1px;}

/*Æû¸ÞÀÏ*/
#online {width:100%;}
img {border:none;}
#online td{padding:0px 0px;}
#online .from_title{color:#505050; font-size:17px; width: 70px; font-family:'Nanum Square'; font-weight:bold;}
#online_btn{width:100%;text-align:center;}

.from_con{width: 100%; height:23px; margin-bottom: 13px;}
.from_con div{float: left;}
.from_con input{width: 100%;}

#from_button{margin-top: 30px;}
#from_button input{width: 100%; border: none; font-family:Nanum Gothic, sans-serif; text-align:center; font-size:20px; font-weight: bold; color:#fff; padding: 10px 0px; background: #70665d;}

textarea{width: 100%; height: 100px;}

@media all and (max-width: 992px) {
/*°øÅë*/
#fixNextTag article{width: 100%;}
.top_fix_zone {
  background-color: #000; 
  /* height: 60px; */
  /* ±âÁ¸¿¡ overflow: hidden; ÀÖ¾ú´Ù¸é Á¦°Å ¶Ç´Â ÁÖ¼® */
  overflow: visible; /* ¼û±èÀÌ ¾Æ´Ï¶ó º¸ÀÌµµ·Ï */

  /* ³ª¸ÓÁö °íÁ¤/ÆÐµù ¼³Á¤Àº ±×´ë·Î */
  padding: 0px;
  top: 0px;
  height: 60px;
  left: 0;
  right: 0;
  z-index: 999 !important;
  position: fixed;
  text-align: right;
}


  .top_fix_zone #logo {
    /* ·Î°í°¡ º¸ÀÌµµ·Ï */
    display: inline-block;
    /* ·Î°í ÅØ½ºÆ®¶ó¸é »ö»ó, Å©±â µî ÁöÁ¤ */
    color: #fff;
    font-size: 35px; /* ÀûÀýÈ÷ Á¶Á¤ */
    font-weight: bold;

    margin-left: 15px; /* ¿ÞÂÊ ¿©¹é (ÇÊ¿ä½Ã) */
  }
/*Å¾¸Þ´º*/
#topmenu{width: 100%;}
#topmenu ul{width: 100%;}
.top_fix_zone{background-color:#000; padding: 15px 0px 0px 0px; top:0px;}

  #nav {
    display: none;
    position: absolute; 
    top: 70px;         /* Çì´õ ³ôÀÌ ¾Æ·¡·Î */
    left: 0;
    width: 100%;
    background: #000;
    /* ... */
  }
#call{display: block; position:fixed; top:17px; left: 15px; z-index: 10000;}
#call a{z-index: 10000;}
#toggle:checked+#nav{display: block;}
#nav li{display: block; width: 100%; text-align: center; border-top: 1px solid #ccc; padding: 4px;}
label {
  cursor: pointer;
  display: block;
  text-align: center;
  /* ±âÁ¸ÀÇ background °ü·Ã ¼Ó¼º Á¦°Å */
  background: none;

  /* ÅØ½ºÆ® ÇÜ¹ö°Å ¹öÆ°ÀÌ¹Ç·Î ±ÛÀÚ Å©±â¿Í »ö»ó ÁöÁ¤ */
  font-size: 60px;   /* ÀûÀýÈ÷ Á¶Á¤ */
  font-weight: bold;
  color: #fff;       /* Èò»ö ¹öÆ° */

  /* ÆÐµù, Á¤·Ä µîÀº ÇÊ¿ä¿¡ ¸Â°Ô Á¶Á¤ */
  padding: 10px 3% 10px 3%;
  float: right;

}

/* page 00 */
#page00 .main_text{padding:200px 0px 150px 0px;}
#page00 .main_text h2{font-size:70px; line-height:50px;}
#page00 .main_text h2 span{font-size:20px;}

/* page 01 */
#page01 article figure{width: 48%; margin:0px 1% 15px 1%;}
#page01 article figure h4{font-size:18px;}
#page01 article figure h4 span{font-size:34px;}

/* page 03 */
#page03 article figure{margin:5px;}
#page03 article .banner{width:600px; margin:0 auto;}

/* page 04 */
#page04 .page04_con{width:96%; margin:0 auto;}

#page04 .page04_text, #page04 .page04_map{float:none;}
#page04 .page04_text{width:100%; padding-top:30px;}

#page04 .page04_map{width:100%;}
#page04 .page04_map iframe{height:250px;}

/*Æû¸ÞÀÏ*/
.from_con input{width: 400px;}

/*°øÅë*/
.title{font-size: 32px; padding:70px 0px; line-height:40px;}
.title span{display:block; font-size:24px; font-weight:normal;}

    /* °øÅë ÆùÆ® »çÀÌÁî¸¦ 1.2remÀ¸·Î ÁöÁ¤ */
  body,
  td,
  div,
  p,
  ul,
  li,
  dl,
  dt,
  dd,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,

  figure {
    font-size: 1.5rem !important; /* ÇÊ¿ä ½Ã important */
    line-height: 1.4;            /* °¡µ¶¼ºÀ» À§ÇØ ÁÙ°£°Ýµµ Á¶Á¤ ±ÇÀå */
  }  

}

@media all and (max-width: 580px) {
/*Æû¸ÞÀÏ*/
#from_button input{width:100%; height:40px; margin-top:0px;}
.from_con input{width: 200px;}

/* page 00 */
#page00 .main_text{padding:150px 0px 100px 0px;}
#page00 .main_text h2{font-size:46px; line-height:35px;}
#page00 .main_text h2 span{font-size:18px;}

/* page 01 */
#page01{}
#page01 article figure{float:none; width:80%; margin:0px auto 30px auto;}
#page01 article figure h4{font-size:18px;}
#page01 article figure h4 span{font-size:34px;}

/* page 02 */

/* page 03 */
#page03{background:url(/imgs/img3.jpg) top center no-repeat;}
#page03 article figure{margin:10px 0px; float:none;}
#page03 article .banner{width:290px;}

/* page 04 */
#page04 .page04_con{padding:30px 15px;}

#page04 .page04_text br{display:none;}

#page04 .page04_map iframe{height:150px;}

/*°øÅë*/
.title{font-size: 22px; padding:70px 0px 30px 0px; line-height:25px;}
.title span{display:block; font-size:18px;}

}
.services .icon {
  display: inline-block;
  width: 116px;
  height: 116px;
  /* ¾ÆÀÌÄÜÀÇ ½ÇÁ¦ ÆùÆ® Å©±â¸¦ Á¶Á¤ */
  font-size: 70px;  /* ÀûÀýÈ÷ Á¶Àý (¾ÆÀÌÄÜ ÇüÅÂ¿¡ µû¶ó ´Ù¸¦ ¼ö ÀÖÀ½) */
  /* ¼öÁ÷ °¡¿îµ¥ Á¤·Ä¿ë */
  line-height: 116px; 
  text-align: center;
}

.from_title1 {
  text-align: center;
  /* ¿øÇÏ½Ã´Â Ãß°¡ ½ºÅ¸ÀÏ */
  font-weight: bold;  
  color: #333;        
  /* etc... */
}

/* ========== °Ô½ÃÆÇ ¹Ì¸®º¸±â ¼½¼Ç (NOTICE) ========== */
#notice {
  padding: 4rem 1rem;
  background-color: #f9f9f9;
}
#notice article {
  max-width: 1200px;
  margin: 0 auto;
}
.board_preview_wrap {
  background-color: #fff;
  padding: 2rem;
  border-radius: 8px;
}
.board_preview_wrap h2 {
  font-size: 2rem;
  font-weight: bold;
  color: #424242;
  text-align: center;
  margin-bottom: 2rem;
}
.board_preview_list {
  max-width: 800px;
  margin: 0 auto;
}
.board_preview_list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 0;
  border-bottom: 1px solid #e1e1e1;
}
.board_preview_list li a {
  font-size: 1rem;
  color: #333;
  text-decoration: none;
  transition: color 0.2s;
}
.board_preview_list li a:hover {
  color: #b5917a;
}
.board_preview_list li .date {
  font-size: 0.85rem;
  color: #999;
  margin-left: 0.5rem;
}
.more_btn {
  text-align: center;
  margin-top: 2rem;
}
.more_btn a {
  display: inline-block;
  background: #b5917a;
  color: #fff;
  padding: 0.75rem 1.5rem;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 500;
  border-radius: 4px;
  transition: background 0.3s;
}
.more_btn a:hover {
  background: #9e7b63;
}

