@charset "euc-kr";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url("//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css");
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

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:100%;
  -webkit-text-size-adjust:none;
}

img{border:0;}

h1, h2, h3, h4, h5, figure, p, iframe{
  padding: 0px; margin: 0px; font-weight: normal;
}
ul, li{padding:0px; margin:0px; list-style:none;}

#fixNextTag article{width: 1200px; margin: 0 auto;}
.top_text{margin-bottom:45px;}
.top_text h2{
  font-size:40px; 
  font-family:'Nanum Square'; 
  font-weight:bold;
}
.top_text h3{
  font-size:28px; 
  font-family:'Nanum Square'; 
  font-weight:bold;
}
.top_text .bar{
  width:100%; 
  height:2px; 
  margin:10px 0px;
}
#logo {
  font-size: 30px;       /* 원하는 폰트 크기 */
  font-weight: bold;     /* 두께 */
  color: #fff;           /* 색상 */
  /* 필요 시 다른 스타일들... */
}
/* page 00 
   --------------------------
   화면 윗부분부터 백그라운드가 꽉 차도록 
   - background-position: center center
   - background-size: cover
   - background-attachment: fixed (필요 시 조정)
*/
#page00 {
  position: relative;   /* 자식이 absolute로 정렬될 때 기준이 될 컨테이너 */
  background: url(/imgs/img4.jpg) center center no-repeat; 
  background-attachment: fixed;
  background-size: cover; 
  padding: 360px 0 50px 0; /* 예: 상단만 260px, 하단은 0 (또는 필요시 여백) */
}

#page00 article h2{
  width:445px; 

  
  margin:0 auto 60px auto;
}
.board_preview_wrap h2 {
  margin: 0 !important;
}
/* 
   첫 번째 figure: height를 고정값 대신 auto(혹은 최소 높이)
   내부에 padding을 부여해 board_preview_wrap이 
   자연스럽게 들어가도록 수정
*/
#page00 article figure:nth-child(1) {
  background: #fff;
  margin: 5px 15px 0px 0px;
  padding: 30px;
  box-sizing: border-box;
  height:510px; 
}

#page00 article figure:nth-child(2) h5,
#page00 article figure:nth-child(3) h5,
#page00 article figure:nth-child(4) h5,
#page00 article figure:nth-child(5) h5 {
  border-left: 5px solid #fff;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  font-family: 'Nanum Square';
  padding-left: 5px;

  /* 아래 부분 추가 */
  margin-left: 10px;   /* 왼쪽 여백 */
  margin-top: 10px;    /* 상단 여백 */
}


#page00 article figure {
  width:390px; 
  float:left; 
  box-sizing:border-box;
  /* 아래 nth-child(1) 외에는 그대로 유지 */
}


#page00 article figure:nth-child(2){
  height:250px;
  margin:0px 15px 15px 0px; 
  background:url(/imgs/img1.jpg) center center no-repeat; 
  background-size: cover;
}
#page00 article figure:nth-child(3){
  height:250px;
  margin:0px 0px 15px 0px; 
  background:url(/imgs/img2.jpg) center center no-repeat; 
  background-size: cover;
}
#page00 article figure:nth-child(4){
  height:250px;
  margin:0px 15px 0px 0px; 
  background:url(/imgs/img3.jpg) center center no-repeat; 
  background-size: cover;
}
#page00 article figure:nth-child(5){
  height:250px;
  margin:0px 0px 0px 0px; 
  background:url(/imgs/img4.jpg) center center no-repeat; 
  background-size: cover;
}







/* page 01 */
#page01 {
  padding:120px 0px 60px 0px;
}
#page01 article h2{color:#8c6238;}
#page01 article .bar{background:#8c6238;}
#page01 article h3{color:#8c6238;}

