@charset "utf-8";


/*메인비주얼*/
#main_visual{position:relative; z-index:1;  overflow:hidden; }
#main_visual ul{position:relative; z-index:1;}
#main_visual li{position:relative;background-position:center center;  width:100%;  background-repeat:no-repeat; background-size:cover; height: 820px;  }
#main_visual .swiper-pagination{position:absolute; z-index:10; bottom:1em; width:100%; }
#main_visual .swiper-pagination-bullet{position:relative; width:.5em; height:.5em;margin:0 .1em;  background:#000; opacity:1; border-radius:1em; transition: all 0.3s ease; }
#main_visual .swiper-pagination-bullet-active{width:3em;}
#main_visual .controll{position:absolute; top:50%; z-index:3; padding:0;height:0; left:0; right:0;  display:none}
#main_visual .controll a{position:absolute; top:-1em; width:2em; height:2em; line-height:2em; text-align:center; font-size:2em; padding:0; margin:0; background:rgba(0,0,0,.6); border:0; cursor:pointer; color:var(--color-bgw); border-radius:2em; text-shadow: 0 0 .2em rgba(0,0,0,.5)}
#main_visual .controll .swiper_prev{left:0; transform:rotateY(180deg)}
#main_visual .controll .swiper_next{right:0;}

#main_visual article{position:absolute;  color:#FFF; text-align:center; left:0; right:0; bottom:0; top:0; z-index:4; text-shadow: .2em .2em .2em rgba(0,0,0,.5);

display: flex;justify-content: center; flex-direction: column; padding-top: 8rem;
}
#main_visual article h4{position:relative;font-size:2.4em; line-height:140%; font-weight:700; }
#main_visual article h6{position:relative;font-size:1.6em; line-height:140%; font-weight:700; }

/*visual animation */
#main_visual article h4{opacity:0;top:5rem;  transition: all 1s ease; transition-delay:0; }
#main_visual article h6{opacity:0;top:5rem;  transition: all 1s ease; transition-delay:500ms; }
#main_visual article p{opacity:0;top:5rem;  transition: all 1s ease; transition-delay:1000ms; }
#main_visual .swiper-slide-active article h4{letter-spacing:0; top:0; opacity:1}
#main_visual .swiper-slide-active article h6{letter-spacing:0; top:0; opacity:1}


@media (max-width:750px){
#main_visual li{height: 80vw;}
#main_visual article h4{font-size:2em; }


}


#nma{padding:3em; background-color: #fff; display: flex; justify-content: center; text-align: center;}
#nma a{width: 210px;}
#nma a + a{border-left:1px solid transparent; 
  border-image: repeating-linear-gradient(
    to bottom,
    #7BA05B 0,
    #7BA05B 10px,
    transparent 10px,
    transparent 20px
  ) 1;
}

@media (max-width:750px){
  #nma{padding:2em 0; }
  #nma a img{width: 4em;}
  #nma a{width: 25%;}
}

#nmb{padding:3em 0; position:relative; overflow: hidden; background: linear-gradient(  to bottom,  rgba(233, 234, 234, 0) 0%,  rgba(233, 234, 234, 0.5) 60%,  #e9eaea 100%);}
#nmb > dl{width: 820px; margin:0 auto; display: flex;}
#nmb > dl > dt{width: 50%}
#nmb > dl > dt h6{ color: #4c712d;}
#nmb > dl > dt h4{ font-size:2.778em; font-weight: 600;}
#nmb > dl > dt a{display: inline-block; background-color: #4c712d; color:#FFF; border-radius: 6px; padding:0 .5em; line-height: 1.8;transition: all .3s ease;}
#nmb > dl > dt a:hover{ background-color: #5F8A38;}
#nmb > dl > dd{position:relative; width: 50%}
#nmbSlide{position:relative; width: 50vw; overflow: hidden;}
#nmbSlide article{position:relative;}
#nmbSlide article .swiper-slide{width: 400px; padding-bottom:1em}
#nmbSlide article .swiper-slide img{border-radius: 1em;}
#nmbSlide article .swiper-slide footer{display: flex; justify-content: space-between; line-height: 3rem; margin-top: 1em; height:3rem}
#nmbSlide article .swiper-slide footer strong{ font-size: 2em;}
#nmbSlide article .swiper-slide footer div {display: flex; gap: 5px; }
#nmbSlide article .swiper-slide footer div span{background-color: #4C712D; color: #FFF; padding:0 .5em; border-radius: 6px;}

