
  
:root {
    --mainColor :#1f7945;
}

@font-face {
    font-family: 'InkLipquid';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


.NotoSans { font-family: 'Noto Sans KR', sans-serif;}
.NanumSquare {font-family: 'NanumSquare','Noto Sans KR', sans-serif; }
.Pretendard {font-family: 'Pretendard','Noto Sans KR', sans-serif; }
.InkLipquid {font-family: 'InkLipquid','Noto Sans KR', sans-serif; }
  
  
 /* common */
 * { margin: 0; padding: 0; outline: none; box-sizing: border-box;}
body {margin: 0; padding: 0; -ms-overflow-style: none; scrollbar-width: none; }
body::-webkit-scrollbar {display: none;}
html { scroll-behavior: smooth; }
html, body {font: 400 16px/1.3 'NanumSquare','Noto Sans KR', sans-serif;  color: #000000; width: 100%; position: relative; overflow-x: hidden;}
ul, li {list-style: none;}
a {text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent;}
button {font-family: inherit;  border: none; background-color: transparent;  outline: 0; cursor: pointer;}

body.hidden { overflow: hidden;}
body::before { content: "";  position: fixed;  left: 0;  top: 0;  width: 100%;  height: 100%; background-color: rgba(0,0,0,0.15); z-index: 99;  transition: all 0.4s ease; opacity: 0; pointer-events: none;cursor: pointer;}
body.hidden::before { opacity: 1;  pointer-events: auto;}
  
.container {width: 100%; position: relative;}
.mob {display: none !important;}
.mob2 {display: none !important;}
.pc {display: block !important;}
.img-full {max-width: 100%;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.inner {position: relative; width: 90%; max-width: 980px; margin: auto;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after { content: none;}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after { content: none;}  
  
@keyframes fadeIn {
    0% { opacity: 0;}
    100% { opacity: 1; }
}


/* top navbox */
.top_navbox { position: relative;  width: 100%;  background-color: #ddb850;  padding: 0.65rem 0;}
.top_navbox .top_nav { display: flex; justify-content: flex-end; gap: 2.25rem;}
.top_navbox .top_nav a.link { display: block; font-size: 0.750rem;  font-weight: 700; transform: skewX(-0.3deg); color: #ffffff;}

  
/*header*/
.header { width: 100%; position: relative; z-index: 90; }
.header .h_inner { position: relative;  width: 100%;  max-width: 980px;   display: flex; justify-content: space-between;  margin: auto;  transition: all 0.4s ease;  gap: 1rem;}
.header .h_logo {  position: relative;  width: 28%;  max-width: 246px;  display: flex; align-items: center;}
.header .h_logo > a {display: block; width: 100%;}
.header .h_nav_box { flex: 1;}
.header .h_nav_box .h_nav {  width: 100%;  display: flex;  justify-content: flex-end;  align-items: flex-start;  gap: 2.5rem;}
.header .h_nav_box .h_nav > li {position: relative;}
.header .h_nav_box .h_nav > li > .link { display: flex;  align-items: center;  height: 8.438em;  transition: all 0.2s ease-in;  font-size: 1rem;  font-weight: 700;  color: #2a2a2a;  transform: skew(-0.3deg);}
.header .h_nav_box .h_nav > li:hover > .link { color: #ffc75d;}
.header .h_nav_box .h_nav_ul { position: absolute; top: 70%; left: 50%;  transform: translateX(-50%);  background-color: #2a2a2a;  padding: 1rem 1.5rem;  box-sizing: border-box;  display: flex;  flex-direction: column;  align-items: flex-start;  gap: 0.5rem; white-space: nowrap; opacity: 0; pointer-events: none;   transition: all 0.25s ease;}
.header .h_nav_box .h_nav_ul > li {  position: relative;  width: 100%;}
.header .h_nav_box .h_nav_ul > li > a {  display: block;  font-size: 0.9rem;  font-weight: 500;  color: #fff;  padding: 0.25rem 0;  transition: all 0.25s ease-in;  transform: skew(-0.3deg); }
.header .h_nav_box .h_nav_ul > li > a:hover {color: #ffc75d;}
.header .menu_icon { position: relative; width: 34px; align-self: center;  cursor: pointer;}
    
.header .h_nav_box .h_nav > li:hover .h_nav_ul { opacity: 1;  pointer-events: auto;}


  
/* nav box */
.nav_box { width: 80%; max-width: 365px; height: 100%; box-sizing: border-box; position: fixed; top: 0; right: -365px;  background-color: #ddb850; overflow-y: scroll; overflow-x: hidden;  -ms-overflow-style: none; z-index: 100; display: flex; flex-direction: column;  transition: all 0.4s ease; pointer-events: none; box-shadow: 0px 0px 22px rgba(70,75,90,0.45);}
.nav_box.open { pointer-events: auto; right: 0;}
.nav_box::-webkit-scrollbar {display: none; }

.nav_box .nav_head { display: flex;  align-items: center;  justify-content: space-between;  padding: 1.5rem 2rem;  border-bottom: 1px solid #abbfd4;}
.nav_box .nav_close { width: 25px; height: 25px;  cursor: pointer;  display: flex; align-items: center; justify-content: flex-start;}
.nav_box .nav_head .top_nav { display: flex; align-items: center; gap: 1.5rem;}
.nav_box .nav_head .top_nav > li.link { font-size: 1.25rem; font-weight: 700;  letter-spacing: 0.01em; color: #fff;}
.nav_box .nav_head .top_nav > li.link a { display: block; transform: skewX(-0.03deg);}
.nav_box .nav_head .top_nav > li.bar { display: block; width: 1px; height: 1.5rem; background-color: #fff;}

.nav_box .nav {  width: 100%;  flex: 1;  display: flex;  flex-direction: column; }
.nav_box .nav > li { position: relative;  width: 100%;  border-bottom: 1px solid #abbfd4;  padding: 1rem 2rem;}
.nav_box .nav > li .tit { position: relative;  font-size: 1.5rem;  font-weight: 800; color: #fff; padding-right: 1.1rem;}
.nav_box .nav > li .tit.arrow::after { content: "";  background: url(../img/menu_arrow.png) no-repeat center / 1.1rem auto; position: absolute;  right: 0;  top: 0;  width: 1.1rem; height: 1.1em;  transition: all 0.25s ease;}
.nav_box .nav > li.show .tit.arrow::after { transform: rotate(-180deg);}
.nav_box .nav_ul { display: none; margin-top: 1rem; padding-left: 1.5rem;}
.nav_box .nav_ul li { position: relative;  font-size: 1.125rem;  color: #ffffff;  padding-left: 1rem;}
.nav_box .nav_ul li + li { margin-top: 0.75rem;}
.nav_box .nav_ul li::before { content: "-"; position: absolute; left: 0;  top: 0;}
.nav_box .nav_ul li > a { display: block; transform: skew(-0.03deg);}
 
 

/* footer */
.footer { position: relative; }
.footer .f_top { position: relative;  width: 100%; background-color: #2a2a2a;}
.footer .f_top .inner {  display: flex;  align-items: center;  justify-content: space-between;  gap: 1rem;}
.footer .f_top .f_nav { display: flex; align-items: center; gap: 0.75rem;}
.footer .f_top .f_nav > li { font-size: 0.813rem; letter-spacing: -0.025em;  color: #ffffff;}
.footer .f_top .f_nav > li .f_link { display: block; transform: skewX(-0.3deg);}
.footer .f_top .f_nav > li.bar { width: 1px; height: 1em; background-color: #fff;}
.footer .f_top .top_btn { width: 3.75rem;  height: 3.75rem;  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  gap: 0.15rem;  background-color: #5d5d5d;  color: #fff;  font-size: 0.813rem;  letter-spacing: 0.05em;}
.footer .f_top .top_btn .txt { font-weight: 800;  transform: skewX(-0.3deg);  display: block;}
.footer .f_bottom { position: relative;  width: 100%;  background-color: #ddb850; padding: 2.5rem 0;}
.footer .f_bottom .inner { display: flex;  align-items: center;  justify-content: space-between; gap: 1rem;}
.footer .f_bottom .f_info { display: flex;  flex-direction: column;  gap: 0.85rem;}
.footer .f_bottom .f_info .f_txt { font-size: 0.813rem;  color: #fff;  letter-spacing: 0.045em;  transform: skewX(-0.3deg);}
.footer .f_bottom .f_logo { width: 30%; max-width: 234px;  margin-top: 1rem;}



.m_titbox {  position: relative;}
.m_titbox.mb { margin-bottom: 3rem;}
.m_txt1 { font-size: 2.25rem;  font-weight: 800;  color: #424242;}
.m_txt2 { font-size: 1rem; font-weight: 300; color: #a0a0a0;  transform: skewX(-0.03deg); margin-top: 0.25rem;}
.m_txt3 {  font-size: 1.75rem;  font-weight: 700;  color: #2a2a2a; word-break: keep-all;}