#page01 article .banner .img{
  float:left; 
  width:330px; 
  height:330px; 
  background:url(/imgs/img4.jpg) top center no-repeat; 
  background-size: cover;
  border-radius:50%; 
  margin-right:120px;
}
#page01 article .banner .con{
  float:left; 
  width:700px; 
  padding:30px 0px 0px 0px;
}
#page01 article .banner .con h4{
  font-size:26px; 
  font-family:'Nanum Square'; 
  font-weight:bold; 
  color:#424242; 
  margin:0px 0px 35px 0px;
}
#page01 article .banner .con h4 span{
  display:block; 
  font-size:40px; 
  margin:0px 0px 15px 0px;
}

/* page 02 */
#page02{
  background:url(/imgs/img5.jpg) bottom center no-repeat; 
  background-attachment: fixed; 
  padding:120px 0px 60px 0px;
}
#page02 article h2{color:#fff;}
#page02 article .bar{background:#fff;}
#page02 article h3{color:#fff;}

#page02 article .banner{width:1120px; margin:0 auto;}
#page02 article figure{
  width:525px; 
  height:625px; 
  text-align:center; 
  box-sizing:border-box; 
  border:20px solid #d4d4d2; 
  background:#fff; 
  float:left;
}
#page02 article figure .img{
  width:100%; 
  height:265px;
}
#page02 article figure h3{
  font-size:28px; 
  font-family:'Nanum Square'; 
  font-weight:bold; 
  color:#424242; 
  margin:25px 0px;
}
#page02 article figure .normal{
  font-size:18px; 
  font-family:'Nanum Square'; 
  font-weight:bold; 
  padding:0px 30px;
}

#page02 article figure:nth-child(1){margin:0px 70px 70px 0px;}
#page02 article figure:nth-child(2){margin:0px 0px 70px 0px;}
#page02 article figure:nth-child(3){margin:0px 70px 0px 0px;}
#page02 article figure:nth-child(4){margin:0px 0px 0px 0px;}

/* 이미지 cover */
#page02 article figure:nth-child(1) .img{
  background:url(/imgs/img1.jpg) center center no-repeat;
  background-size: cover;
}
#page02 article figure:nth-child(2) .img{
  background:url(/imgs/img2.jpg) center center no-repeat;
  background-size: cover;
}
#page02 article figure:nth-child(3) .img{
  background:url(/imgs/img3.jpg) center center no-repeat;
  background-size: cover;
}
#page02 article figure:nth-child(4) .img{
  background:url(/imgs/img4.jpg) center center no-repeat;
  background-size: cover;
}

/* page 03 */
#page03 article{
  height:435px; 
  float:left;
}
#page03 article:nth-child(1){
  width:45%; 
  background:#8c6238; 
  position:relative;
}
#page03 article:nth-child(2){width:55%;}

#page03 article:nth-child(1) .box{
  width:450px; 
  position:absolute; 
  top:115px; 
  right:0px;
}
#page03 article:nth-child(1) h2{
  font-size:30px; 
  color:#fff; 
  font-weight:lighter;
}
#page03 article:nth-child(1) h2 span {
  display: block;
  font-size: 60px;
  font-family: 'Nanum Square';
  margin-bottom: 20px; /* 하단 여백 추가 */
}
#page03 article:nth-child(1) .bar{
  width:70px; 
  height:2px; 
  background:#fff; 
  margin:35px 0px;
}
#page03 article:nth-child(1) .normal{
  font-size:18px; 
  color:#fff;
}

/* page 04 */
#page04{
  padding:120px 0px 60px 0px; 
  background:#464646;
}
#page04 article h2{color:#fff;}
#page04 article .bar{background:#fff;}
#page04 article h3{color:#fff;}

/* copy */
footer{background:#2b2b2b;}
.copy{
  padding:50px 0px;
  font-size:10pt; 
  color:#fff; 
  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: 78%;}
#topmenu h1{width: 22%;}
#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:14pt; 
  font-weight: bold; 
  padding-right: 20px; 
  line-height:26pt;
  
}

.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: 22%; 
  height:26px; 
  background:url(/logo.png) left top no-repeat; 

}

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;}