@media (max-width:750px){
  #nmb{padding:3em 1em;}
  #nmb > dl{width:auto; display: block;}
  #nmb > dl > dt{width: auto}
  #nmb > dl > dd{width: auto; margin-top: 2em;}
  #nmbSlide{width: auto;}
  #nmbSlide article .swiper-slide{width:260px;}
  #nmbSlide article .swiper-slide footer strong{ font-size: 1.5em;}

}

#nmc{padding:3em; display: flex; justify-content: center; text-align: center; gap: 13px;}
#nmc a{position: relative; width: 195px; background-color: #4C712D; color: #FFF; padding:30px 0; transition: all .3s ease;}
#nmc a:hover{background-color: #5F8A38;}
#nmc a:before{position:absolute; inset: 10px; border:1px solid #FFF; content: "";}
#nmc a p{font-weight: 600; font-size: 1.444em; margin-bottom:.5em; line-height: 1.3;}

@media (max-width:750px){
  #nmc{padding:2em 1em; gap: 5px;}
  #nmc a{width: 25%; padding:20px 0; }
  #nmc a:before{inset: 5px;  }
  #nmc a p{font-size: 1em;}
  #nmc a img{width: 4em;}
}


#nmd{padding:3em; position: relative; overflow: hidden; background: linear-gradient(  to bottom,  rgba(233, 234, 234, 0) 0%,  rgba(233, 234, 234, 0.5) 60%,  #e9eaea 100%);}
#nmd .wrap{width: 820px;}
#nmd header h6{ color: #4c712d;}
#nmd header h4{ font-size:2.778em; font-weight: 600;}
#nmdSlide{position:relative; padding:2em 5em}
#nmdSlide .swiper-slide{position:relative; border-radius: 1em; overflow: hidden; transform: scale(.6); transition: all .5s ease;}
#nmdSlide .swiper-slide.swiper-slide-active{transform: scale(1);}
#nmdSlide .controll{position:absolute; top:50%; z-index:3; padding:0;height:0; left:0; right:0;}
#nmdSlide .controll a{position:absolute; transform: translateY(-50%); cursor: pointer;}
#nmdSlide .controll .swiper_prev{left:0}
#nmdSlide .controll .swiper_next{right:0}

@media (max-width:750px){
  #nmd{padding:2em 1em;}
  #nmd .wrap{width:100%;}
  #nmd header h4{ font-size:2em;}

}

#nme{padding:3em; position: relative; overflow: hidden;}
#nme dl{position: relative; width: 820px; margin:0 auto; display: flex; justify-content: space-between;}
#nme dl > dd{width: 48%; background-color: #F9F9F9; padding:1.5em; border-radius: 1em;}
#nme dl > dd > header{ display: flex; justify-content: space-between; border-bottom: 1px solid #ccc; padding:.5em 0; }
#nme dl > dd > ul{font-size: .8em;  margin-top: 1em;}
#nme dl > dd > ul li{display: flex; justify-content: space-between;  line-height: 2em;}
#nme dl > dd > ul li a{width: calc(100% - 6em); position: relative;white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;}
#nme dl > dd > ul li span{width: 6em; text-align: right;}

@media (max-width:750px){

  #nme{padding:2em 1em; }
  #nme dl{width: 100%; display: block;}
  #nme dl > dd{width: auto; margin-top: 1em;}
  #nme dl > dd > header{font-size: 1.2em;}
  #nme dl > dd > ul{font-size: 1em; }
}



#nmfooter{padding:3em 0; background-color: #F6F6F6; text-align: center; border-top: #939393;}
#nmfooter header h6{ color: #4c712d;}
#nmfooter header h4{ font-size:2.778em; font-weight: 600;}
#nmfooter dl{display: grid; grid-template-columns: 1fr 500px; gap: 80px; margin-top: 2em;}
#nmfooter dl dt{position:relative}
#nmfooter dl dt .root_daum_roughmap{width: 100%; height:100%;}
#nmfooter dl dt .root_daum_roughmap .wrap_map{width: 100%; height:100%;}
#nmfooter dl dd{text-align: left; padding:3em 0}
#nmfooter dl dd h5{ font-size: 2.2em; margin-bottom: 1em;}
#nmfooter dl dd ul {padding-left:1.8em}
#nmfooter dl dd ul li{position:relative; margin-top: 1em;}
#nmfooter dl dd ul li i{position:absolute; left:-1.8em;}
#nmfooter dl dd ul li big{font-size: 1.94em}

@media (max-width:750px){
  #nmfooter{padding:2em 0; }
  #nmfooter header h4{ font-size:2em;}
  #nmfooter dl{display: block;}
  #nmfooter dl dt{height:60vw}
  #nmfooter dl dd{padding:2em 1em}
  #nmfooter dl dd ul li i{position:absolute; left:-2em; width: 1.6em;}
  


}