@import url("board.css"); 

/*공통*/
.section {
text-align: center;
font-size: 40px;
color: #333;
}

.section.fp-auto-height {
height: auto !important;
}
.inner-box {
margin-top: 120px;
font-size: 28px;
}


.inner { width: 1400px; margin:0 auto; height: inherit; }


.imgbx img {display: inline-block;}


header.white { color: #fff; }
header.black { color: #000; }


[class*="ani"] {
opacity: 0;
transform: translateY(-60px);
}

.mobile_headerWrap {display: none; }


/*헤더 */
#areaHeader {position: fixed; width: 100%;  top:0; z-index: 10; transition-duration:0.4s;
transition-timing-function:ease; }

.headerWrap {position: relative; transition: all 0.2s ease; border-bottom: 1px solid rgba(255,255,255,0.4); padding: 0 5rem;  }

.header {  display: flex; align-items: center; justify-content: space-between; }

.logo{ display: block; width:25rem; height: 3rem; background: url(../images/main/logo.svg)no-repeat;background-size: contain;   }
.logo img{width: 100%; } 


/* GNB */
.gnb_wrap { width: 100%; }
.gnb_wrap > li  {float: left; }
.gnb_wrap > li > a{color:#fff; font-weight: 600; font-size: 2rem;  display: inline-block;  text-align: center; padding: 0 2.6rem; line-height: 100px; border-bottom: 4px solid transparent ; 
transition: all 0.3s ease;}

.gnb_wrap > li > a:hover { border-bottom: 4px solid #566B54; color:#000;  }
.gnb_wrap > li:hover>.gnb_submenu,
.gnb_wrap > li:focus>.gnb_submenu,
.gnb_wrap > li.on > .gnb_submenu {display:block; }

.gnb_submenu { position:absolute; left:0; top:104px; width:100%; display: none;background: #f9f9f9; ;  border-top:1px solid #566B54;  }

.gnb_mnbox { padding: 3rem 0;  display: flex;  justify-content: center; }
.gnb_mnbox > li > a {position:relative; font-size: 1.8rem; padding: 0 20px;  display:inline-block; transition: all 0.1s ease}
.gnb_mnbox > li > a:hover { font-weight:700; }

.snsbx { display: inline-flex; gap:1.6rem; align-items: center ;}

.web_all_btn { display: inline-block;  width: 28px; height: 16px;  background: url(../images/main/all_menu_wh.svg)no-repeat top; background-size: contain }
.insta_btn { display: inline-block;  width: 24px; height: 24px;  background: url(../images/main/insta_icon_wh.svg)no-repeat top; background-size: contain }


#SubWrap .web_all_btn { display: inline-block;  width: 28px; height: 16px;  background: url(../images/main/all_menu.svg)no-repeat top; background-size: contain }








.headerWrap:hover {background: rgba(255, 255, 255,1) ; }
.headerWrap:hover .gnb_wrap > li > a {color:#000; }
.headerWrap:hover h1 a{ background: url(../images/main/logo_bk.svg)no-repeat;background-size: contain;  }
.headerWrap:hover .insta_btn  {  background: url(../images/main/insta_icon.svg)no-repeat center; }

.headerWrap:hover .web_all_btn { background: url(../images/main/all_menu.svg)no-repeat top !important;}

.down { 
height:auto; background-color:#fff !important; 
transition-duration:0.4s; transition-timing-function:ease; 
-webkit-transition-duration:0.4s;
-webkit-transition-timing-function:ease;
}
.down .logo { background: url(../images/main/logo_bk.svg)no-repeat; background-size: contain; }
.down .gnb_wrap > li > a {color:#333; }
.down  .web_all_btn { background: url(../images/main/all_menu.svg)no-repeat top !important;  }
.down  .insta_btn { background: url(../images/main/insta_icon.svg)no-repeat top !important;  }
.headerWrap .snsbx {display: flex; gap:1.2rem; align-items: center; }





/*섹션1*/
.sec1 { position: relative;  height: 100vh; overflow: hidden; }
.videoWrap { width: 100%; height: 100vh; position: absolute; top:0; left:0;   }
.videoWrap video { z-index: -1; object-fit: cover;   width: 100%; height: 100%; background-position: center bottom;  } 
.videoWrap:after {content:''; position: absolute; top:0; left:0; width: 100%; height: 100%; display: block; background: rgba(0,0,0,0.2);  z-index: 3}
.txtwrap { position: absolute; bottom: 0; left:0; height: 100%;  color:#333; width: 100%;   z-index: 100; }
.txtwrap .titlebx { height: 100%;  display: flex; align-items:flex-start; justify-content: center; flex-direction: column; width: 100%;  }

.txtwrap .titlebx h1 {  font-weight: 900; color:#fff; line-height: 1;  letter-spacing: -0.2rem ; font-family: 'montserrat';  text-shadow: 0px 0px 15px rgba(0,0,0,0.5); }
.txtwrap .titlebx h6 {color:#fff;  margin-top: 4rem; }

.outline {
 -webkit-text-fill-color: transparent; font-family: 'Poppins' !important; 
-webkit-text-stroke: 1px #fff; letter-spacing: -0.5rem !important;
display: block; text-shadow:none !important; 
font-weight: 700; 
-webkit-font-smoothing: antialiased;
}

.scroll {position: absolute; bottom:4rem; left:50% ;  transform: translateX(-50%); z-index: 10;  text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column }
.scroll > div { width: 22px; height: 32px; border-radius: 20px; border:2px solid #fff; }
.scroll p {font-size: 1.6rem; color:#fff; text-align: center}
.scroll_wrap {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px; /* dot 간격 */
}
.scroll_dot {
width: 4px;
height: 4px;
background: #fff;
border-radius: 50%;

animation: dropOne 2s ease-in-out infinite;
}

@keyframes dropOne {
0% {
	transform: translateY(4px);
	opacity: 0.2;
}
40% {
	transform: translateY(20px);
	opacity: 1;
}
100% {
	transform: translateY(4px);
	opacity: 0.2;
}
}


/*섹션2*/
.sec2 { display: flex; flex-direction: column;     align-items: flex-start; text-align: left; padding-top: 12rem ; height: 100vh;  }
.section h1 {  font-weight: 900; color:#333; line-height: 1;  letter-spacing: -0.2rem ; font-family: 'montserrat'; }
.sec2 > p { margin-top: 5rem; }

.s2_contents { display: flex;  width: 100%; margin-top: 7rem;  height: 100%; gap:0.1rem }
.s2_contents > a { width: 20%;  display: block;  position: relative ; height: 400px;  transition: all 0.5s ease-out; }
.s2_contents > a:after { content:''; position: absolute; top:0; left:0; width: 100%; height: 100%; display: block; background: rgba(0,0,0,0.5); z-index: 1 }
.s2_contents > a:hover:after  {  background: none;  }
.s2_con1 {background: url(../images/main/s2_img1.png)no-repeat center;  }
.s2_con2 {background: url(../images/main/s2_img2.png)no-repeat center;  }
.s2_con3 {background: url(../images/main/s2_img3.png)no-repeat center;  }
.s2_con4 {background: url(../images/main/s2_img5.png)no-repeat center;  }
.s2_con5 {background: url(../images/main/s2_img4.png)no-repeat center;  }



.s2_contents .txt { position: absolute;  bottom:3.4rem; left:2.4rem; z-index: 4; color:#fff;  }
.s2_contents .txt p{font-size: 2rem; margin-bottom: 0.4rem;  font-family: 'montserrat'; font-weight: 100;text-shadow: 0px 0px 15px rgba(0,0,0,0.3); text-shadow: 0px 0px 15px rgba(0,0,0,0.5);  }
.s2_contents .txt h6 {text-shadow: 0px 0px 15px rgba(0,0,0,0.7); letter-spacing: -0.2rem;  }

.s2_contents > a:hover .s2_arrow { display: block }
.s2_arrow { position: absolute;top:2.4rem; right:2.4rem; z-index: 3 ; display:none }




/*섹션3*/
.sec3 { display: flex;  align-items: center;  justify-content: space-between;  height: 100vh; overflow: hidden; }
.sec3 > div { width: 50%;  }

.s3_content1 {
position: relative;
height: 100vh;
overflow: hidden;
--revealW: 0%;
--imgScale: 1.1;  
}

.s3_content1:before {
content:'';
position:absolute;
top:0;
left:0;
width: var(--revealW);
height:100%;
background: url(../images/main/s3_img1.png) no-repeat center #000;
background-size: cover;
transform: scale(var(--imgScale));   
z-index:1;
transition: none;
}


.s3_content1 .txt {  color:#fff;  text-align: left; padding: 20rem 0 0 4rem; position: relative ; z-index: 4;}
.s3_content1 .txt h1 { color:#fff;  text-align: left; margin-bottom: 4rem;   }
.s3_content1 a:after { content:''; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); z-index: 1; }
.s3_content1 a:hover { }


.s3_content2  { display: flex; flex-direction: column ; width: 100%;  }
.s3_content2 .txt{ text-align: right; padding-right: 6rem;  height: 100%; margin-top: 30rem; }

.s3_content2 .txt h1 {  margin-bottom: 4rem;    }
.s3_content2 a { padding: 1.2rem 4rem; border: 2px solid #222; border-radius: 5rem ;display: inline-block; margin-top: 5rem; font-size: 2.6rem;  }






/*섹션4*/
.sec4 {
position: relative;
overflow: hidden;
--bgScale: 1;
width: 100%; height: 100vh; 
}

.sec4::before {
content: '';
position: absolute;
inset: 0;
background: url(../images/main/sec4_bg.png) no-repeat top center;
background-size: cover;
transform: scale(var(--bgScale));
transform-origin: center center;
z-index: 1;
}



.s4_contianer { padding: 15rem 0 0 0; text-align: left;    position: relative;
z-index: 2;}
.s4_contianer h1  {color:#fff; margin-bottom: 4rem;  }
.s4_contianer p {color:#fff;  }

.s4_slidewrap {margin-top: 4rem; }
.s4_slide {height: 450px;     }
.s4_slide .swiper-slide > a {display: block; width: 100%; height: 100%; display: flex;  align-items: center; justify-content: space-between;      padding: 0 12rem}
.s4_slide .swiper-slide  .imgbx  {width:450px; height: 450px; }
.s4_slide .swiper-slide .imgbx img {width: 100%; height: 100%; object-fit: cover; } 
.s4_slide .swiper-slide  .txtbx { width:620px;  color:#fff;  overflow: hidden; }

.s4_slide .swiper-slide  .txtbx  .cate {display: inline-block;; padding: 1rem 3rem;  color:#fff; border: 1px solid #fff; font-size: 1.8rem; border-radius: 50px; }
.s4_slide .swiper-slide  .txtbx  .tit { margin-top: 20px; font-size: 4rem;font-weight: 200; color:#fff; line-height: 1.2;      overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
max-height: 100px;}

.s4_slide .swiper-slide  .txtbx  .date {color:#B5B5B5; font-size:1.8rem; margin-top: 10rem; font-weight: 300;    }
.s4_slide .swiper-pagination-bullet { width:15px; height: 15px;  background: rgba( 255,255,255,0.8)}
.s4_slide .swiper-horizontal>.swiper-pagination-bullets, .s4_slide .swiper-pagination-bullets.swiper-pagination-horizontal { width: 53%;  left: auto; right: 0; text-align: left ; }

.s4_slide .swiper-button-prev { width: 4.3rem; height: 8.6rem;  background: url(../images/main/s4_prev.svg)no-repeat center;    background-size: contain; left:0 !important;}
.s4_slide .swiper-button-next { width: 4.3rem; height: 8.6rem;   background: url(../images/main/s4_next.svg)no-repeat center;   background-size: contain;  right: 0rem !important; }
.swiper-navigation-icon {display: none; }




/*footer*/


.fp-watermark {display:none !important}

#areaFooter { width: 100%;  padding: 8rem 0;}

footer {
width: 100%;

background: #222;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
}
.footerWrap {display: flex;  justify-content: space-between; align-items: center;}
.footerWrap > div:first-child { width: calc( 100% - 210px); display:flex; flex-direction: column;align-items: flex-start; }
.footerWrap > div:nth-child(2) {  width: 210px; } 
.vistitbx {border: 1px solid #fff;  color:#fff; text-align: center; line-height:50px;  font-size: 1.5rem;  }
.sitebx {position:relative;  border: 1px solid #fff;  color:#fff; text-align: center; line-height:50px; margin-top: 20px; font-size: 1.5rem;}
.sitebx button { color:#fff; }
.sitelink { display:none;  border: 1px solid #fff; width:210px;  position: absolute; top:56px; left:0; right:0;   z-index:99; background:#000; max-height: 250px; overflow-y: auto; }
.sitelink a {color:#fff; padding: 10px 0;border-bottom: 1px solid #fff;  display:block; height: 54px; display: flex; align-items: center; justify-content: center; }
.sitelink a:last-child {border-bottom:0; }
.sitelink a:hover{ text-decoration:underline; }

.persbx {margin: 30px 0; }
.persbx a{position: relative; color:#fff; font-size: 16px; font-weight: 300; padding-right: 80px;  }
.persbx a:before { content:''; position: absolute; top:50%; transform: translateY(-50%); right:30px; width: 1px; height: 16px; display: inline-block; background: #fff; }

.persbx a:last-child:before {display: none; }

.footerWrap p {color:#fff; font-size: 1.6rem !important;  }


.back_bg { display: none;  position: fixed; top:0; left:0; z-index:1;  width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 15;}





/*서브*/

#SubWrap .logo {   background: url(../images/main/logo_bk.svg) no-repeat; background-size: contain ;}
#SubWrap .insta_btn { background: url(../images/main/insta_icon.svg) no-repeat !important}
#SubWrap .gnb_wrap > li > a { color:#333;}
.sub_container {  margin-top: 105px; }
.sub_top {  margin: 0 5%;  height: 60rem;  background-size: cover; display: flex; align-items: center; justify-content: center; flex-direction: column ; padding: 0 3rem; }



.svisual_1 { background: url(../images/contents/s_visual1.png)no-repeat center;}
.svisual_2 { background: url(../images/contents/s_visual2.png)no-repeat center;}
.svisual_3 { background: url(../images/contents/s_visual3.png)no-repeat center;}
.svisual_4 { background: url(../images/contents/s_visual4.png)no-repeat center;}
.svisual_5 { background: url(../images/contents/s_visual5.png)no-repeat center;}
.svisual_6 { background: url(../images/contents/s_visual6.png)no-repeat center;}
.svisual_7 { background: url(../images/contents/s_visual7.png)no-repeat center;}
.svisual_8 { background: url(../images/contents/s_visual8.png)no-repeat center;}

.sub_top h2 {  font-family: 'montserrat'; color:#fff; text-transform:uppercase ;font-weight: 900; text-align: center; line-height: 0.8;   }

.sub_nav {display: flex; gap:1rem; margin-top: 4rem;    }
.sub_nav span {position: relative; line-height: 16px; color:#fff; font-size: 1.6rem; vertical-align: middle; font-weight: 400;  }


.sub_category {  border-bottom: 1px solid #dbdbdb; }
.sub_menu { display: flex ; align-items: center; justify-content: center; height: 100%;;}
.sub_menu a  { position: relative; ; font-size: 2.6rem; color:#8E8E8E; padding: 4rem 3rem; font-weight: 300;  transition:  all 0.2s ease ;   display: block; letter-spacing: -0.02rem; }
.sub_menu a:before , .sub_menu a.on:before{ position: absolute; top: 2rem ; left: 50%; transform: 
translateX(-50%); content:''; width: 10px; height: 10px; border-radius: 50%; display: inline-block;  background: #508062; display: none;;}
.sub_menu a:after , .sub_menu a.on:after{ position: absolute; bottom:0 ; left: 0; content:''; width: 100%; height: 2px;display: inline-block;  background: #508062;  display:none; ;}
.sub_menu a:hover , .sub_menu a.on  { color:#508062 ; font-weight: 600;  } 
.sub_contents { padding: 15rem 0; }
.sub_menu  a:hover:before , .sub_menu  a.on:before{display: inline-block; }
.sub_menu  a:hover:after , .sub_menu  a.on:after {display: inline-block; }


.sub_contents { padding: 10rem 0 ;}
.sub_contents h3 {font-weight: 700;  text-align: center;  letter-spacing: -0.2rem;}

.ver_line { width: 1px; height: 14rem; display: block; background: #000; margin: 4rem  auto;  }

.intro1_cont { display: flex; align-items: flex-end;  justify-content: space-between ; gap:4rem ; margin-bottom: 6rem; }
.intro1_cont > div:first-child  { width: 750px; }
.intro1_cont .txtbx { text-align:left; width:  calc( 100% - 800px);  }
.intro1_cont .txtbx p{ word-break: keep-all ; line-height: 1.6;}
.intro1_cont .txtbx  h3 { margin-bottom: 4rem; }
.desc {  display: flex; flex-direction: column ;gap:2rem;  margin-top: 4rem; }
.desc  > div { display: flex; gap:4rem;  }
.desc  p {font-size: 2rem; }
.desc  p:first-child { width: 85px;  }
.desc  p:nth-child(2) { width:  calc( 100% - 85px); }
.ver_tline { position: relative;  padding-left: 1rem;  }
.ver_tline::before {content:''; position: absolute; top: 6px ; left:0;   width: 0.4rem; height: 2.2rem;  display: inline-block; background: #000; ;}

.intro1_cont2 h3 { margin-top: 16rem } 
.intro1_cont2 .txtbx { display: flex; flex-direction: column ;  gap:2rem; }
.intro1_cont2 .txtbx p {font-size: 2rem; }


.intro1_inbx { display: flex; justify-content: space-between; text-align: center; gap:1rem; margin-top: 4rem; }
.intro1_inbx img {display: inline-block; }
.intro1_inbx > div{  width: 275px; border: 1px solid #CCDEB5; background: #FBFBFB; padding: 4rem 1.6rem;  }
.intro1_inbx > div:nth-child(even) { background: #F7F8F2; }
.intro1_inbx > div h6 { margin:3rem 0 2rem 0 ; }
.intro1_cont2 .intro1_inbx > div p {line-height: 1.4; font-size: 1.8rem;  letter-spacing: -0.06rem;}



/*비전*/
.ho_line { width: 120px; height: 1px; background: #000;  display: inline-block; }

.intro2_cont { display: flex; flex-direction: column;gap:15em; }
.intro2_cont > div > div {display: flex ; justify-content: space-between; margin-top: 4rem; }
.intro2_cont > div h1 { letter-spacing: -0.3rem;}
.intro2_cont > div h6 {line-height: 1.6; margin-top: 2rem;}

/* 연혁 섹션 전체 레이아웃 */
.historyWrap {
display: flex;
gap: 80px;
margin-top: 10rem;
position: relative;
justify-content: space-between;
}

/* 왼쪽 고정 */
.history-left {
width: 32%;
position: sticky;
top: 200px;
align-self: flex-start;
}

.history-left h3 {
font-size: 3.2rem;
font-weight: 700;
margin-bottom: 3rem;
}

.year-display {

font-weight: 900;
color: #508062;
transition: all .3s ease;
}

/* 오른쪽 스크롤 영역 */
.history-right {
width: 50%;
}

.history-item {
margin-bottom: 180px;
opacity: 0;
transform: translateY(60px);
}
.history-item  p { padding: 2rem  0 ;  }
.history-item  p span { font-size: 3.2rem; font-weight: 900; display: block;}
.history-item h4 {
font-size: 3rem;
font-weight: 700;
margin-bottom: 1.2rem;
 margin-top: 20px;
}

.history-item p {
font-size: 2.2rem;
line-height: 1.6;
}


#fp-nav ul li a span { background: #D3D3D3 !important;}


#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span{
height: 12px;
width: 12px;
margin: -6px 0 0 -6px;
border-radius: 100%;
background: #508062 !important;
}

/*랜드마크*/


#SubWrap .landmar2_box p {font-size: 2rem; line-height: 1.6;  }

.landmar2_box:last-child { margin-top: 15rem;  }
.landmarkwrap .title { letter-spacing: -0.3rem; font-weight: 900;  text-align: right ; line-height: 0.9;  margin-top: 7rem;}
.landmarkwrap h3 { font-weight:200; letter-spacing: -0.2rem; text-align: right ; line-height: 0.9; margin-top: 2rem; }
.landmarkwrap .txtbx { margin-top: 10rem;  }

.landmar2_box { display: flex; flex-direction: column;  gap:2rem; ;}
.quest {font-weight: 600; margin-top: 3rem;  }
.landmar2_box .imgbx{margin-top: 2rem; }


.landmarkwrap .desc { margin-top: 4rem; } 
.landmarkwrap h3 { margin-top:10rem; }

.img2box {display: flex; gap:4rem;   flex-wrap: wrap; align-items:flex-end;  width: 100%; height: 100%;  }
.img2box > div { width: calc( 50% - 2rem);   }
.img2box > div img{width: 100%;  }

.landmark2box {margin-top: 15rem; }
.landmark2box .img2box {margin-bottom: 15rem; }
.landmark2box h3{  margin-bottom: 4rem;  }




/*캘린더*/

.gardenvegewrap .calendar {
display: grid;
grid-template-columns: repeat(7, 1fr);
border:1px solid #ccc;
border-collapse: collapse;
max-width: 100%;
font-size: 1.5rem;
margin-top: 1rem; 
}
.gardenvegewrap .cheader {
background: #f8f8f8;
border: 1px solid #ddd;
padding: 8px;
text-align: center;
font-size: 2.2rem;
}
.gardenvegewrap .day {
position: relative;
border: 1px solid #eee;
min-height: 170px;
padding: 5px;
position: relative;
background: #fff;
}
.gardenvegewrap .day a {
text-decoration: none;
color: #333;
}
.gardenvegewrap .day.today {
border: 2px solid #009851;
background: #eef6ff;
}
.gardenvegewrap .day .date {
font-weight: bold;
margin-bottom: 5px;  font-size: 1.8rem;  
}
.gardenvegewrap .day .events {
font-size: 12px;
margin-top: 5px;
}

.plant_name { display: flex; align-items: center; margin-bottom: 1rem ;}
.gardenvegewrap .day .events a {

color: #333; font-size: 1.6rem; font-weight: 500;
display: flex; gap:0.4rem; align-items: center ;
}
.gardenvegewrap .day .plant_name span {font-size: 2rem; font-weight: 300; vertical-align: middle;    }
.gardenvegewrap .day .events a:hover {

color: #009851;
}

.gardencal_sch { display: flex; align-items: center ; justify-content: space-between;}
.gardencal_sch span {font-size: 1.6rem; }

.gardencal_sch  > div {display: flex; align-items: center ; gap:1rem; }
.gardencal_sch  > div span {font-size: 2.6rem; vertical-align: middle; }
.gardencal_sch select { font-size: 1.6rem;padding: 0.0 4rem 0 2rem; border: 1px solid #dbdbdb; line-height: 4.2rem; border-radius: 6px;cursor: pointer;     }
.gardencal_sch .selbx {position: relative ; display: inline-block;  }
.gardencal_sch .selbx::before  { content: "▼"; font-size: 12px;
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
pointer-events: none;
color: #666;  }


.more_plant {  width: 100%;  position: absolute;
right: 0;
bottom: 0; text-align: right;}
.more_plant_bnt {  cursor: pointer; margin: 0 1rem 1rem 0;  }

.more_plant_box {
display: none;
position: absolute;
top: 100%;            /* 버튼 바로 아래 */
right: 0;             /* 오른쪽 정렬 (필요시 left:0) */
margin:0;
min-height: 150px;;
width: 90%;
padding: 1.6rem 1rem;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
background: #fff;
border-radius: 6px;
display: none;        /* 기본 숨김 */
z-index: 10;text-align: left;
}

.more_plant.active .more_plant_box {
display: block;
}



.more_plant_box a { color: #333;
font-size: 1.6rem;
font-weight: 500;
display: inline-flex;
gap: 0.4rem;
align-items: center;}

/*대상지*/
.dolbommap {width: 100%; }
.dolbommap_in { width: 100%; }
.dolbommap a {width: 100%; }
.dolbommap img {width: 100%; }
.dolbommap .root_daum_roughmap  {width: 100% !important;  border-bottom: 1px solid #dbdbdb; }
.dolbommap .root_daum_roughmap .wrap_controllers {display: none; }
.map_marker { background: url(/common/images/contents/map_find_marker.svg)no-repeat center ; display:block;  width:40px; height:48px; padding-top:12px; background-size:contain;  text-align:center; font-size:11px; font-weight:800; letter-spacing: -1px; }
.map_marker_tit {position:absolute; top:-5px; right:0;  background: url(/common/images/contents/map_find_marker.svg)no-repeat center ; display:inline-block; 
background-size: contain; width:30px; height:38px; text-align:center; font-size: 10px; padding-top:8px; font-weight:600;  letter-spacing: -1px;  cursor: pointer;} 

.video-wrap {
  width: 80%;     
  margin: 0 auto;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  overflow: hidden;
}
video {
  width: 100%;
  height: auto;
  display: block;
  background: #000;
}
.video-wrapper {
width: 80%;            /* 가로 폭 60% */
margin: 0 auto;        /* 좌우 중앙 정렬 */   
}

.video-container {
position: relative;
width: 100%;
padding-bottom: 56.25%; /* 16:9 비율 유지 (9/16 = 0.5625) */
height: 0;
overflow: hidden;
}

.video-container iframe,
.video-container video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
border-radius: 8px;
}


.gardenvege2wrap .plantslidewrap { display: flex;  align-items: center ;   justify-content: space-between;  }
.gardenvege2wrap .boardWrap .contents .plant_slide { width: 500px; height: auto; border: 1px solid #dbdbdb;  margin:0; }
.gardenvege2wrap .boardWrap .contents .plant_slide img {width: 100%;}
.gardenvege2wrap .boardWrite .titBox h6 {margin-bottom: 0; }
.gardenvege2wrap .boardWrite .titBox p:nth-child(2) {margin-bottom: 1rem; }

.plantslidewrap .swiper-button-prev, 
.plantslidewrap .swiper-button-next {z-index: 10;}


.plantslidewrap .swiper-button-prev { width: 3rem; height: 6rem;  background: url(../images/main/s4_prev.svg)no-repeat center;    background-size: contain; left:0 !important;}
.plantslidewrap .swiper-button-next { width: 3rem; height: 6rem;   background: url(../images/main/s4_next.svg)no-repeat center;   background-size: contain;  right: 0rem !important; }

.gardenvege2wrap .boardWrap .contents .txtbx {width: calc( 100% - 580px); }
.gardenvege2wrap .boardWrap .contents .txtbx  h4 { margin-bottom: 2rem;  }

.gardenvege2wrap .boardWrap .contents .txtbx > span {font-size: 1.6rem; margin-top: 1rem; display: block;  }

.dot { position: relative ;  padding-left: 1.2rem ;}
.dot:before  {content:''; position: 
absolute ; top: 1rem ;lefT:0;   width: 4px; height: 4px; display: inline-block;    background: #508062; }



.simple-layer {
position: fixed;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
border: 2px solid #333;
background: #fff;
z-index: 1000;
display: none;
max-height: 70vh;     /* 화면 높이의 80%까지만 표시 */
overflow-y: auto;     /* 내용이 넘치면 세로 스크롤 표시 */
box-sizing: border-box;
}
.simple-layer table {
border-collapse: collapse;
width: 1100px;
}
.simple-layer td {
border: 1px solid #ccc;
padding: 10px;
}
.simple-layer .title {
background: #f2f2f2;
font-weight: bold;
text-align: center;
}
.simple-layer .close {
text-align: 

right;
}
.simple-layer-bg {
position: fixed;
inset: 0;
background: rgba(0,0,0,0.4);
display: none;
z-index: 999;
}


.placepopwrap { position: fixed; top:50%; left:50%; transform: translate(-50%, -50%); width: 900px; border: 1px solid #000; height: 500px; background: #fff; z-index: 100; overflow-y: auto; padding: 5rem 4rem; }



/*화성의정원*/
.ofgardenwrap { }
.ofhs_inbox {  margin: 6rem 0 4rem 0;  border: 1px solid #dbdbdb;    }
.ofhs_inbox .imgbx {
position: relative;
width: 100%;
max-width: 1130px;    /* 원본보다 커지지 않게 */
margin: 0 auto;
padding:0;
}

.ofhs_inbox .imgbx img {
width: 100%;
height: auto;
object-fit: contain;
display: block;
}


.mp_bnt { position: absolute;   width: 3rem; height: 3.8rem; background: url(../images/contents/mp_icon.png)no-repeat center; background-size: contain;   }

.mp_bnt:after {
padding: 0.4rem 1.2rem; background: #fff; border-radius: 40px;border:1px solid #4FB985; 

position: absolute;
left: 50%;
bottom: -26px;
transform: translateX(-50%);
font-size: 1.4rem; font-weight: 600; 
color: #167949;
white-space: nowrap;
opacity: 0;
transition: opacity .25s ease, transform .25s ease;
}

/* hover */
.mp_bnt:hover::after {
opacity: 1;
transform: translateX(-50%) translateY(4px);
}
/* 버튼 위치: 1130 x 600 기준 px → % 변환 */

/* left 사용하던 애들 */
.mp_bnt01 { top:35.0000%; left:42.4779%; }
.mp_bnt01:after{ content:'활초리 마을정원'; }

.mp_bnt02 { top:56.6667%; left:47.7876%; }
.mp_bnt02:after{ content:'우리꽃식물원'; }

.mp_bnt03 { top:73.3333%; left:46.9027%; }
.mp_bnt03:after{ content:'치유정원'; }

.mp_bnt04 { top:74.0000%; left:51.3274%; }
.mp_bnt04:after{ content:'구문천3리 초록마을정원'; }

.mp_bnt05 { top:51.6667%; left:54.8673%; }
.mp_bnt05:after{ content:'수줍은 분홍정원'; }

.mp_bnt06 { top:15.6667%; left:54.8673%; }
.mp_bnt06:after{ content:'아빈의 뜰'; }

/* right 사용하던 애들 (right 그대로, 단위만 % 로 변경) */
.mp_bnt07 { top:23.3333%; right:30.0885%; z-index: 2; }
.mp_bnt07:after{ content:'정조마을정원'; }

.mp_bnt08 { top:27.3333%; right:27.4336%; }
.mp_bnt08:after{ content:'텃밭정원'; }

.mp_bnt09 { top:26.6667%; right:24.2478%; z-index: 2; }
.mp_bnt09:after{ content:'병점가든파크'; }

.mp_bnt10 { top:28.3333%; right:18.5841%; z-index: 2; }
.mp_bnt10:after{ content:'예당공원'; }

.mp_bnt11 { top:51.3333%; right:19.4690%; }
.mp_bnt11:after{ content:'꽃구름정원'; }

.mp_bnt12 { top:34.6667%; right:21.2389%; }
.mp_bnt12:after{ content:'용사마을 둘레길 정원'; }

.mp_bnt13 { top:14.3333%; right:17.3451%; }
.mp_bnt13:after{ content:'다랭이 빛물정원'; }

.mp_bnt14 { top:26.6667%; right:15.0442%; }
.mp_bnt14:after{ content:'사계정원'; }

.mp_bnt15 { top:35.3333%; right:10.6195%; }
.mp_bnt15:after{ content:'그로잉가든'; }

.mp_bnt16 { top:26.3333%; right:7.9646%; }
.mp_bnt16:after{ content:'치동천 힐링마을정원'; }

.mp_bnt17 { top:18.6667%; right:10.9735%; }
.mp_bnt17:after{ content:'이음정원'; }

.mp_bnt18 { top:36.6667%; right:5.3097%; }
.mp_bnt18:after{ content:'목동길 정원'; }

.mp_bnt19 { top:46.0000%; right:13.2743%; }
.mp_bnt19:after{ content:'다랭이원'; }

.mp_bnt20 { top:46.6667%; right:15.7522%; }
.mp_bnt20:after{ content:'네스트가든'; }

.mp_bnt21 { top:60.6667%; right:14.3363%; }
.mp_bnt21:after{ content:'운답원'; }





/*대상지*/
.introwrap .ofhs_inbox {  }
.introwrap .ofhs_inbox .imgbx {position: relative; height: auto; margin:0 auto; max-width: 1130px ;    } 
.introwrap .ofhs_inbox .imgbx img {margin: 20px 0;}
.introwrap .mp_bnt { position: absolute;   width: 34px; height: 50px; background: url(../images/contents/mp_icon.png)no-repeat center; background-size: contain;   }



.introwrap .mp_bnt:after {
border: 1px solid #4A72BA;
color: #4A72BA; z-index: 3;

}
.mpd_bnt01 { top:16.3333%; right:20.0796%; }
.mpd_bnt01:after{ content:'패밀리 풀'; }

.mpd_bnt02 { top:31.6667%; right:22.5398%; }
.mpd_bnt02:after{ content:'예당공원'; }

.mpd_bnt03 { top:14.0000%; right:16.5133%; }
.mpd_bnt03:after{ content:'근린공원 10호'; }

.mpd_bnt04 { top:14.0000%; right:12.5133%; }
.mpd_bnt04:after{ content:'큰재봉공원'; z-index: 1; }

.mpd_bnt05 { top:23%; right:10.85%; }
.mpd_bnt05:after{ content:'근린공원 18호'; z-index: 1; }

.mpd_bnt06 { top:26.0000%; right:14.5133%; }
.mpd_bnt06:after{ content:'소공원 1호'; }

.mpd_bnt07 { top:32%; right:10.5133%;}
.mpd_bnt07:after{ content:'경부고속도로 상부공원'; }

.mpd_bnt08 { top:38.6667%; right:7.5398%; }
.mpd_bnt08:after{ content:'여울공원'; }

.mpd_bnt09 {  top:50.0000%; right:14.5133%; }
.mpd_bnt09:after{ content:'자라뫼공원'; }

.mpd_bnt10 { top:45.3333%; right:23.0796%;  }
.mpd_bnt10:after{ content:'오산천일대'; }

.mpd_bnt11 { top:56.3333%; right:19.0796%;  }
.mpd_bnt11:after{ content:'소공원 2호'; }

.mpd_bnt12 {  top:41%; right:26.0796%;   }
.mpd_bnt12:after{ content:'노작공원'; }

.mpd_bnt13 { bottom:20.6667%; left:52%; }
.introwrap .mpd_bnt13:after{
content:'우리꽃 식물원';
border: 1px solid #F8C028;
color: #FF8800;
}
/*

.mpd_bnt01 { top:5.3333%; left:57.0796%; }
.mpd_bnt01:after{ content:'패밀리 풀'; }

.mpd_bnt02 { top:0.6667%; left:50.4425%; }
.mpd_bnt02:after{ content:'예당공원'; }

.mpd_bnt03 { top:2.0000%; right:34.5133%; }
.mpd_bnt03:after{ content:'근린공원 10호'; }

.mpd_bnt04 { top:0.6667%; right:28.3186%; }
.mpd_bnt04:after{ content:'큰재봉공원'; z-index: 1; }

.mpd_bnt05 { top:10.3333%; right:27.8496%; }
.mpd_bnt05:after{ content:'근린공원 18호'; z-index: 1; }

.mpd_bnt06 { top:18.6667%; right:31.8584%; }
.mpd_bnt06:after{ content:'소공원 1호'; }

.mpd_bnt07 { top:20.3333%; right:23.0088%; }
.mpd_bnt07:after{ content:'경부고속도로 상부공원'; }

.mpd_bnt08 { top:31.6667%; right:23.5398%; }
.mpd_bnt08:after{ content:'여울공원'; }

.mpd_bnt09 { top:46.3333%; right:31.5044%; }
.mpd_bnt09:after{ content:'자라뫼공원'; }

.mpd_bnt10 { top:40.0000%; right:41.2389%; }
.mpd_bnt10:after{ content:'오산천일대'; }

.mpd_bnt11 { top:50.6667%; right:37.6991%; }
.mpd_bnt11:after{ content:'소공원 2호'; }

.mpd_bnt12 { top:30.3333%; right:43.0088%; }
.mpd_bnt12:after{ content:'노작공원'; }

.mpd_bnt13 { bottom:14.6667%; left:44.7788%; }
.introwrap .mpd_bnt13:after{
content:'우리꽃 식물원';
border: 1px solid #F8C028;
color: #FF8800;
}

*/






.gaedenvegewrap { }
.gaedenvegewrap .imgbx img{ border: 1px solid #dbdbdb;}
.gaedenvegewrap .txtbx {     display: flex;
flex-direction: column;
gap: 2rem;}
.gaedenvegewrap .btnbx {text-align: center; margin-top: 8rem;  }
.gaedenvegewrap .btnbx a { font-size: 2rem; padding: 2rem 5rem; border: 1px solid #508062; border-radius: 40px; ;  color:#508062  ; transition:box-shadow 0.4s ease, background 0.34s ease; }
.gaedenvegewrap .btnbx a:hover { box-shadow: inset 300px 0 0 0 rgba(31,72,46,0.7); color:#fff;background: rgba(80,128,98,0.9); }

.exhibox {border-top: 1px solid #333; padding: 6rem 0; display: flex; align-items: center; gap:5rem; flex-direction: column; gap:4rem;  }
.exhibox > div { position: relative ; display: flex; gap: 40px ; align-items: center ;  padding-bottom: 5rem; border-bottom: 1px solid #dbdbdb; width: 100%;     justify-content: space-between; }
.exhi_schbox { display: flex; align-items: center ;flex-direction: column ; justify-content: space-between; padding: 3rem 0; gap:1rem }
.exhi_schbox > div  {display: flex; gap:1rem; align-items: center ;  }
.exhi_schbox input { width: 320px; height: 5rem; border: 1px solid #dbdbdb; border-radius: 0.4rem; padding: 0.4rem 2rem ;}
.exhi_schbox select { height: 5rem; border: 1px solid #dbdbdb; border-radius: 0.4rem;  padding: 0.4rem 2rem ; background: url('data:image/svg+xml;utf8,<svg fill="black" height="18" viewBox="0 0 24 24" width="18" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat right 10px center;
padding-right: 30px;}
.exhi_schbox span {font-size: 1.8rem; }
.exhibox > div .imgbx {  width: 400px; height: auto;  }
.exhibox > div .imgbx img {width: 100%; object-fit: contain;  }
.exhibox > div .txtbx { width: calc( 100% - 500px); display: flex; flex-direction: column; gap:2rem}
.exhibox > div .txtbx h5 {padding-bottom: 2rem; border-bottom: 1px solid #dbdbdb; margin-bottom: 2rem;  }
.exhibox > div .txtbx p {font-size: 1.8rem; }
.exhi_schbnt { height: 50px;  border-radius: 0.4rem; text-align: center; font-size: 1.8rem; padding: 0 4rem; box-sizing: border-box; background: #508062 ; color:#fff; } 
.exhibox > div .viewbtn { width: 184px; font-size: 1.8rem; border: 1px solid #508062;  border-radius: 0.4rem; margin-top: 2rem; background: url(../images/contents/view_btn.png)no-repeat  90%  center ; display: inline-block;  padding:1.2rem 6rem 1.2rem 3rem ; color:#508062;  transition: all 0.3s ease-in-out;   }
.exhibox > div .viewbtn:hover {background: url(../images/contents/view_btn_wh.png)no-repeat  90%  center #508062; color:#fff; font-weight: 600; }



.exhi_view_wrap { width: 80% !important; margin:0 auto;  border-bottom:0 !important  ; display: flex;  flex-direction: column; gap: 0 !important }

.exhi_tag { display: flex; align-items: center ; justify-content: center; font-size: 1.8rem;  border-radius: 50%; width: 80px; height: 80px; background: #102168; color:#fff; font-weight: 300;   }



.board_info .viewbtnW { width: 184px; font-size: 1.5rem; border: 1px solid #508062;  border-radius: 0.4rem; margin-top: 1rem; background: url(../images/contents/view_btn.png)no-repeat  80%  center ; display: inline-block;  padding: 0.8rem 6rem 0.8rem 3rem; color:#508062;  transition: all 0.3s ease-in-out;   }
.board_info .viewbtnW:hover {background: url(../images/contents/view_btn_wh.png)no-repeat  90%  center #508062; color:#fff; font-weight: 600; }



.sitemapWrap {display: none; overflow: hidden; position: fixed; top:50%;  left:50%; transform: translate(-50%, -50%); width: 1400px; height: 700px;  padding: 54px 0;  background: #fff;  z-index: 100;  box-sizing: border-box; overflow-y: hidden;  }

.sitemapWrap .imgbx { padding-left: 80px; }
.sitemap_nav {overflow-y: auto;
height: 100%; padding-bottom:50px; }
.sitemap_dep1 { display: flex ; flex-wrap: wrap; width: 100%; gap:3rem; padding: 0 80px  } 
.sitemap_dep1 > li  {display: flex; flex-direction:column;  padding: 40px 0;   width: 280px; gap:4rem;  }
.sitemap_dep1 > li > a {font-size: 2.6rem;  font-weight: 600; width: 100%; padding-bottom: 2rem;   border-bottom: 2px solid #333; text-align: center ;}
.sitemap_dep2 {display: flex; flex-direction: column; gap:2rem;  padding: 0 2rem; }
.sitemap_dep2 > li {}
.sitemap_dep2 > li > a {position: relative; font-size:1.8rem; font-weight: 500;  padding-left: 12px; display: block; }
.sitemap_dep2 > li > a:before { content:''; display: block; width: 5px; height: 5px; background: #6E461E; border-radius: 50%;  position: absolute; top:8px; left:0;}
.sitemap_dep3 > li {margin-top: 10px; }
.sitemap_dep3 > li > a {font-size: 1.6rem; padding-left: 16px;  }


.sitemap_close {position: absolute; top:44px ; right:50px; display: block; width: 36px;height: 36px; background: url(../images/main/close_icon_b.svg)no-repeat center; text-indent: -9999px; }




.coloring { width: 50%; margin:0 auto; border: 1px solid #dbdbdb; }
.coloring img{width: 100%; }


.landmarkwrap .btnbx {display:flex; justify-content: center; margin-top: 8rem;  }
.landmarkwrap .btnbx a {
font-size: 2rem;
padding: 2rem 5rem;
border: 1px solid #508062;
border-radius: 40px;
color: #508062;
transition: box-shadow 0.4s ease, background 0.34s ease;
}

.landmarkwrap .btnbx a:hover {  box-shadow: inset 400px 0 0 0 rgba(31,72,46,0.7); color:#fff;background: rgba(80,128,98,0.9); }

.landmark_link:hover { font-weight: 600; color:#508062; border-bottom: 1px solid #508062;  }

.web {display:block !important;}
.mob {display:none !important;}


.board_schbx { position: relative; ;}
.gardenplantswrap .boardWrap .board_schbx > p {  }
.mini_cate {  display: flex; align-items: center; width: auto; gap:0.5rem; justify-content: center; }
.mini_cate  button { position: relative; ; font-size: 1.6rem;   border-bottom:3px solid #dbdbdb;  padding:0rem 2rem 1rem 2rem ;   }
.mini_cate  button:hover , .mini_cate  button.on {border-bottom: 3px solid  #000; font-weight: 800; ;}


.board_schbx {align-items:center; }
.gardenplantswrap .bd_sch {gap:1rem; }


.site_list {width: 100%;  }
.site_list h5{ padding-bottom: 1rem; border-bottom: 1px solid #dbdbdb; margin-top: 6rem; margin-bottom:2rem;    }
.site_list > p { margin-top: 2rem; font-weight: 600; margin-left: 2rem; color:#1F5B51;   }
.site_list  ul {margin-top: 1rem; display: flex; gap: 1.6rem; padding: 0 2rem;     flex-wrap: wrap;  overflow: hidden; }
.site_list li p {}
.site_list li { width: calc(50% - 1rem) ;  display: flex; align-items: center; padding: 2.4rem 4rem; border: 1px solid #DBDBDB; border-radius: 1rem;  background: #FBFBFB; justify-content: space-between;   }
.site_list li  a { font-size: 2.2rem; display: inline-flex ; gap:1rem; ; }
.site_list li  a.gobtn  {
 background: #508062 ;
   padding:1.6rem 4rem; 
    border-radius: 20px;
    text-align: center;
    color: #fff;
    font-weight: 500; transition:  all 0.3s ease;
}
.site_list li  a:hover { color: #1F5B51;}



.gaedenveg_box { display:flex; gap: 2rem;flex-direction: column; }
.gaedenveg_box .imgbx{margin-top: 3rem; } 


.ofgarden_go { display: flex;
    margin-top: 1.4rem;
    height: 100%;
    justify-content: center; }
   
.ofgarden_go a {
font-size: 1.8rem;
    padding:1.2rem 5rem;
    border: 1px solid #508062;
    border-radius: 40px;
    color: #508062;
    transition: box-shadow 0.4s ease, background 0.34s ease;
}

.ofgarden_go a:hover {  box-shadow: inset 400px 0 0 0 rgba(31,72,46,0.7); color:#fff;background: rgba(80,128,98,0.9); }




/*반응형*/

@media (max-width: 1440px){    
.inner{ width: 100%; padding: 0 3%; }






.s4_slide .swiper-slide > a { gap:4rem; }
.s4_slide .swiper-slide .imgbx { width: calc( 50% - 2rem ); }
.s4_slide .swiper-slide .txtbx { width: calc( 50% - 2rem );}


.sitemapWrap {width: 90%; }
.sitemap_dep1 > li { width: calc( 33.3% - 2rem)}






}

@media (max-width: 1280px
){  


.logo { width: 15rem; }
#SubWrap p { font-size: 2rem; }



.headerWrap { padding: 0 3rem; }
.gnb_wrap > li > a { padding: 0  1.6rem  ; font-size: 1.7rem; }




.sub_top { height: 40rem; } 
.intro1_cont { }
.intro1_cont > div:first-child { width: 50%; }
.intro1_cont .txtbx { width: 50%;}


#fp-nav {z-index: 9 !important; }

.exhibox > div .imgbx { width: 400px; }
.exhibox > div .txtbx { width: calc( 100% - 440px);}

.mp_bnt:after { z-index: 2 !important;}


}





@media (max-width: 1024px){ 


#areaHeader { height: 60px; }
.headerWrap {display: none; }

.header {display: none; }
.mobile_headerWrap { position: fixed; top:0; display: flex;  width: 100%; height: 70px; align-items: center ; padding: 0 3%;  }
.mob_logo { }    
.mobile_headerWrap .web_all_btn { position: absolute; top: 50%; transform: translateY(-50%); right:3%;  background: url(../images/main/all_menu_wh.svg)no-repeat; background-size: contain;  text-indent: -9999px }

#SubWrap .mobile_headerWrap .web_all_btn  { background: url(../images/main/all_menu.svg) no-repeat;}

#areaHeader .close {  width: 40px; height: 40px; padding: 0; background: url(../images/main/mob_close.svg)no-repeat;   background-size:contain; text-indent: -9999px }



.mobile .mob_allbnt {position: absolute; top:50%; transform: translateY(-50%); left: 3% ; cursor: pointer; width:50px; height:50px;  background: url(../images/main/allmenu.svg) no-repeat; ; background-size: contain;  border:none; color:#fff; }
.mobile > h1  {text-align: center;  }
.mobile > h1 a {line-height: 0; display: block;  }
.mobile > h1 a img {width:45%; }
.mobile .mob_allbnt:hover {}
.mobile .mobile_inner { position: fixed; width: 100%; top: 0; left: 0; background: #fff; height: 100%; margin-left: 100%; overflow-y: auto; z-index: 999;}

.mobile_inner .top_m { display: flex; height: 60px; padding: 0 16px;    align-items: center; justify-content: space-between;   border-bottom:1px solid #dbdbdb; }  

.top_m h1 a {background-size: contain;  display: inline-block; width: 16.5rem;
height: 4.4rem;    }
.top_m h1 img  {width: 100%; }
.top_m a {font-size: 12px; }
.accordion_wrap { } 
.que{ position: relative; padding: 12px; cursor: pointer; font-size:2rem;   font-weight:400;  text-align:left; border-bottom:1px solid #dbdbdb; color:#232323; font-weight: 600;  }
.que:after {content:'+'; position:absolute; top:50%; transform:translateY(-50%);  right:16px; font-size:22px; font-weight:100; color:#508062 ;  }
.accordion_wrap .on { background: #508062  ;  color:#fff; } 
.accordion_wrap .on > div {color:#fff; }
.anw { display: none;  padding: 0 16px; overflow: hidden; background-color: #f9f9f9; }
.anw a { display: block; padding: 10px; font-size: 1.8rem; border-bottom:1px solid #dbdbdb;   }
.anw > a { font-size: 1.8rem; }
.mob_depth1 {font-weight: 600;  font-size: 2rem !important; }
.accordion_wrap .on:after  {color:#fff; }



.mobile .mobile_inner li {margin: 5px 0;}
.mobile .close:hover {}
.mobile .mobile_inner li a {padding: 4px 12px;  }
.mobile .mobile_inner li a:hover {background: #fff;}

.mobile_inner .mdep1 {font-size: 16px; font-weight: 700; }  
.mobile_inner .mdep2 {font-size: 14px; font-weight: 600; padding :0 15px; margin:0 }     

.twodep_menu { display: none; }

.back_bg { z-index:8; display: none;}



.sub_top { margin: 0; }
.sub_nav { margin-top: 2rem; }
.sub_container { margin-top: 70px; }
.sub_category { display: none ;}

.intro1_cont {align-items:flex-start }
.intro1_inbx {flex-wrap: wrap; } 
.intro1_inbx > div { width: calc( 50% - 0.5rem);}


.intro2_cont > div > div img{ width: 50%;  }


.sitemapWrap {display: none;}

}





@media (max-width: 960px) {


.logo { width: 16.5rem; } 
.txtwrap .titlebx h1 {text-align: left ;}


.sec2 { padding-top: 10rem;  }
.sec2 > p  { margin-top: 2rem; } 

.s2_contents { flex-direction: column;  margin-top: 4rem; gap: 0.2rem;}
.s2_contents > a { width: 100%;  height: 19%;  background-size: cover;;}

.sec3 { flex-direction: column; ;}
.sec3 > div { width: 100%; height: 50%;} 
.sec3 h4 { font-size: 2rem; }

.s3_content2 .txt {  margin-top: 0; display: flex; ;flex-direction: column ; height: 100%;         justify-content: center;  }
.s3_content2 .txt a{ font-size: 2.2rem;  }

.s4_contianer {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center; padding: 7rem 0 0 0}
.s4_slide { height: 100% ;}
.s4_slide .swiper-slide > a {flex-direction: column ; height: 100%; gap:2rem; }
.s4_slide .swiper-slide .imgbx { width:  100% ; height: 300px;  }

.s4_slide .swiper-slide .imgbx  img{width: 100%; height: 100%; object-fit: cover ;  }
.s4_slide .swiper-slide .txtbx { width: 100%;  height: auto; }
.s4_slide .swiper-pagination {display:none !important; }
.s4_slide .swiper-button-prev { width: 3.2rem; height: 6.6rem ;}
.s4_slide .swiper-button-next { width: 3.2rem; height: 6.6rem ;}
.s4_slide .swiper-slide .txtbx .tit { font-size: 3rem; }
.s4_slide .swiper-slide .txtbx .date{margin-top: 4rem; } 
.sub_top { height: 34rem; }
.intro1_cont { flex-direction: column ;}
.intro1_cont > div:first-child { width: 100%; }
.intro1_cont .txtbx { width: 100%; }
.intro1_cont  img { width: 100%; }




.footerWrap { display: block; }
.footerWrap > div:first-child {width: 100%; }
.persbx {margin:16px 0;}
.persbx a {font-size: 12px; padding-right: 30px; }

.persbx a:before {right:15px; height: 12px;  }
.footerWrap > div:nth-child(2) { width: 100%; display: flex; align-items: center; justify-content: space-between; margin-top: 20px;  }
.vistitbx {width: 48%; font-size: 12px; line-height: 40px;  }
.sitebx {width: 48%; margin-top: 0; font-size: 12px;  line-height: 40px;  }
.footerWrap .img {text-align: center; }
.sitelink { top:-120px; width:100%; height: 118px; overflow-y:auto; }

.gardenvege2wrap .plantslidewrap {flex-direction: column; gap:4rem;   }
.gardenvege2wrap .boardWrap .contents .txtbx h4 {border-bottom: 1px solid #dbdbdb;padding-bottom: 1rem; }
.gardenvege2wrap .boardWrap .contents .plant_slide { width: 100%; height: auto; }
.gardenvege2wrap .boardWrap .contents .txtbx { width: 100%; }


.exhibox > div { flex-direction: column ;}
.exhibox > div .imgbx {width: 100%; height: auto; line-height: 0; }
.exhibox > div .txtbx { width: 100%; }
.exhi_schbox input {width: 140px; }
.exhi_schbox select {  }
.exhi_schbnt { height: 40px; }
.exhi_view_wrap {width: 100% !important; }
.coloring { width: 100%; }

}



@media (max-width: 768px) {


.calendarwrap {overflow-x: auto ;}
.gardenvegewrap .calendar {max-width: 900px; width: 900px; }
.gardenvegewrap .day .events a { font-size:1.7rem; }

.intro2_cont > div h6 {margin-bottom: 2rem;}
.intro2_cont > div > div{ flex-direction: column ; }
.intro2_cont > div > div img{width: 100%; } 
.historyWrap {gap:2rem; margin-top: 4rem; }
.history-left{ width: calc( 35% - 2rem); }
.history-right { width: 65%; }
.year-display { font-size: 5rem; }

 .mp_bnt { width: 10px; height:10px; display:none;   }
}

@media (max-width: 600px) {



.s2_con1 { background: url(../images/contents/s2_m_img1.png)no-repeat center;}
.s2_con2 { background: url(../images/contents/s2_m_img2.png)no-repeat center;}
.s2_con3 { background: url(../images/contents/s2_m_img3.png)no-repeat center;}
.s2_con4 { background: url(../images/contents/s2_m_img4.png)no-repeat top center;}
.s2_con5 { background: url(../images/contents/s2_m_img5.png)no-repeat center;}

.s2_contents > a:after {background: rgba(0,0,0,0) ;}
.s2_contents .txt h6 {color:#fff;text-shadow: 2px 3px 15px rgba(0, 0, 0, 0.9); }
.s2_contents .txt p {color:#fff; font-weight: 300;  }

.sub_top h2 { font-size: 6rem; }
.fp-right {display: none;}
.sec2 > p { margin-top: 1rem; }
.s2_contents {margin-top: 2rem; }
.sec3 h1 { font-size: 6rem; }
.sec3 > div > a { display: block; height: 100%; overflow: hidden; }

.s3_content1 .txt {width: 100%; display: flex; flex-direction: column ; justify-content: center; } 



.ver_tline::before { top: 4px; }
.s4_slide .swiper-slide .imgbx { height: 230px; }


.s4_slide .swiper-slide > a  {padding: 0 ;}
.s4_slide .swiper-button-next { top: 16rem !important;  }
.s4_slide .swiper-button-prev { top: 16rem !important;  }
.intro1_inbx > div { width:100%;} 
.footerWrap .img { width: 180px; }

.img2box { flex-direction: column;}
.img2box > div {width: 100%; }

.s3_content2 {display: flex; flex-direction: column; width: 100%; height: 100%;  }
.s3_content2 .txt  {padding-right:4rem;  }


.exhi_schbox > div { 
flex-wrap: wrap;
justify-content: center;}
.exhi_schbnt { padding: 0 10rem; }
.ver_line { height: 8rem; }
.exhibox > div .viewbtn { width: 128px; background-size: 20px auto; margin-top: 0;  }



.web {display:none !important;}
.mob {display:block !important ;}



.gardenplantswrap .photo_list {margin-top:2rem; }
.mini_cate {margin-top:2rem; width: 100%;    align-items: flex-end;  }
.mini_cate button {font-size: 1.6rem; word-break: keep-all; padding: 1rem;  flex:1; }
.site_list li {padding: 2rem 4rem; width: 100%;     align-items: flex-start; flex-direction: column ;  }
.site_list li  a.gobtn { display: none; ;}
.site_list li .material-symbols-outlined  {font-size: 1.8rem; }
.site_list li > div {width: 100%; }
.site_list li a { display: block; width:100%; box-sizing: border-box ; 
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;}


	.gardenplantswrap  .board_schbx { margin-top:1rem; }
.gaedenvegewrap  {word-break: keep-all; }
.gaedenveg_box .imgbx{margin-top: 0; }   
}