#online #from_one{width:580px; float:left;}
#online article #from_one:nth-child(1){margin:0px 40px 0px 0px;}
#online article #from_one .normal{
  font-size:16px; 
  color:#fff; 
  font-family:'Nanum Square'; 
  font-weight:bold;
}
#online article #from_one .normal span{
  display:block; 
  font-size:30px; 
  margin:0px 0px 10px 0px;
}

.from_con{
  width:100%; 
  height:30px; 
  margin-bottom: 15px;
}
.from_con input{
  width:576px; 
  height:30px; 
  color:#535353; 
  font-size:16px; 
  border:1px solid #e0e0e0;
}
textarea{
  width:576px; 
  height: 140px; 
  color:#535353; 
  font-size:16px; 
  border:1px solid #e0e0e0;
}

#from_button{
  margin-top:20px;
}
#from_button input{
  width:100%; 
  font-family:'Nanum Square'; 
  text-align:center; 
  font-size:18px; 
  font-weight:bold; 
  color:#ba9257; 
  padding: 10px 0px; 
  box-sizing:border-box; 
  border:2px solid #ba9257; 
  background:#fff;
}


/* 게시판 미리보기 박스 최상단(타이틀) 스타일 */
.board_preview_wrap {
  text-align: center; /* 안의 모든 인라인 요소를 가로 중앙 정렬 */
}

/* ul 자체를 inline-block으로 만들어서 
   부모의 중앙정렬 효과를 받도록 */
.board_preview_wrap ul {
  display: inline-block; 
  text-align: left;  /* ul 내부의 실제 텍스트는 왼쪽 정렬 */
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 미리보기 타이틀 h2 간격/크기 조정 */
.board_preview_wrap h2 {
  margin: 0 0 15px 0 !important; /* 아래쪽만 15px */
  font-size: 24px;               /* 예시로 조금 크게 */
  font-family: 'Nanum Square';   /* 필요시 지정 */
  font-weight: bold;
  color: #333;
  line-height: 1.3;
}


.board_preview_wrap ul li {
  position: relative; /* float 요소가 li 내부에서 정상적으로 배치될 수 있도록(선택) */
  margin: 0 0 10px 0; 
  padding: 0 0 10px 0;
  border-bottom: 1px solid #ddd;
}
/* 게시글 제목 링크 스타일 */
.board_preview_wrap ul li a.notice-title-link {
  font-size: 14px;
  color: #333;
  text-decoration: none;
  font-weight: bold;
}
.board_preview_wrap ul li a.notice-title-link:hover {
  color: #ba9257; /* 마우스오버 색상(예시) */
}

/* 날짜 표시 스타일 */
.board_preview_wrap ul li .date {
  display: inline-block;
  margin-left: 110px;
  font-size: 12px;
  color: #666;
}

/* 본문 토글 영역 스타일 */
.board_preview_wrap .notice-detail-content {
  display: none;      /* 토글 전 숨김 */
  margin-top: 8px;    /* 제목/날짜와의 간격 */
  padding: 10px;
  background: #f9f9f9;
  border: 1px solid #eee;
  border-radius: 4px;
  line-height: 1.4;
  color: #444;
}
/* #notice 섹션 배경을 흰색으로 */
#notice {
  width: 100%;               /* 화면 전체에 배경색/배경이미지를 채우고 싶다면 100% */
  max-width: 1200px;         /* 최대 폭 1200px로 제한 */
  margin: 0 auto;            /* 브라우저 중앙에 위치 */
  background: #fff;          /* 필요하다면 배경색 지정 */
  text-align: center;        /* 텍스트 중앙 정렬 */
  padding: 80px 0;           /* 상/하단 여백 */
  box-sizing: border-box;     /* 혹은 border-box 권장 */
}

/* 내부 컨테이너를 최대 1200px로 제한하고 가운데 정렬 */
#notice .section-inner {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;   /* 글자나 inline 요소를 중앙에 배치하려면 */
}
/* 내부 article 최대 너비 지정 */
#notice > article {
  max-width: 800px;
  margin: 0 auto;
}

/* 큰 제목 (h3) 스타일 */
#notice h3 {
  font-size: 2em;
  font-weight: bold;
  margin-bottom: 15px;
  color: #333;  /* 짙은 색 글자 */
}

/* h3 안의 span 조금 작게 */
#notice h3 span {
  display: block;
  font-size: 0.65em;
  margin-top: 5px;
  color: #999;  /* 좀더 연한 회색 */
}

/* 일반 텍스트(.normal) 스타일 */
#notice .normal {
  font-size: 1em;
  line-height: 1.5;
  margin-bottom: 20px;
  color: #666; 
}

/* 구분바 */
#notice .bar {
  width: 80px; 
  height: 2px; 
  background: #ccc; 
  margin: 20px auto;
}

/* 소제목 (h4) */
#notice h4 {
  font-size: 1.4em;
  margin-bottom: 10px;
  color: #444;
  font-weight: bold;
}

/* 두 번째 설명 텍스트(.normal02) */
#notice .normal02 {
  margin-bottom: 15px;
  font-size: 0.95em;
  color: #555;
}

/* 상담 전화번호 영역(.num) */
#notice .num {
  margin-top: 20px;
  font-size: 1em;
  color: #333;
}

/* 번호 강조(span) */
#notice .num span {
  display: inline-block;
  font-size: 1.4em;
  font-weight: bold;
  margin-right: 10px;
  color: #ba9257; /* 포인트 색상(예시) */
}

/* 상담 신청 버튼 예시 */
#notice a[href="#page04"] {
  display: inline-block;
  margin-top: 25px;
  padding: 12px 30px;
  font-size: 1em;
  font-weight: bold;
  color: #fff;
  background: #ba9257; /* 버튼 배경색 (예시) */
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.3s ease;
}

#notice a[href="#page04"]:hover {
  background: #a17e45; /* 호버 시 진한 배경색 */
  color: #fff; 
}
/* 반응형 */
/* 반응형 */
@media all and (max-width: 992px) {
  #logo {
    font-size: 45px !important;   /* 기존 30px보다 더 크게 */
  }
  /* 게시판 미리보기 타이틀 h2 크게 */
  .board_preview_wrap h2 {
    font-size: 2.0rem !important; /* 원하는 크기로 변경 */
    line-height: 1.3;
  }

  /* 게시판 미리보기 글 링크 크게 */
  .board_preview_wrap a.notice-title-link {
    font-size: 1.6rem !important; /* 공지사항 제목 등 */
    line-height: 1.4;
  }

  /* 본문 내용 더 크게 */
  .board_preview_wrap .notice-detail-content {
    font-size: 1.4rem !important;
  }  
  /* 1) 햄버거 토글용 체크박스는 화면에서 숨김 */
  #toggle { display: none;    width: 100% !important; 
    margin: 0; /* 가운데 정렬 대신 전체 꽉 채우려면 */ }

  /* 2) 햄버거(≡) 아이콘 */
  .hamburger,               /* 기존 클래스 */
  label.hamburger {         /* label 태그를 쓸 때 */
    display: block;
    position: absolute;
    top: 0px; 
    right: 15px;
    font-size: 60px;!important; 
    font-weight: bold;
    color: #333;
    cursor: pointer;
    z-index: 9999;
    background: none;
    border: none;
  }
  .hamburger:hover {
    color: #555;
  }

  #topmenu {
    width: 100% !important; 
    margin: 0; /* 가운데 정렬 대신 전체 꽉 채우려면 */
    /* padding이나 다른 여백도 조정 필요 */
  }
  /* 3) 기본 nav 는 숨김 */

  #nav {
    width: 100% !important;  /* <- 여기서 문법 오류 제거 */
    display: none;
    position: absolute;
    top: 60px;
    left: 0;
    background: #000;
    flex-direction: column;
    align-items: center;
    z-index: 9998;
    margin: 0;
    padding: 0;
  }
  #fixNextTag article {
    width: 100% !important;
    margin: 0 !important;
    /* padding 등 다른 여백 조정도 필요하면 추가 */
  }
  /* 4) 체크되면 nav 펼침 */
  #toggle:checked ~ #nav {
    display: flex;          /* flex(세로) 표시 */
  }

  /* 5) 메뉴 항목 스타일 – 드롭다운용 */
  #nav li {
    width: 100%;
    border-bottom: 1px solid #eee;
    text-align: center;
    margin: 0;   /* list 스타일에 따라 필요시 리셋 */
    padding: 0;
  }
  #nav li a {
    display: block;
    width: 100%;
    padding: 12px 0;
    color: #333;
    text-decoration: none;
  }
  #nav li a:hover {
    background: #f5f5f5;
  }

  /* page 00 */
  #page00 article .banner {
    width: 98%;
    margin: 0 auto;
  }
  #page00 article figure {
    height: 220px;
    padding: 15px;
  }
  #page00 article figure:nth-child(1) {
    width: 100%;
    margin: 0 0 15px 0;
    height: auto;
  }
  #page00 article figure:nth-child(2) {
    width: 49%;
    margin: 0 2% 15px 0;
  }
  #page00 article figure:nth-child(3) {
    width: 49%;
    margin: 0 0 15px 0;
  }
  #page00 article figure:nth-child(4) {
    width: 49%;
    margin: 0 2% 0 0;
  }
  #page00 article figure:nth-child(5) {
    width: 49%;
    margin: 0;
  }

  /* page 01 */
  #page01 article {
    width: 98%;
    margin: 0 auto;
  }
  #page01 article .banner .img {
    float: none;
    margin: 0 auto;
  }
  #page01 article .banner .con {
    float: none;
    width: 100%;
    padding: 50px 0 0 0;
    text-align: center;
  }

  /* page 02 */
  #page02 article {
    width: 98%;
    margin: 0 auto;
  }
  #page02 article .banner {
    width: 100%;
  }
  #page02 article figure {
    width: 49%;
    height: auto;
  }
  #page02 article figure .img {
    height: 235px;
  }
  #page02 article figure h3 {
    font-size: 24px;
  }
  #page02 article figure .normal {
    font-size: 16px;
  }

  #page02 article figure:nth-child(1) {
    margin: 0 2% 15px 0;
  }
  #page02 article figure:nth-child(2) {
    margin: 0 0 15px 0;
  }
  #page02 article figure:nth-child(3) {
    margin: 0 2% 0 0;
  }
  #page02 article figure:nth-child(4) {
    margin: 0;
  }

  /* page 03 */
  #page03 article {
    width: 100%;
    height: 300px;
    float: none;
  }
  #page03 article:nth-child(1) {
    width: 100%;
  }
  #page03 article:nth-child(2) {
    width: 100%;
  }
  #page03 article:nth-child(1) .box {
    width: 100%;
    top: 45px;
    text-align: center;
  }
  #page03 article:nth-child(1) h2 {
    font-size: 30px;
  }
  #page03 article:nth-child(1) h2 span {
    font-size: 60px;
  }
  #page03 article:nth-child(1) .bar {
    margin: 35px auto;
  }
  #page03 article:nth-child(1) .normal {
    font-size: 18px;
    color: #fff;
  }

  /* page 04 */
  #page04 article {
    width: 98%;
    margin: 0 auto;
  }
  #page04 #online {
    width: 100%;
    margin: 0 auto;
  }
  #online article #from_one .normal {
    margin-top: 20px;
  }
  #online #from_one {
    width: 100%;
  }
  #online article #from_one:nth-child(1) {
    margin: 0;
  }
  .from_con input {
    width: 100%;
  }
  textarea {
    width: 100%;
  }
  
    /* 공통 폰트 사이즈를 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;            /* 가독성을 위해 줄간격도 조정 권장 */
  }  
  #notice {
    padding: 60px 0;
  }
  #notice .section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;    !important;    /* 꼭 추가하기 */
    text-align: center;    /* 필요하다면 텍스트도 중앙 정렬 */
  }
  
.top_fix_zone {
    background-color: none;
    top: 0px;
    width: 100%;
    padding: 20px 0px;
    top: 0px;
}  
}
